1

ユーザーのテーブルを含む Index.cshtmlという名前のビューがあります (作成/編集/更新機能)。

ここに画像の説明を入力

ボタン (作成/編集/更新) をクリックすると、jQuery ダイアログが表示されます。次に、次のような ajax 投稿を使用します。

  • 編集 >> 編集用のアクション コントローラーを呼び出し、json を返す >> javascript で行テーブルを更新する
  • 削除 >> 削除するためのアクション コントローラーを呼び出して json を返す >> javascript で行テーブルを削除する
  • 作成 >> 作成用のアクション コントローラーを呼び出し、Index.cshtml にリダイレクト >> ???

作成部分については、問題があります。ビューを「単に」表示したいのですが、ajax の投稿をしています。進め方がわかりません。

これが私のコードです（データを送信してからビューを更新します）：

        $.post($(this).attr('action'), $(this).serialize(), function (data, status) {
            $('#my-modal').modal('hide');

            if (data.operation == 'edit') {
                // Edit
                var row = $('#' + data.userid);
                row.children(':eq(0)').text(data.company);
                row.children(':eq(1)').text(data.username);
                row.children(':eq(2)').text(data.email);
                row.children(':eq(3)').text(data.firstname);
                row.children(':eq(4)').text(data.lastname);
            } else if (data.operation == 'delete') {
                // Delete
                var row = $('#' + data.userid);
                row.remove();
            } else {
                // Create
                alert(data);
                $("#userList").html(data);
            }
        })

ご覧のとおり、「作成」の「編集」または「削除」(最後の可能性) を行うかどうかを示す data.operation を確認します。作成の問題は、ビュー全体 (< html> < body>...) が生成され、#userList div に追加されることです。それは重複したものです。

多分それは正しいことではありませんか？

ありがとう。

更新しました

ここに私の作成アクションがあります:

    [HttpPost]
    public ActionResult Create(UserCreateViewModel viewModel)
    {
        if (!ModelState.IsValid)
        {
            this.Response.StatusCode = 400;
            return PartialView("Create", viewModel);
        }

        var userDTO = new UserDTO();
        Mapper.Map(viewModel, userDTO);
        _requestServiceClient.CreateNewUser(userDTO);
        return RedirectToAction("Index");
    }

ここに私のインデックスアクションがあります:

    [Authorize]
    public ActionResult Index(string q, int? page)
    {
        var users = _requestServiceClient.GetUsers();
        ...
        ...
        if (Request.IsAjaxRequest())
            return PartialView(userListPaged);
        else
            return View(usersListPaged);
    }

リリース後、「作成」の場合、私の見解では、次のようにページを単にリロードする方が良いかもしれません:

            ...
            } else if (data.operation == 'create') {
                // Create >> refresh the page
                location.reload();
            }

とにかくありがとう。

4

2 に答える 2

0

このコードを部分ビューに配置します。

@{
    Layout = null;
}

このコードは、このページにはマスター ビューが必要ないことを示しています。

于 2012-04-08T09:21:15.307 に答える
0

リストが長すぎない場合は、すべての ajax リクエストで完全なリストを送り返すことをお勧めします。更新、作成、削除は関係ありません。

そのため、データ操作チェックを削除し (いつか列の順序を変更すると、:eq(0) は失敗します)、単純に ajax リクエストの結果を #userlist div に入れることができます。

編集

ただし、作成の問題を解決するには：

Create アクションで次の行を置き換えるだけです。

return RedirectToAction("Index");

この行で：

return PartialView("Index", _requestServiceClient.GetUsers());

新しいリストのみを返す必要があります。

EDIT2

OK、あなたの Index.cshtml には、私が思っていたリストだけでなく、完全なレイアウトがあるようです。したがって、最初にこれを行う必要があります。

  1. 別のビューでリストを作成するために必要な HTML コードだけを移動し、_List.cshtmlたとえば名前を付けます。
  2. Index.cshtml に HTML コードがあった場所に@Html.Partial("_List")配置
  3. この時点で、インデックス ビューは以前と同じように見えるはずですが、リスト ビューは別に表示されます。
  4. 上記の例を、Index ではなく _List パーシャルを返すように変更します。 return PartialView("_List", _requestServiceClient.GetUsers());

それがうまくいくことを願っています。

于 2012-04-07T10:12:55.003 に答える