asp.net中的Gridview标头复选框选择始终为false(使用jquery ajax填充)

时间:2015-06-25 12:26:54

标签: jquery asp.net

按钮单击我使用jquery ajax使用下面的代码填充了我的网格视图。

$(document).ready(function () {
     $("#btnShowData").click(function () {
         $('#gvData').empty();
         load_data(0, 30);
     });
});

function load_data(iPageIndex, iPageSize) {
     $.ajax({
            type: "POST",
            contentType: "application/json; charset=utf-8",
            url: "GridAjaxDotnetSpan.aspx/BindEmployees",
            data: JSON.stringify({ iPageIndex: iPageIndex, iPageSize: iPageSize }),
            dataType: "json",
            success: function (result) {
                $('#gvData').empty();
                $('#gvData').append("<tr><th><input type='checkbox' id='chkOrgheader' name='chkOrgheader' onclick='selectAll();' /></th><th>EmpId </th><th>EmpName </th><th>empsal </th><th>empaddr </th></tr>")
                for (var i = 0; i < result.d.length; i++) {

                    $("#gvData").append("<tr><td><input type='checkbox' id='chkOrgRow' name='chkOrgRow' /></td><td>" + result.d[i].EmpId + "</td><td>" + result.d[i].EmpName + "</td><td>" + result.d[i].empsal + "</td><td>" + result.d[i].empaddr + "</td></tr>");
                }

                hideorshownavigation();
            },
            error: function (result) {
                alert("Error");
            }
        });
}

并选择标题复选框我想选择所有子复选框。我使用了下面的代码。

 function selectAll() {

        var bool = $("#gvDatainput[id*='chkOrgheader']:checkbox").is(':checked');

        //var isChecked = $(checked).attr('checked') ? true : false; //tired this on also by passing "this" to chkOrgheader onclick="selectAll(this)"

        if (bool) {
            $('input:checkbox[name$=chkOrgRow]').each(
                function () {
                    $(this).attr('checked', 'checked');
                });
        }
        else {
            $('input:checkbox[name$=chkOrgRow]').each(
                function () {
                    $(this).removeAttr('checked');
                });
        }
 }//End of select all

当我选择标题复选框时,上面的selectAll函数被触发&#34; chkOrgheader&#34;但我总是被检查为假。

我正朝着正确的方向前进?请建议我如何达到这个要求。

我需要以下几点的帮助: 1.当我选中标题复选框时,所有子复选框都应选择

  1. 当我选择特定的子复选框时,我想找出empsal字段值

1 个答案:

答案 0 :(得分:2)

第1点 - 由于checkbox不正确,您的以下代码未选择任何selector。您需要在身份#gvDatainput之间留出空格,而* +不需要id +,无需使用:checkbox进行过滤您选择的id复选框是唯一的。所以只需修改您的代码如下:

var bool = $("#gvData input[id='chkOrgheader']").is(':checked');

您可能会遇到.attr的某些问题,因此建议您使用.prop代替

DEMO WITH .prop //Works fine

$(this).prop('checked', true); //check the checkbox

$(this).attr('checked',false);//uncheck the checkbox

DEMO WITH .attr //checks and unchecks for the first time and then unfunctional

第2点

由于您要动态添加checkboxes,因此您可以使用jquery eventlistener来执行获取值的操作

$(document).on('change','td input[type="checkbox"]',function(){
   if($(this).prop('checked'))
       alert($(this).parent('td').siblings('td:nth-child(4)').text()); //You can either store it in variable as per your needs
                                            ^^^^^^^Retrieves values of Column 4 which is salary
});

<强> DEMO HERE