6

我在 MVC 3 的 razor 视图中使用 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"),

            ))      

         }
4

2 回答 2

3

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

在您的 webgrid 中添加 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>
于 2012-05-16T13:52:18.930 回答
2

我已经在我的项目中通过style: "click_able"在特定列上添加一个类来完成此操作，例如。

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

然后添加点击功能。

<script type="text/javascript">
$(".click_able").click(function () {
    // Do something 
});

在我的情况下它工作正常。

于 2016-08-29T07:53:10.767 回答