jQuery DataTable點擊標題

我使用jQuery數據表顯示以下信息。 ID，標題，地址，城市，ZipCode ID中的行只包含鏈接到產品的詳細信息頁面的鏈接，這很好，但是文本顯示每個行都有「View」。這很愚蠢。我想要隱藏/刪除Id列並使標題可點擊，即當標題被點擊時，用戶應該被轉移到詳細信息頁面。換句話說，我希望標題列接管Id列的功能。jQuery DataTable點擊標題

這是我的代碼。

$(document).ready(function() { 

    $('#myDataTable').dataTable({ 
     "bServerSide": true, 
     "sAjaxSource": "DataTable/AjaxHandler", 
     "bProcessing": true, 
     "aoColumns": [ 
         { "sName": "ID", 
          "bSearchable": false, 
          "bSortable": false, 
          "fnRender": function (oObj) { 
           return '<a href=\"' + oObj.aData[0] + '\">View</a>'; 
          } 
         }, 
         { "sName": "TITLE" }, 
         { "sName": "ADDRESS" }, 
         { "sName": "CITY" }, 
         { "sName": "ZIPCODE" } 
        ] 
    }); 
});

我使用MVC 2.0

希望這是有道理的。

來源

2012-03-06 Ovis

$(document).ready(function() { 

$('#myDataTable').dataTable({ 
    "bServerSide": true, 
    "sAjaxSource": "DataTable/AjaxHandler", 
    "bProcessing": true, 
    "aoColumns": [ 
        { "sName": "ID", 
         "bSearchable": false, 
         "bSortable": false, 
         "fnRender": function (oObj) { 
          return '<a href=\"' + oObj.aData[0] + '\">View</a>'; 
         } 
        }, 
        { "sName": "TITLE", 
         "fnRender": function (oObj) { 
         var al = oObj.aData[0].split('>');       
         var al2 = al[0].split('=');       
         var al3 = al2[1].split('/');       
         return "<a href='\" + al3[al3.length-1] + "'>"oObj.aData[1] + "</a>"; 
        },"aTargets": [1]

}，{ 「SNAME」：「ADDRESS」}，{ 「SNAME」：「CITY」}，{ 「SNAME」：「ZIPCODE」} ] }）; }）;

可能是幫助，這也許不是完美的它可能工作

隱藏列，你可以嘗試以下鏈接 show/Hide column in datatable

來源

2012-03-06 20:55:35

Hi Amritpal Singh！您提供的代碼不起作用！發生什麼事是，當我在瀏覽器中查看數據表時，ID仍然存在（我希望它們不在），並且標題變成鏈接，這很好，這也是我想要的，但鏈接不工作。 PS。我認爲這裏有一個語法錯誤：return「"oObj.aData[1] + "」; ，而應該說：return「" + oObj.aData[1] + "」; – Ovis 2012-03-08 15:31:55

@ user806345您是否希望id列不出現。請詳細說明一下 – 2012-03-08 15:36:11

@ user806345我編輯了我的答案，您可以檢查該解決方案是否適合您。 – 2012-03-08 15:41:52

嗨您提供不工作的代碼。我已經設法自己解決這個問題，這是我可能處於相同情況下的最終代碼。

$(document).ready(function() { 

$('#myDataTable').dataTable({ 
    "bServerSide": true, 
    "sAjaxSource": "DataTable/AjaxHandler", 
    "bProcessing": true, 
    "aoColumns": [ 
        { 
         "sName": "TITLE", //index 1 
         "bSearchable": true, 
         "bSortable": true, 
         "fnRender": function (oObj) 
         { 
          return '<a href=\"' + oObj.aData[0] + '\">' + oObj.aData["1"] + '</a>'; 
         }        
        } 
        , 
        { 
         "sName": "ADDRESS", //index 2 
         "bSearchable": true, 
         "bSortable": true, 
         "fnRender": function (oObj) 
         { 
          return oObj.aData["2"] 
         }        
        } 
        , 
              { 
         "sName": "CITY", //index 3 
         "bSearchable": true, 
         "bSortable": true, 
         "fnRender": function (oObj) 
         { 
          return oObj.aData["3"] 
         }        
        } 
        , 
              { 
         "sName": "ZIPCODE", //index 4 
         "bSearchable": true, 
         "bSortable": true, 
         "fnRender": function (oObj) 
         { 
          return oObj.aData["4"] 
         }        
        } 
       ] 
    }); 
});

來源

2012-04-11 09:15:54 Ovis

jQuery DataTable點擊標題

回答

相關問題