MVC 3 Webgrid使整行可以点击

Question

我在MVC 3的剃刀视图中使用webgrid.下面是我的webGrid看起来的样子,我想让整个行可以点击,也可以点击传递值到javascript方法.

我能够在所有列的文本上调用我的javascript方法.我希望在整个行的任何地方点击都会发生同样的情况.

请指导我这个.谢谢

           @grid.GetHtml(

            columns: grid.Columns(

            grid.Column("CompanyName", format: @<text><a href="javascript:SubmitValues('@item.Col1','@item.Col2','@item.Col3');">@item.CompanyName</a></text>, header: "ABC"),

            grid.Column("CompanyAddress", format: @<text><a href="javascript:SubmitValues('@item.Col1','@item.Col2','@item.Col3');">@item.CompanyName</a></text>, header: "DEF"),

            ))      

         }

Answer 1

您必须使用 JQuery 添加行单击功能

在您的网络网格中添加 htmlAttributes: new { id="MainTable" } 。

<script type="text/javascript">
   $(function () {
        var tr = $('#MainTable').find('tr');
        tr.bind('click', function (event) {
            var values = '';
            var tds = $(this).find('td');


            $.each(tds, function (index, item) {
                values = values + 'td' + (index + 1) + ':' + item.innerHTML + '<br/>';
            });
            alert(values);


        });
    }); 


</script>