0

問題を説明する間、しばらくお待ちください。

フォームをコントローラーにポストし、モデルを更新してビューに戻しています。これは、送信ボタンを使用すると正しく機能しますが、非送信ボタンを使用して JavaScript でポストバックしようとすると機能しません。

この問題を探してみましたが、どのように表現すればよいか分からないので、それに近い結果を得ることができます。

基本的

  1. 正しい - input type="submit" である AddDetail ボタンをクリックすると、コントローラーが呼び出され、モデルが更新されてビューに戻され、要素がページに正しく表示されます。

  2. 間違っています - 入力 type="button" である AddDetail1 ボタンをクリックすると、ボタンをクリックすると JavaScript が呼び出され、コントローラー メソッドが呼び出され、FormCollection とモデルがコントローラーに正しく渡されます。モデルが更新されてビューに戻されますが、ページに表示される要素はありません。

このコードを 100 回実行しましたが、ビューに設定されている要素に至るまで、すべてがまったく同じです。唯一の違いは、送信ボタンはコントロールをレンダリングしますが、その他のボタンは何もレンダリングしないことです。各ボタンを押した後に HTML ソースを表示したところ、送信ボタンにコントロールが表示されましたが、その他のボタンをクリックしてもコントロールがありません。

ページに @Model.cases.count を追加しました-最初は正しい0が表示されますが、ポストバック後に送信ボタンに1が表示され、他のボタンのコードをステップ実行すると1が表示されます、しかし、ページが最終的に終了し、すべてがレンダリングされると、コードをステップ実行していたときに 1 だったにもかかわらず、0 が表示されます。

非常にイライラする

どんなアイデアでも大歓迎です。

これが私の単純化されたビューです

@model CASA.ViewModels.CaseViewModel

<script type="text/javascript">
    $(function () {
        $("#AddDetail1").click(function () {
            var form = $(':input');
            //var action = form.attr("action");
            var serializedForm = form.serialize();
            var url = '@Url.Action("CreateCase")';
            //$.post(url, serializedForm);
            $.ajax({
                url: url,
                data: serializedForm,
                type: 'POST',
                success: function (response) {
                    alert(response);
                    // process the results from the controller action

                    //  window.location.href = response.Url;
                }

            });
        });
    });
@using (Html.BeginForm())
{
    @Html.ValidationSummary(true)

    @if (Model.cases != null && Model.cases.Count > 0)
        {
            for (int i = 0; i < Model.cases.Count; i++)
            {
                <tr>
                    <td>
                        @Html.TextBoxFor(m => m.cases[i].CaseNumber, new { @class = "textbox" })
                    </td>
                    <td>
                        @Html.TextBoxFor(m => m.cases[i].FirstName, new { @class = "nameTextbox" })
                    </td>
                    <td>
                        @Html.TextBoxFor(m => m.cases[i].LastName, new { @class = "nameTextbox" })
                    </td>
                    <td>
                        @Html.EditorFor(m => m.cases[i].DOB)
                    </td>
                    <td>
                        @Html.RadioButtonListFor(m => m.cases[i].Sex, Model.radiobuttons.RadioButtonListItems)
                    </td>
                </tr>
            }
        }

<input type="submit" value="+" id="AddDetail" class="button" />
<input type="button" value="+" id="AddDetail1" class="button" />
}

これが私のコントローラーです：

[HttpPost]
        public ActionResult CreateCase(FormCollection collection, CaseViewModel model)
        {
            if (ModelState.IsValid)
            {
                model.cases.Add(new CASA_Cases
                {
                    CaseNumber = collection["CaseNumber"],
                    FirstName = collection["FirstName"],
                    LastName = collection["LastName"],
                    DOB = Convert.ToDateTime(collection["DOB"]),
                    Sex = collection["Sex"]
                });

                UpdateModel(model);
                if (submit.Count() > 0)
                {
                    model.cases.ForEach(item =>
                        {
                            if (model.group.ID == null)
                            {
                                model.group.ID = Guid.NewGuid();
                                model.group.UserID = Utilities.Utilities.GetUserID;
                            }

                            item.CASA_CaseGroups_ID = model.group.ID;
                        });
                }
            }
            return View(model);
        }
4

1 に答える 1

0

すべての提案をありがとう。

これが私の問題を解決したものです。

PartialView の上にビューを作成し、jQuery を

<script type="text/javascript">
    $(function () {
        $("#AddDetail1").click(function () {
            var form = $(':input');
            var serializedForm = form.serialize();
            var url = '@Url.Action("CreatePartialView")';
            $.ajax({
                url: url,
                data: serializedForm,
                type: 'POST',
                success: function (response) {
                    $("#result").html(response);
                }
            });
        });
    });
</script>

次に、次のように PartView を保持する実際のビューを作成しました

<div id="result">
@model CASA.ViewModels.CaseViewModel

@using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "result" }))
{
        @Html.Partial("CasePartialView", Model)
}
</div>

最後に、次のように PartialView を返すようにコントローラーを変更しました。

[HttpPost]
        public PartialViewResult CreatePartialView(FormCollection collection, CaseViewModel model)
        {
            //Determine if submit button was clicked
            IEnumerable<string> submit = collection.AllKeys.Where(n => n.ToLower().Equals("submit"));

            model.cases.Add(new CASA_Cases
            {
                CaseNumber = collection["CaseNumber"],
                FirstName = collection["FirstName"],
                LastName = collection["LastName"],
                DOB = Convert.ToDateTime(collection["DOB"]),
                Sex = collection["Sex"]
            });


            return PartialView("CasePartialView",model);
        }

すべての提案をありがとう

于 2012-12-27T03:45:44.280 に答える