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

[Solved] Grid view checkbox is not showing up

1 Answer 100 Views
Grid
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
Mk
Top achievements
Rank 1
Mk asked on 02 Apr 2012, 10:01 AM
Hi Team,

I am trying to bind a check box column in grid bound field using client template  its not showing up.

Please help me.

Please check the code below.

I am loading the grid view data using the UserDetails model. I want to show two columns that first column would be a checkbox with username and second would be a usertype thaty is coming from membership database model.

Everything works fine I am able to see the data but not the checkbox column.

@model  IEnumerable<Thinktecture.IdentityServer.Web.ViewModels.UserDetails>
@{
    ViewBag.Title = "Administrator";
    Layout = "~/Views/Shared/AdministratorLayout.cshtml";
}
@{ Html.Telerik().Grid(Model)
        .Name("Grid")
        .Columns(columns =>
        {
            columns.Bound(o => o.UserName)
                   .ClientTemplate("<input type='checkbox' name='checkedRecords' value='<#= UserName #>' />")
                   .Title("Select")
                   .Width(36)
                   .HtmlAttributes(new { style = "text-align:center" });

            columns.Bound(o => o.UserName).Width(100);
          columns.Bound(o => o.UserType).Width(100);
           
        }).DataBinding(dataBinding => dataBinding.Ajax()
                .Select("_CheckBoxesAjax", "Grid"))
        .Scrollable()
        .Pageable()
        .Render();
       
}
<p>
    <button class="t-button t-state-default" onclick="displayCheckedOrders()">Display checked orders</button>
    <script type="text/javascript">
        function displayCheckedOrders() {
            var $checkedRecords = $(':checked');

            if ($checkedRecords.length < 1) {
                alert('Check a few grid rows first.');
                return;
            }
            $('#result').load('@Url.Action("DisplayCheckedOrders", "Grid")', $checkedRecords);
        }
    </script>
</p>
<div id="result">
</div>

</p>
<div id="result">
</div>


1 Answer, 1 is accepted

Sort by
0
Dadv
Top achievements
Rank 1
answered on 02 Apr 2012, 01:43 PM
Careful you use server AND ajax binding, you use ClientTemplate but your first binding is server binding.. so client template will not be call... 

@(Html.Telerik().Grid(Model) =>Server binding

.DataBinding(dataBinding => dataBinding.Ajax() .Select("_CheckBoxesAjax", "Grid"))=> Ajax binding

You don't need the .Grid(Model)

Replace it by .Grid<UserDetails>()


If you want to have server AND ajax binding, you need to Add the .Template method too :

 .Template(c=>{@<text>"<input type='checkbox' name='checkedRecords' value='@c.UserName' />"</text>}) 

Tags
Grid
Asked by
Mk
Top achievements
Rank 1
Answers by
Dadv
Top achievements
Rank 1
Share this question
or