This is a migrated thread and some comments may be shown as answers.
Support for checkboxes?
13 Answers 433 Views
This is a migrated thread and some comments may be shown as answers.
This question is locked. New answers and comments are not allowed.
James Davies
Top achievements
Rank 1
James Davies asked on 12 Jan 2010, 12:05 PM
Congratulations on your work!

Is there any built-in support for displaying one checkbox per grid row, so that a user can select rows and server-side code can act on the selected items?  I.e. a typical approach where there are many data rows, and the user needs to work on a selection of them.

Many thanks,
Jim

13 Answers, 1 is accepted

Sort by
0
Atanas Korchev
Telerik team
answered on 12 Jan 2010, 01:17 PM
Hello James Davies,

You can check this following forum thread.

Regards,
Atanas Korchev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
James Davies
Top achievements
Rank 1
answered on 13 Jan 2010, 04:27 PM
Many thanks, I can almost get what I want now.

At the moment I can't use AJAX Binding (problems with circular references!).

When I use Server Binding, the grid OnRowDataBound and OnDataBinding events don't fire - are they only for AJAX?  Without the OnRowDataBound event, I don't see how to set the checkbox attributes from data - or is there another way?

    Regards,
    Jim
0
Atanas Korchev
Telerik team
answered on 13 Jan 2010, 04:53 PM
Hi James Davies,

You can use ViewModel objects to avoid circular references. This blog post shows how.

Client events fire only during client-side databinding (ajax or webservice). This is the reason your code is not executed during server binding.

For server side checkboxes you can use the following code:

columns.Add(p =>
            {
                %>
                <%= Html.CheckBox("checkbox", p.Checked) %>
                <%
            });

Regards,
Atanas Korchev
the Telerik team

Instantly find answers to your questions on the new Telerik Support Portal.
Watch a video on how to optimize your support resource searches and check out more tips on the blogs.
0
James Davies
Top achievements
Rank 1
answered on 13 Jan 2010, 05:48 PM
Many thanks for the swift respnse Atanas - always impressive!

For the benefit of anyone interested, I'm so far using the following code for Server Binding (based on Atanas' demo for the previous post mentioned above).  This sets the 'value' attribute of each checkbox, so that in the POST one can get the Customer IDs for the checked checkboxes.

The 'checkedRows' argument to the POST contains one entry for every checkbox, either 'false' for unchecked ones or the Customer ID value for checked ones.

Jim


.Columns(columns =>

{

columns.Add(c =>

{

%>

<%

= Html.CheckBox("checkedRows", c.Bool ?? false, new { value = c.CustomerID })%>

 

<%

})

.Width(4)

.Title(

"Select");

 

columns.Add(c => c.CustomerID);

columns.Add(c => c.ContactName);

})

0
Pierre-Olivier Grangaud
Top achievements
Rank 2
answered on 22 Jan 2010, 03:38 PM
Hi,

I'm testing the Grid and I was trying to apply James Davies solution to the Atanas demo but it don't works.
Got a compilation exception :

Error 1 Invalid expression term ')'  165668_mvcapplication3\MvcApplication3\Views\Home\Index.aspx 20 MvcApplication3
Error 2 ) expected 165668_mvcapplication3\MvcApplication3\Views\Home\Index.aspx 30 MvcApplication3

Here is the code :

        Html.Telerik().Grid<MvcApplication3.Models.Customer>(Model) 
        .Name("Grid"
        .Pageable() 
        .Columns(columns => 
        { 
            columns.Add(c => c.CustomerID); 
            columns.Add(c => c.ContactName); 
            columns.Add(c => 
                { 
                %> 
                <%= Html.CheckBox("checkedRows", c.Bool ?? falsenew { value = c.CustomerID })%> 
                <% 
                }) 
            .Width(4) 
            .Title("Select"); 
        }) 
        .Sortable() 
        .PrefixUrlParameters(false); 

Probably missed something.
Could you tell me what's wrong ?

Best regards,
Cedric
0
James Davies
Top achievements
Rank 1
answered on 22 Jan 2010, 03:51 PM
Hi Cedric,

I haven't got much time now - here's some similar code which compiles fine:

    <% using (Html.BeginForm()) {%> 
 
        <% Html.Telerik().Grid<XXX.Models.Contact>(Model)  
            .Name("Grid")  
            .Pageable()  
            .Filterable()  
            .Columns(columns => 
            {  
                columns.Add(c => { %> <%= Html.CheckBox("checkedRows", c.Selected, new { value = c.ContactID })%> <% })  
                    .Title("Select");  
                columns.Add(c => 
                    {%> 
                        <%= Html.IconActionLink(Icons.EDIT, "Edit Contact", "Edit", "Contacts", new { id = c.ContactID })%> 
                        <%= Html.IconActionLink(Icons.DETAILS, "Contact Details", "Details", "Contacts", new { id = c.ContactID })%> 
                        <%= Html.IconActionLink(Icons.DELETE, "Delete Contact", "Delete", "Contacts", new { id = c.ContactID })%> 
                    <%})  
                    .Title("Actions");  
                columns.Add(c => c.ContactName).Title("Name");  
                %> 
                    <% if (User.IsInRole("Administrator")) { %> 
                        <%  
                            columns.Add(c => c.User.AspNetName).Title("Owner").Filterable(false).Sortable(false);  
                        %> 
                    <% } %> 
                <%  
                columns.Add(c => c.ContactMobile1).Title("Mobile1");  
                columns.Add(c => c.ContactEmail1).Title("Email1");  
                columns.Add(c => c.ContactLandline1).Title("Landline1");  
            })  
            .Sortable()  
            //.PrefixUrlParameters(false)  
            .Render();  
        %> 
 
        <p> 
            <%= Html.ImageGoBack(Icons.BACK, "Back") %> 
            <%= Html.ImageActionLink(Icons.CREATE, "Add Contact", "Create", "Contacts", null) %> 
            <%= Html.ImageSubmit("AddSelectedToLists", Icons.CONTACT_LIST, "Add Selected Contacts to List(s)")%> 
            <%= Html.ImageSubmit("CreateList", Icons.CONTACT_LIST, "Create a List from Selected Contacts") %> 
            <%= Html.ImageSubmit("DeleteSelected", Icons.DELETE, "Delete Selected Contacts Completely")%> 
            <%= Html.ImageSubmit("RemoveSelected", Icons.REMOVE, "Remove Selected Contacts from List(s)")%> 
        </p> 
 
    <% } %> 
 

Does that help?  Hope so...

    Jim


0
Pierre-Olivier Grangaud
Top achievements
Rank 2
answered on 22 Jan 2010, 04:13 PM
Hi James,

Your code was very helpful, thank you for a so quick answer !
I pasted your code and made the modification to adapt to my Model and it worked.

The error was the block including the Telerik grid was started with <%= %> instead of <% %> ...., so stupid mistake :x

Thank you again,
Cedric
0
James Davies
Top achievements
Rank 1
answered on 22 Jan 2010, 06:34 PM
Cedric,

Good to hear it's OK now.

We've all made that mistake with the <%=, more than once in my case...

    BW
    Jim
0
Jack Ma
Top achievements
Rank 1
answered on 20 Apr 2010, 03:11 PM
Hi James,
     I saw your code is quite beautiful, I don't want the buttons occupy wide column in the grid, some small cute icon to indicate the actions is very cool, but I can not leverage your code at my env,  is that Html.IconActionLink your customized html helper class? Could you share some skills on that? Appreciate!

Regards
Jack
0
James Davies
Top achievements
Rank 1
answered on 20 Apr 2010, 06:57 PM
Hi Jack,

Apologies for including the extensions with no explanation.  I guess everybody non-Microsoft should perhaps use a prefix naming convention, e.g. JslIconActionLink in our case (company name abbreviates to JSL).

This code is not something I'm proud of, and I suspect the next person can do it much better!  Anyway the main bits are below.

  Regards,
  Jim

    public static class HtmlHelperExtensions 
    { 
        private const string PLACEHOLDER = "[[]]"
 
        public static string IconActionLink(this HtmlHelper html, string filename, string linkText, 
            string actionName, string controllerName, object routeValues) 
        { 
            string imageHtml = html.Image(filename, new { alt = linkText, border = "0", width = "20" }); 
 
            string result = html.ActionLink(PLACEHOLDER, actionName, controllerName, routeValues, null).ToString(); 
            result = result.Replace(PLACEHOLDER, imageHtml) + "&nbsp; "
 
            return result; 
        } 
 
        public static string Image(this HtmlHelper html, string filename, string linkText) 
        { 
            string file = html.GetAbsoluteImageFilename(filename); 
            string result = String.Format("<img src=\"{0}\" alt=\"{1}\" />", file, linkText); 
 
            return result; 
        } 
 
        public static string GetAbsoluteImageFilename(this HtmlHelper html, string filename) 
        { 
            string result = FileHelpers.MapPath("~/Content/Images/") + filename; 
 
            return result; 
        } 
 
 

0
Jack Ma
Top achievements
Rank 1
answered on 21 Apr 2010, 05:31 AM
Hi  Jim,
     You're super super! Even unassuming as you expressed, your reply is quite helpful to me such a new bird. Thanks a lot!

Regards
Jack
0
James Davies
Top achievements
Rank 1
answered on 21 Apr 2010, 12:28 PM
Jack,

I'm pleased it was helpful.

I wonder why this post has so many views?

  Jim

0
asif
Top achievements
Rank 1
answered on 18 Mar 2011, 08:02 AM
Hi,

i am  showing data in telerik grid in asp.net mvc.

i want to get check boxes value in controller.

how it is possible without java script??

Please help!
Tags
Grid
Asked by
James Davies
Top achievements
Rank 1
Answers by
Atanas Korchev
Telerik team
James Davies
Top achievements
Rank 1
Pierre-Olivier Grangaud
Top achievements
Rank 2
Jack Ma
Top achievements
Rank 1
asif
Top achievements
Rank 1
Share this question
or