1

次のように、MVCHTMLヘルパーを使用してサーバーで生成されたコンテンツのテーブルがあります。

<table>
        <tr>
            <th>
                @Html.DisplayNameFor(model => model.TimeLogEntries[0].Description)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.TimeLogEntries[0].StartTime)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.TimeLogEntries[0].EndTime)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.TimeLogEntries[0].Location)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.TimeLogEntries[0].IsBillable)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.TimeLogEntries[0].IsBilled)
            </th>
            <th>
                @Html.DisplayNameFor(model => model.TimeLogEntries[0].Phase)
            </th>
            <th></th>
        </tr>


        @foreach (var item in Model.TimeLogEntries)
        {
            <tr>
                <td>
                    @Html.DisplayFor(model => item.Description)
                </td>
                <td class="no-wrap">
                    @Html.DisplayFor(model => item.StartTime)
                </td>
                <td class="no-wrap">
                    @Html.DisplayFor(model => item.EndTime)
                </td>
                <td>
                    @Html.DisplayFor(model => item.Location)
                </td>
                <td class="no-wrap">
                    @Html.DisplayFor(model => item.IsBillable)
                </td>
                <td class="no-wrap">
                    @Html.DisplayFor(model => item.IsBilled)
                </td>
                <td class="no-wrap">
                    @Html.DisplayFor(model => item.Phase)
                </td>
                <td class="no-wrap">
                    @Html.ActionLink("Edit", "Edit", "TimeLog", new { id = item.TimeLogEntryId }, null) |
            @Html.ActionLink("Delete", "Delete", "TimeLog", new { id = item.TimeLogEntryId }, null)
                </td>
            </tr>
        }
    </table>

jQueryを使用して、サーバーで生成されたテーブルに行を追加、変更、および削除できるようにしたいのですが、HTMLヘルパーによって生成されたHTMLコンテンツをどのように知る必要がありますか？Jsonを返すコントローラーでアクションを既に記述しましたが、クライアント側でフォーマットする方法を知る必要があります。JavaScriptコードでHTMLテンプレートを複製するのはかなり悪い習慣のようです。

4

1 に答える 1

0

テーブルを部分ビューに配置できます。部分ビューを返すアクションを定義します。

関数を削除した後、jqueryで部分ビューを返すアクションを呼び出すことができます。

$.ajax({
         url: '/ActionThatReturnsPartialView',
         cache: false,
         type: 'post'
         success: function (data) {
             $('#tableID').replaceWith(data);
         },
         error: function (e) {
             alert(e.responseText);                            
         }
});
于 2012-08-29T14:49:08.087 に答える