SORU
23 Mart 2011, ÇARŞAMBA


Ajax Kullanarak.ASP.NET MVC 3 Razor ile BeginForm

ASP.NET içinde Ajax.BeginForm doğrulama ve Ajax göze batmayan var MVC 3 ile öğretici veya bir kod örneği var mı?

Bu benim form düzgün çalışması için alamıyorum 3 ve MVC için zor bir konudur. Bir Ajax gönderme yapacağım ama doğrulama hataları yok sayar.

CEVAP
23 Mart 2011, ÇARŞAMBA


Örnek:

Model:

public class MyViewModel
{
    [Required]
    public string Foo { get; set; }
}

Denetleyici:

public class HomeController : Controller
{
    public ActionResult Index()
    {
        return View(new MyViewModel());
    }

    [HttpPost]
    public ActionResult Index(MyViewModel model)
    {
        return Content("Thanks", "text/html");
    }
}

Görünüm:

@model AppName.Models.MyViewModel

<script src="@Url.Content("~/Scripts/jquery.unobtrusive-ajax.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>

<div id="result"></div>

@using (Ajax.BeginForm(new AjaxOptions { UpdateTargetId = "result" }))
{
    @Html.EditorFor(x => x.Foo)
    @Html.ValidationMessageFor(x => x.Foo)
    <input type="submit" value="OK" />
}

ve burada (benim görüşüme göre) daha iyi bir örnek:

Görünüm:

@model AppName.Models.MyViewModel

<script src="@Url.Content("~/Scripts/jquery.validate.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/jquery.validate.unobtrusive.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/index.js")" type="text/javascript"></script>

<div id="result"></div>

@using (Html.BeginForm())
{
    @Html.EditorFor(x => x.Foo)
    @Html.ValidationMessageFor(x => x.Foo)
    <input type="submit" value="OK" />
}

index.js:

$(function () {
    $('form').submit(function () {
        if ($(this).valid()) {
            $.ajax({
                url: this.action,
                type: this.method,
                data: $(this).serialize(),
                success: function (result) {
                    $('#result').html(result);
                }
            });
        }
        return false;
    });
});

daha fazla jQuery form plugin ile gelişmiş olabilir.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • ASUS Campus Life

    ASUS Campus

    18 Mart 2013
  • InfoPuppet

    InfoPuppet

    15 Kasım 2011
  • Jonnyriddlin1

    Jonnyriddlin

    4 Ocak 2007