1

私はasp.net MVC 2アプリケーションとして取り組んでいます。私はこのようなフォームを持っています:

<% using (Html.BeginForm("SaveCallRecording", "Recording", FormMethod.Post, new { id = "frmAddCallRecording", name = "frmAddCallRecording" }))
                           {%>

        <tr>
                                    <td>
                                    </td>
                                    <td>
                                        <input type="button" id="btnCall" title="Call" value="Call" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" />
                                        <input type="button" id="btnNewCall" title="New Call" value="New Call" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" />
                                    </td>
                                </tr>
                            </table>
                            <%} %>

私はこれをdocument.readyに持っています

 $("#btnCall").click(function () {
                var CallStatus = $("#txtCallStatus").val();
                if (CallStatus == 'READY') {
                    if ($("#isUniquePassword").is(':checked') && $("#UniquePassword").val() == '') {
                        $("#dialog-RecipientEmail-error").dialog("open");
                    }
                    else {
                        $.ajax({
                            type: "POST",
                            dataType: "json",
                            url: "/account/getGenericPassword",
                            success: function (data) {
                                if (data == null || data == "") {
                                    if ($('#isGenericPassword').is(':checked')) {
                                        $("#dialog-add-generic-password").dialog("open");
                                    }
                                }
                                else {
                                         $("#frmAddCallRecording").submit();
                               //after this I want to show alert based on result                                   
                                }
                            }
                        });
                    } // end of isUniquePassword if
                } // end of call status if
                else if (CallStatus == 'NOT SET') {
                    $("#dialog-required-fields").dialog("open");
                }
            });

コントローラーは次のようになります。

  [Authorize]
        [HttpPost]
        public JsonResult SaveCallRecording(CallRecording recording, FormCollection form)
        {
     return Json("record saved!");
            }

actionresult SaveCallRecording が実行された後、成功または失敗のメッセージを表示したい。どうすればできますか?$.ajax を試す場合、`data: { "item" : "value1" , ....} を使用して手動でフォーム データを作成する必要があります。$.post を使用してみましたが、手動でデータを渡す必要があります。ボタンではなく送信ボタンとして btnCall を作成すると、検証が失敗します。

したい:

1) 最初にフォームを検証し、フォームが検証されていない場合はアラートを表示します。2) フォーム データを json アクション メソッド SaveCallRecording に投稿する 3) アクション メソッドから成功または失敗メッセージを取得し、アラートとして表示する

それに対する解決策を提案してください。

4

1 に答える 1

0

このフォームを部分 ( _SaveCallRecordingForm.ascx)内に配置することから始めることができます。

<% using (Html.BeginForm("SaveCallRecording", "Recording", FormMethod.Post, new { id = "frmAddCallRecording", name = "frmAddCallRecording" })) { %>
    <tr>
        <td></td>
        <td>
            <input type="button" id="btnCall" title="Call" value="Call" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" />
            <input type="button" id="btnNewCall" title="New Call" value="New Call" class="ui-button ui-widget ui-state-default ui-corner-all ui-button-text-only" />
        </td>
    </tr>
<% } %>

また、いくつかの検証を実行できると予想される場合は、この部分を CallRecording モデルに強く型付けし、Html ヘルパーを使用してこのフォームの入力フィールドを生成することをお勧めします。また、validationMessageFor ヘルパーを使用して、エラーのプレースホルダーを生成することもできます。

そして、このフォームを AJAX 化できます。

else {
    var $form = $("#frmAddCallRecording");
    $.ajax({
        url: $form.attr('action'), 
        type: $form.attr('method'),
        data: $form.serialize(),
        success: function(result) {
            if (result.success) {
                alert('Thanks for submitting');
            } else {
                $('#someContainerOfYourForm').html(result);
            }
        }
    });
}

コントローラー アクションで検証を実行し、JsonResult (成功した場合) またはエラーのリストを含む PartialView を返します。

[Authorize]
[HttpPost]
public ActionResult SaveCallRecording(CallRecording recording)
{
    if (!ModelState.IsValid)
    {
        // There were validation errors => let's redisplay the form
        return PartialView("_SaveCallRecordingForm", recording);
    }

    // at this stage we know that the model is valid => do some processing
    // and return a JsonResult to indicate the success
    return Json(new { success = true });
}
于 2013-02-09T10:26:07.247 に答える