jquery - javascript not working in MVC webgrid after sorting or paging -
i newbie in mvc , trying polish concepts on webgrid
. have following code in view
@model ienumerable<mvcmovies.models.movie> @{ viewbag.title = "index"; } <script type="text/javascript"> $(function() { $('tbody tr').on('hover', (function () { $(this).toggleclass('clickable'); })); $('tbody tr').on('click', (function () { alert('rajeev'); })); }); </script> <style type="text/css"> .table { margin: 4px; width: 100%; background-color: #fcfcfc; } .head { background-color: #11e8cd; font-weight: bold; color: #cc6699; } .webgrid th, .webgrid td { border: 1px solid #c0c0c0; padding: 5px; color:white; } .altrow { background-color: #e4e9f5; color: #000; } .gridhead a:hover { text-decoration: underline; } .description { width: auto; } .selectrow { background-color: #0b7beb; } .clickable { cursor: pointer; background: #ffff99; } </style> <p> @html.actionlink("create new", "create") </p> <div> @using (html.beginform()) { @html.antiforgerytoken() <div style="float:left">title : @html.textbox("searchstring")<br /> </div> <div style="float:left; padding-left:5px"> <input type="button" value="filter" class="btn" /> </div> } </div> <div id="grid"> @{ var gd = new webgrid(model, rowsperpage: 2, ajaxupdatecontainerid: "grid"); @gd.gethtml(tablestyle: "table"); } </div> @section scripts { @scripts.render("~/bundles/jqueryval") }
now have jquery written code click on row functinon stops working after sort or paging in webgrid
on sorting table content refresh. try this
$(function () { $(document).on('click', 'tbody tr', (function () { alert('rajeev'); })); $(document).on({ mouseenter: function () { $(this).toggleclass('clickable'); }, mouseleave: function () { } }, 'tbody tr'); });
Comments
Post a Comment