This is a migrated thread and some comments may be shown as answers.

Select All CheckBox Not Working

5 Answers 774 Views
Grid
This is a migrated thread and some comments may be shown as answers.
Rohit
Top achievements
Rank 1
Rohit asked on 20 Jan 2015, 06:05 PM
Hi All,

In ASP.NET MVC application we are using Kendo Grid, the grid is bind to a data model.
We have a Checkbox column and CheckAll check box at the header.

At the initial page load, if I click on CheckAll CheckBox it works fine but after that event the checkall doesnt work. Not sure where I am doing wrong.

 I have seperate javascript file which has toggleSelection() function.

toggleSelection = function() {
    var chk = document.getElementById('allBox').checked;
    $(".box").attr("checked", chk);
}

Following is my .cshtml code for grid.

<body>

    <link href="@Url.Content("~/Content/kendo/kendo.common.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/kendo.dataviz.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/kendo.default.min.css")" rel="stylesheet" type="text/css" />
<link href="@Url.Content("~/Content/kendo/kendo.dataviz.default.min.css")" rel="stylesheet" type="text/css" />

   @using (Html.BeginForm("ReplaySelectedInboundMessages", "Home"))
   {
    <div id="gridContent">
        <h1>All Messages</h1>  
    @(Html.Kendo().Grid<ViaPath.MessageReplay.MvcApp.Models.LogModel>(Model)
    .Name("gridTable")   
    .HtmlAttributes(new {style = "font-family: verdana,arial,sans-serif; font-size: 11px;color: #333333;border-color: #999999;"})   
    .Columns(columns => 
        {
          columns.Template(@<text><input class="box"  id="assignChkBx" name="assignChkBx" type="checkbox" value="@item.LogID"/></text>).HeaderTemplate(@<text><input class="selectAll" type="checkbox" id="allBox" onclick="toggleSelection()"/></text>).Width(20);
           

            columns.Bound(p => p.LogID).Template(p => Html.ActionLink(((string)p.LogID), "MessageDetails", new { logid = p.LogID })).Width(200);
            columns.Bound(p => p.ReceivePortName).Width(100).Filterable(ftb => ftb.Cell(cell => cell.Operator("contains")));
            columns.Bound(p => p.SendPortName).Width(100);
            columns.Bound(p => p.loggedDate).Width(100);
            columns.Bound(p => p.ControlID).Width(100);
            columns.Bound(p => p.SenderID).Width(100);
            columns.Bound(p => p.ReceiverID).Width(100);
            columns.Bound(p => p.InterchangeID).Width(100);
            columns.Bound(p => p.ReplayedCount).Width(100);
            columns.Bound(p => p.RetryCount).Width(100);
            columns.Bound(p => p.AckCode).Width(20);
        })
                                                                  .Filterable(ftb => ftb.Mode(GridFilterMode.Row))
                                                                  .Pageable()
                                                                  .Sortable()
                                                                  .Scrollable(src => src.Height(430))
                                                                  .Resizable(resize => resize.Columns(true))

                                                                  )

         <br />
        <br />
        <input type="Submit" name="btnReplayMessage" value="Replay" title="Replay Message" \>
</div>  
      
       
   }
</body>

5 Answers, 1 is accepted

Sort by
0
Al
Top achievements
Rank 1
answered on 20 Jan 2015, 09:44 PM
Not sure if you are running into the same problem I just had, but turn off "sortable" for that column and see if the "select all" check box works.
0
Rohit
Top achievements
Rank 1
answered on 21 Jan 2015, 09:19 AM
Thanks Al,

Yes I did try disabling the whole sorting to the table and also to that column, still it doesnt work. Any ideas or clues will be great help.

Cheers
Rohit
0
Rohit
Top achievements
Rank 1
answered on 21 Jan 2015, 03:47 PM
Hi Telerik,

Request you to kindly look into my problem. Basically I am trying to write a POC application and once proved we will be going ahead with the purchase of the licence.

I am still stuck with the select All check box problem. I have attached the screen shot of the web application. Any help will be greatly appreciated. 



0
Daniel
Telerik team
answered on 22 Jan 2015, 12:58 PM
Hello,

Please try with the prop method instead of attr and let me know if the problem persists:
toggleSelection = function() {
    var chk = document.getElementById('allBox').checked;
    $(".box").prop("checked", chk);
}


Regards,
Daniel
Telerik
 

Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

 
0
Rohit
Top achievements
Rank 1
answered on 22 Jan 2015, 01:27 PM
Thanks Daniel,

Yes, it worked.

Tags
Grid
Asked by
Rohit
Top achievements
Rank 1
Answers by
Al
Top achievements
Rank 1
Rohit
Top achievements
Rank 1
Daniel
Telerik team
Share this question
or