asp.net mvc - Basic scenario of navigating to another page based on a row clicked in a table -
i have table bunch of items. each row can clicked (on columns in row) , navigate page based on clicked row. have javascript file attached page manage events (clicked row, ...).
in asp.net mvc solution, take goo way manage scenario.
below 1 think:
my view:
<table> <tbody> @foreach (var item in model) { <tr data-url="@url.action("general", "transport", new { transportid = item.transportid })"> <td>aaaa</td> <td>bbbb</td> <td>cccc</td> </tr> } </tbody> </table>
my js file:
$("table.search-transport tbody tr td:not(:first-child)").live("click", function () { var url = $(this).parents('tr').data('url'); window.location.href = url; });
because cannot inject server code within javascript files, inject url straight within each rows within view. when row clicked, "specific" url , navigate javascript file.
i know if solution steady plenty in mvc project.
following comments, nikola right in saying not impact usage of asp.net mvc framework. injecting url info field in case alternative far can see (but open other suggestions).
for js part, utilize event delegation avoid attaching events every single cell:
$("table.search-transport tbody tr").on("click", "td:not(:first-child)", function () { var url = $(this).parents('tr').data('url'); // also: $(this).parent().data('url'); work... window.location.href = url; });
this attach event each row fire when click on td not first child. alternatively, attach whole event 1 time table, having alternative of adding rows dynamically , still having event attached; this:
$("table.search-transport").on("click", "tr td:not(:first-child)", function () { [...] });
asp.net-mvc
No comments:
Post a Comment