This question is locked. New answers and comments are not allowed.
Hello dear Telerik,
What is the best way to pass values of checked Grid rows to controller, but without the form postback?
The thing is that I'm using combination of Grid and Menu. The Grid contains data and allows to select specific rows with checkboxes and The Menu provides various actions on selected rows. The actions will be in different controllers.
When I try to pass checkedRecords from Action method of Menu item as is, I receive null. The code I use is taken from Telerik Demo site.
Thank you much!
What is the best way to pass values of checked Grid rows to controller, but without the form postback?
The thing is that I'm using combination of Grid and Menu. The Grid contains data and allows to select specific rows with checkboxes and The Menu provides various actions on selected rows. The actions will be in different controllers.
When I try to pass checkedRecords from Action method of Menu item as is, I receive null. The code I use is taken from Telerik Demo site.
@{int[] checkedUsers = (int[])ViewData["checkedUsers"];} @{ Html.Telerik().Menu() .Items(menu => {
... item.Add().Text(Model.InitialPackage.PackageName) .Action("AssignPackageToUsers", "AdminAuditionPackages", new { packageId = Model.InitialPackage.PackageId, checkedUsers = checkedUsers }) }; }) .Render();} @(Html.Telerik().Grid(Model.Users) .Name("FoundUsersGrid") .DataKeys(keys => keys.Add(u => u.UserId)) .Columns(columns => { columns.Template( @<text> <input name="checkedUsers" type="checkbox" value="@item.UserId " title="checkedRecords" @{if (checkedUsers != null){ if (checkedUsers.Contains(item.UserId)) { <text>checked="checked"</text> } }} /> </text>) .Title("").Width(36).HtmlAttributes(new { style = "text-align:center" }); ... columns.Bound(u => u.Specialities).Width(200); }) )Thank you much!
1 Answer, 1 is accepted
0
Yuriy
Top achievements
Rank 1
Rank 1
answered on 10 Aug 2012, 03:28 PM
ok, not so pretty but works:
1. add HtmlAttribute to the menu item and assign onclick event handler with argument of this. Also, add parameter to the routeValues with some default value (you will replace it later).
2. add custom css class to the checkbox inside the grid column template:
3. in JavaScript event handler (from step 1)
a) get all checkboxes with custom css by checked selector: var list = $("input.usercheckbox:checked");
b) get value (id) of each element and fit to the string which suppose to be send to Controller
b) find child element of object which triggered the event (in my case: $(e).find('a')) and replace default value from href with the value expected in controller.
)
Thanks.
1. add HtmlAttribute to the menu item and assign onclick event handler with argument of this. Also, add parameter to the routeValues with some default value (you will replace it later).
item.Add().Text(Model.InitialPackage.PackageName) .Action("AssignPackageToUsers", "AdminAuditionPackages", new { packageId = Model.InitialPackage.PackageId, selectedUsersHidden = "_" }) .HtmlAttributes(new { onclick = "gatherCheckBoxes(this)"})2. add custom css class to the checkbox inside the grid column template:
<input name="checkedUsers" type="checkbox" value="@item.UserId" title="checkedRecords" class="usercheckbox"3. in JavaScript event handler (from step 1)
a) get all checkboxes with custom css by checked selector: var list = $("input.usercheckbox:checked");
b) get value (id) of each element and fit to the string which suppose to be send to Controller
b) find child element of object which triggered the event (in my case: $(e).find('a')) and replace default value from href with the value expected in controller.
)
function gatherCheckBoxes(e) { var newStr = ""; var list = $("input.usercheckbox:checked"); for (i = 0; i < list.length; i++) { newStr += "_" + list[i].value; } $(e).find('a').attr('href', function () { return this.href.replace("_", newStr); }); }Thanks.