Handling row selection from a simple grid using jquery and asp.net mvc
- by Jonn
Using a simple table and jquery, how would you manually handle selection using jquery?
So far, I've managed to add a gridrowselected class on the tr when the click event is called so that I'll know which row is currently selected. But I don't know how to pass the selected data back to the controller (or at least an index I placed on the row).
I tried something like this
$(function() {
$('#ProjectList .gridrow').click(function() {
// Get row's index
var projectId = $(this).find('input[name$=ProjectId]').val();
// Remove the input if it already exists
var parentForm = $(this).parents('form');
parentForm.remove('input[name="selectedRows"][value="' + projectId + '"]');
// If it is selected, create the form. If it's not selected then the input just gets removed (the user must have clicked on it and deselected the row)
if ($(this).hasClass('gridrow-selected') === true) {
parentForm.append($('<input>', { type: "hidden", name: "selectedRows", value: projectId }));
}
});
});
which I'm expecting to create a hidden input so that when I post, selectedRows gets passed onto the controller. But all it does is create the input, but the data still doesn't get passed to the controller.