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>

Answer 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 
});

在我的情况下工作正常。

MVC 3 Webgrid使整行可以点击

2 个答案: