3 
@using(Html.BeginForm("About", "User", FormMethod.Post , new { id="aboutme"}))
{
    <fieldset>
          <ul>
            <li> <label class="block">About me</label> @Html.TextAreaFor(m=>m.About.AboutMe)</li>
            <li> <input type="button" id="submit" class="input-button" /> </li>
          </ul>
    </fieldset>
}

<script type="text/javascript">
    $(function () {
        $('#submit').click(function () {

            $.ajax({
                url: this.action,
                type: this.method,
                data: $(this).serialize(),
                success: function (result) {
                    // The AJAX call succeeded and the server returned a JSON
                    // with a property "s" => we can use this property
                    // and set the html of the target div
                    alert(result.s);
                    $('#ShowResultHere').html(result.s);
                }
            });
            // it is important to return false in order to
            // cancel the default submission of the form
            // and perform the AJAX call
            return false;
        });
    }); 
</script>

これをデバッグすると、アクションURLがになり/User/undefinedます。

どうすれば修正できますか？

4

3 に答える 3

4

thisキーワードは、イベントのソース（この場合はボタンsubmit）を参照します。フォームが必要なので、これを試してください（JQueryトラバースを使用）：

url: $(this).closest("form").prop("action"),
type: $(this).closest("form").prop("method"),
data: $(this).closest("form").serialize()

<input type='submit' class='input-button' />別の方法は、の代わりにを使用buttonし、イベントをリッスンすることです$("#aboutme").submit（この方法thisでは、コードが想定しているように、実際にはフォームを参照します）。

于 2012-10-06T19:09:52.423 に答える
1

代替のattr関数として、属性 http://api.jquery.com/attr/の値を取得するため に、jQueryにはajaxpostの省略形$.posthttp : //api.jquery.com/jQueryがあります。 .post / なので、コードは次のように終了する可能性があります

$("#submit").click(function(event){
    event.preventDefault();
    $.post($("#aboutme").attr("action"), $("#aboutme").serialize(), function (data) {
        if (data != null) {
            alert(result.s);
            $('#ShowResultHere').html(result.s);
        }
    });
});
于 2012-10-08T14:58:58.740 に答える
0

または、代わりにAjax.BeginFormメソッドを使用することもできます。これにより、返されるHTMLの更新ターゲットを設定できます。

例：ASP.NET MVC3RazorでAjax.BeginFormを使用する

于 2012-10-06T19:21:59.397 に答える