开发者

ASP.NET MVC ... navigation and show error

In an ASP.NET MVC 3 (Razor) application, the main screen is divided in 2 parts (2 div named : leftColumn and rightcolum, the leftcolumn is the menu, the rifhtcolumn is the content)

I. I click on an item in the menu, the "Add" screen appear in the rightcolumn

HTML

var jqxhr = $.post("/Customer/Add", function (data) {
    $('#rightcolumn').html(data);
})
.success(function() {})
.error(function() { })
.complete(function () { });

Controller

public PartialViewResult Add()
{
    return PartialView("Add");
}

II. I fill the form and I post, if the insert is success I display the customer list, if there is an error I'd like keep the form with the value already filled in (and this last point make problem for me) and show the error message in a jquery UI model form. HTML

@using (Html.BeginForm("Save", "Customer", FormMethod.Post))
{
    <table style="width:100%;">
    <tr>...</tr>
    <tr>
        <td colspan="2"><input type="submit" value="Save"/></td>
    </tr>
    </table>
}

Controller

public ActionResult Save(CustomerModel model)
{
    SaveOrUpdate(model);

    if(model.hasError())
        return ReturnToAction("Add", model);
    model.List = GetList();
    return View("List", model);
}

I have two problem :

  1. When there is an error, the "Add" view is displayed but not in the right column but i开发者_JAVA技巧n full window without layout
  2. The model (the client data) are not in the model.

How can I do this ?

Thanks,


You could use an AJAXify this form so that it updates only the rightColumn div when it is submitted. The jquery form plugin is very good for this purpose:

$.post('@Url.Action("Add", "Customer")', function (data) {
    $('#rightcolumn').html(data);
    ajaxifyForm();
});

where the ajaxifyForm function might look like this:

function ajaxifyForm() {
    $('#rightcolumn form').ajaxForm(function(data) {
        $('#rightcolumn').html(data);
        ajaxifyForm();
    });
}
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜