选中全选复选框仅选择页面中当前的复选框[不在其他页面索引中]

时间:2015-08-25 14:58:40

标签: javascript jquery html checkbox

我有一个jquery dynatable。 Here是我当前表格的屏幕截图

我的问题是,当我单击全选复选框时,会选择表格第一页中的唯一复选框(在每一行中),但其他复选框仍未选中。到目前为止,这是我的代码:

// I have omitted the table head part for the sake of simplicity



   /********************************
    TABLE BODY
    ********************************/
    var tableRows = "";
    //iterate each result object
    for (var row in result.results.bindings) {

        tableRows += "<tr>";
        //iterate each value

        for (var key in result.results.bindings[row]) {
            if (result.results.bindings[row].hasOwnProperty(key) && (resultSetVariables.length==0 || _.contains(resultSetVariables, "?" + key))) {

                    var value = "x";
                    if( result.results.bindings[row][key].value != undefined ) {
                        val = result.results.bindings[row][key].value;
                        if(val.match(regexURL)) {
                            value = '<a href="' + val + '" target="_blank">' + val.substr(val.lastIndexOf('/') + 1) + '</a>';
                        }
                        else
                            value = val;
                    }
                    tableRows += "<td>" + value + "</td>";

            }
        }
        tableRows+='<td><input type="checkbox" class="singleSelect"> </td>';

        tableRows += "</tr>";
    //    console.log(tableRows);
    };
$("#results_container").children().detach();
    //create unique id
    var id = Math.floor( Math.random()*99999 );
    //append a new table to the DOM

    $("#results_container").append('<table id="result_table' + id + '" cellpadding="0" cellspacing="0" border="0" class="table table-striped table-bordered"><thead><tr></tr></thead><tbody></tbody></table>');
    $("#results_container").append('<input type="button" class="btn" id="calculate_similarity" value="calculate_similarity" style="float:right;"/>');
    $("#results_container").append("<label style='float:right;'><input class='mahoutSelection' id='selectAll' type='checkbox' value='selectAll' style='float:right;'>selectAll</label>");
    //append head and body to tabley
    $('#results_container table thead tr').append(tableHead);
    $('#results_container table tbody').append(tableRows);
    $('#results_container table tbody').append(tableRows);

    //add the results table
    this.resultTable = $('#results_container table').dataTable({
        "sDom": "<'row-fluid'<'span6'l><'span6'f>r>t<'row-fluid'<'span6'i><'span6'p>>"
        , "sPaginationType": "bootstrap"
        , "oLanguage": {
            "sLengthMenu": "_MENU_ records per page"
        }
    });
     $('input[id="selectAll"]').on('click', function(){
         if ( $(this).is(':checked') ) {
             $("input[class=singleSelect]").each(function () {
              $(this).prop("checked", true);
          });
         }
         else {
             $("input[class=singleSelect]").each(function () {
              $(this).prop("checked", false);
          });
        }
     });

那么我怎么能修复它,以便当我点击全选时,它会检查所有复选框?

0 个答案:

没有答案