devre dışı bırakın satır seçimi

ben basit Tarihlenebilir https://jsfiddle.net/ptwgxpzu/27/devre dışı bırakın satır seçimi

JS vardır:

var dataSet = [ 
    ["data/rennes/", "Rennes", "rennes.map"], 
    ["data/nantes/", "Nantes", "nantes.map"], 
    ["data/tours/", "Tours", "tours.map"], 
    ["data/bordeaux/", "Bordeaux", "bordeaux.map"], 
    ["data/limoges/", "Limoges", "limoges.map"], 
    ["data/troyes/", "Troyes", "troyes.map"] 
]; 


var table = $('#maptable').DataTable({ 
    "data": dataSet, 
    "paging": false, 
    "columns": [{ 
     title: "Download" 
    }, { 
     title: "Name" 
    }, { 
     title: "File Name" 
    }], 

    "columnDefs": [{ 
      "targets": [0], // Download 
      "visible": true, 
      "searchable": false, 
      "bSortable": false 
     }, { 
      "targets": [1], // Name 
      "visible": true, 
      "searchable": true 
     }, { 
      "targets": [2], // File name 
      "visible": true, 
      "searchable": true 
     }, 


    ], 
    "order": [ 
     [1, "asc"] 
    ], 
    "oLanguage": { 
     "sSearch": "" 
    }, 
    "aoColumns": [{ 
     "title": '&nbsp;&nbsp;&nbsp;&nbsp;<i class="fa fa-cloud-download white"></i>&nbsp;&nbsp;Download', 
     "render": function(data, type, full, meta) { 
      var url = 'http://localhost/'; 

      var mapurl = url + full[0] + full[2], 
       trackurl = url + full[0] + full[2].replace('map', 'trx'); 

      return '<div class="btn-group">' + 
       '<button class="btn btn-default btn-xs dropdown-toggle" type="button" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">' + 
       '<i class="fa fa-cloud-download white"></i> <span class="caret"></span>' + 
       '</button>' + 
       '<ul class="dropdown-menu">' + 
       '<li><a href=' + mapurl + '><i class="fa fa-download"></i>&nbsp;&nbsp;map file</a></li>' + 
       '<li><a href=' + trackurl + '><i class="fa fa-download"></i>&nbsp;&nbsp;track file</a></li>' + 
       '</ul>' + 
       '</div>'; 
     } 
    }, { 
     "title": "Name" 
    }, { 
     "title": "File name" 
    }] 

}); 


$('#maptable tbody').delegate('tr', 'click', function() { 
    $(this).toggleClass('selected'); 

    //... 

});

HTML:

<body> 
    <br /> 
    <div class="container"> 
     <table id="maptable" class="table table-bordered" width="100%"></table> 
    </div> 
</body>

tablodaki satırlar seçilmemiş ve ben tıkladığımda ilk sütunda bulunan açılır düğmesi - tablodaki satır seçilebilir hale gelmektedir. Tabloda satır seçildi ve ilk sütunda bulunan açılır düğmesini tıkladığımızda
Ve - tablodaki satır

seçilmemiş hale I açılan butonuna tıkladığınızda 'seçilmemiş sıranın' eylemini önlemek Nasıl tabloda satır seçildiğinde tabloda satırları değil seçildiğinde ben açılan butonuna tıkladığınızda ve eylem 'seçili satırı' önlemek? Veya devre dışı satır seçimi yalnızca ilk sütunda

kaynak

2016-03-25 HasT

şu kodu kullanın:

$('#maptable tbody').on('click', 'td:not(:first-child)', function() { 
    $(this).closest('tr').toggleClass('selected'); 

    //... 

});

kodu ve gösteri için updated jsFiddle bakınız.

$('#maptable tbody').on('click', 'tr', function (e) { 
    if(!$(e.target).is('button')){ 
     $(this).toggleClass('selected'); 
    } 

    //... 

});

kodu ve gösteri için updated jsFiddle görme: (düğme tıklandığında hariç) ilk sütunda seçimine izin istiyorum

Alternatif olarak, aşağıdaki kodu kullanabilirsiniz. DataTable içinde

kaynak

2016-03-25 13:47:30

Sıra seçimi select uzantısını kullanır.

$('#yourTableId').DataTable({ 
    select: true 
});

sütunları seçimi, select.selector kullanmak olanak sağlayan üzerinde tam kontrol istiyorsanız. İşte

<table id="yourTableId" class="display"> 
    <thead> 
    <tr> 
     <th></th> 
     @foreach(string column in Model.columns) { 
      <th>@column</th> 
     } 
    </tr> 
    </thead> 
    <tfoot> 
    <tr> 
     <th></th> 
     @foreach(string column in Model.columns) { 
      <th>@column</th> 
     } 
    </tr> 
    </tfoot> 
</table>

Ben Microsoft Razor kullanın:

$('#yourTableId').DataTable({ 
    select: { 
     selector:'td:not(:first-child)', 
     style: 'os' 
    } 
});

örn masanızı, tanımlarken fazladan boş <th> eleman eklemeyi unutmayın: Bu soru için, ilk sütun seçilir seçim olayları, kullanım görmezden kısalık için (@foreach), ancak ne olursa olsun platform, sadece <tr> sonra <th></th> dikkat edin.

kaynak

2017-08-03 22:22:10

devre dışı bırakın satır seçimi

cevap

İlgili konular