Checkbox not using model values

Oct 14, 2013 at 2:03 PM
I have a checkbox I am adding to the grid and it is displaying properly, however it is not binding to the model properties correctly. When the model bool column is true, the checkbox should be checked. Also when checking the checkbox and then going to and from other pages, the checkbox loses it's data.
Coordinator
Oct 14, 2013 at 3:16 PM
Hi,

Can you provide you grid config code?
Oct 14, 2013 at 3:18 PM
Edited Oct 15, 2013 at 2:31 PM
public class ClaimTestModel
{
    [Display(Name="Selected")]
    public bool Selected { get; set; }
    [Display(Name="Site")]
    public String SiteId { get; set; }
    [Display(Name = "File Name")]
    public String FileName { get; set; }
    [Display(Name = "Created On")]
    public DateTime CreatedOn { get; set; }
    [Display(Name = "Created By")]
    public String CreatedBy { get; set; }
    [Display(Name = "Status")]
    public Int32 Status { get; set; }
    [Display(Name="Description")]
    public String  Description { get; set; }

}
--- the Model

public class ClaimFileTestsModel
{
    [Display(Name="Created By:")]
    public String CreatedBy { get; set; }
    [Display(Name="Created:")]
    public DateTime CreatedOn { get; set; }
    [Display(Name="Site ID:")]
    public String SiteId { get; set; }

    public List<ClaimTestModel> TestFiles { get; set; }
}
-- the grid

div>
    @Html.Grid(Model.TestFiles).Columns(c =>
                 {
                     c.Add(m => m.Selected)
                         .Encoded(false)
                         .Sanitized(false)
                         .SetWidth(100)
                         .RenderValueAs(m => Html.CheckBox("Selected")).Sortable(false);
                     c.Add(m => m.SiteId)
                         .SetWidth(100)
                         .Titled("Site ID");
                     c.Add(m => m.FileName)
                         .SetWidth(200)
                         .Titled("File Name");
                     c.Add(m => m.CreatedOn)
                         .Format("{0:MM/dd/yyyy}")
                         .SetWidth(110)
                         .Titled("Created");
                     c.Add(m => m.CreatedBy)
                         .SetWidth(150)
                         .Titled("Created By");
                     c.Add(m => m.Status).SetWidth(100);
                     c.Add(m => m.Description)
                         .SetWidth(300);
                 }
                 ).WithPaging(5).Sortable()

</div>
Oct 15, 2013 at 5:34 PM
The code is above....am I missing something?
Oct 15, 2013 at 5:59 PM
I changed the grid code to the below code and it now works off of the initial value of the model but how do I bind it so that when the items are selected, they populate the mode and retain their values? When i check some and page to another page then back, the checks are lost??? Please help as I will have to abandon this approach and go to a different grid if I cannot get this to work...

@Html.Grid(Model.TestFiles).Columns(c =>
                                            {
                                                c.Add(m => m.Selected)
                                                    .Encoded(false)
                                                    .Sanitized(false)
                                                    .SetWidth(100)
                                                    .RenderValueAs(m => Html.CheckBox("Selected", m.Selected))
                                                    .Sortable(false)
                                                    .Titled("Select");
                                                c.Add(m => m.SiteId)
                                                    .SetWidth(100)
                                                    .Titled("Site ID")
                                                    .Sortable(true);
                                                c.Add(m => m.FileName)
                                                    .SetWidth(200)
                                                    .Titled("File Name")
                                                    .Sortable(true);
                                                c.Add(m => m.CreatedOn)
                                                    .Format("{0:MM/dd/yyyy}")
                                                    .SetWidth(110)
                                                    .Titled("Created")
                                                    .Sortable(true);
                                                c.Add(m => m.CreatedBy)
                                                    .SetWidth(150)
                                                    .Titled("Created By")
                                                    .Sortable(true);
                                                c.Add(m => m.Status)
                                                    .SetWidth(100)
                                                    .Sortable(true);
                                                c.Add(m => m.Description)
                                                    .SetWidth(300)
                                                    .Sortable(true);
                                            }
         ).WithPaging(5)
Coordinator
Oct 16, 2013 at 2:56 AM
Hi you need to save checked items... Grid does not respond on the question how you will do this. Grid only display your data collection, which you pass.

You can make ajax request each time, when user check/unckeck item, and saves checked/unckecked state on server side
Like:
                                                c.Add(m => m.Selected)
                                                    .Encoded(false)
                                                    .Sanitized(false)
                                                    .SetWidth(100)
                                                    .RenderValueAs(m => Html.CheckBox("Selected", m.Selected, new { @class = "check-item", data_id = m.SiteId }))
Script using jQuery:
<script>
    $(function () {
        $(".check-item").click(function () {
            alert("item clicked, id = " + $(this).attr("data-id"));
            //TODO make ajax request and remember checked state
        });
    });
</script>
Sep 23, 2014 at 1:39 PM
Hi,
How to maintain the selected check-box state when user switches between multiple pages?