Question

我在这里有点怀疑，目前我使用了一个jquery模式对话框来显示数据库实例的细节。该对话框加载部分视图，以表格形式显示数据详细信息。我想允许用户单击“编辑”按钮，然后直接编辑表格中的数据（具体来说，我想在每个@ Html.DisplayFor中触发一个可编辑字段的更改）。我不知道如何做到这一点，用户点击编辑后是否还需要另一个对话框？还有其他任何可能的方法吗？

非常感谢任何帮助...

我在View中调用我的对话框：

        //Call Details action to display the food details
        var url = 'Details?cid=' + id;

        $detaildialog.dialog({ open: function () { $(this).load(url) } });
        $detaildialog.dialog('open');

详细信息操作将返回我的局部视图，这是我用来显示所有Food实例详细信息的表（下面是其中的一部分）：

@foreach (var item in Model) {
<tr>
    <td>
        @Html.DisplayFor(modelItem => item.FoodName)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.FoodAmount)
    </td>
    <td>
        @Html.DisplayFor(modelItem => item.StorageDate)
    </td>

任何线索？请帮忙..

Answer 1

您可以动态隐藏显示标签/输入以供自己编辑，但使用已具有此功能的jQuery表可能更容易：

这是一篇使用DataTables和一些插件来实现内联编辑的文章。我已经广泛使用了DataTables，他们完成了很好的工作。 http://www.codeproject.com/KB/aspnet/MVC-CRUD-DataTable.aspx
jqGrid似乎也支持内联编辑 http://trirand.com/blog/jqgrid/jqgrid.html#

Answer 2

这个问题对我来说很模糊，但你可以在每个可编辑字段附加一个类，然后附加一个更改事件处理程序

class = "editablefield"

和jquery

$(".editablefield").live("change", function(){

//your code to handle change here

});

我使用了live以防万一来处理DOM

动态添加的元素

jquery .live

jquery .change

jQuery对话框 - 使用jquery / ajax内联编辑表数据

2 个答案: