如何在Asp.net MVC4中避免PostBack

时间:2013-09-27 11:20:53

标签: c# javascript asp.net asp.net-mvc-4

我有一个表单,将在两个不同的下拉列表中绑定一些值,并保存用户选择的值。现在我使用RequiredIf属性。它也可以正常工作。如果用户错过了选择值,它会显示消息,如同样地,在单击提交按钮后,下拉列表中的某些选定值将变为默认值。由于动作结果再次加载,我需要显示用户选择而不改变用户。

我的模型代码是;

> public ObservableCollection<Receipt> GetReceiptList()
>         {
>             ObservableCollection<Receipt> ReceiptList = new ObservableCollection<Receipt>();
>             DataTable dtReceipt = new DataTable();
>             dtReceipt = objDAL.ExecuteTable(CommandType.StoredProcedure, "sp_Receipt_Select");
>             foreach (DataRow dr in dtReceipt.Rows)
>             {
>                 ReceiptList.Add(new Receipt
>                 {
>                     Id = Convert.ToInt32(dr["REC_Id_I"]),
>                     Cust_Name = dr["CUS_Name_V"].ToString(),
>                     Pay_Amount = dr["REC_PaidAmount_M"].ToString(),
>                     Pay_Mode = dr["REC_PayMode_C"].ToString(),
>                     Bank_Name = dr["REC_BankName_V"].ToString(),
>                     Bank_Address = dr["REC_BankAddress"].ToString(),
>                     ChequeNo = dr["REC_ChequeNo_V"].ToString(),
>                     Cheque_Date = dr["REC_ChequeDate_D"].ToString(),
>                 });
>             }
>             return ReceiptList;
>         }

控制代码

//AtLoad
public ActionResult ReceiptMaster(Receipt model)
        {
            ObservableCollection<Receipt> ReceiptList = new ObservableCollection<Receipt>();
            Receipt Receipt = new Models.Receipt();
            ReceiptList = Receipt.GetReceiptList();
            ModelState.Clear();
            Sales sales = new Models.Sales();
            DataTable dtCustomer = new DataTable();
            dtCustomer = sales.GetCustomerList();

            IList<Sales> MyCustList = new List<Sales>();
            foreach (DataRow mydataRow in dtCustomer.Rows)
            {
                MyCustList.Add(new Sales()
                {
                    Cust_Id = Convert.ToInt32(mydataRow["Id"].ToString().Trim()),
                    Cust_Name = mydataRow["Name"].ToString().Trim()
                });
            }
            var CustName = new SelectList(MyCustList, "Id", "Cust_Name");
            ViewData["Cu_Name"] = CustName;
            return View(ReceiptList);
        }



    //TO Insert
[HttpPost]
        public ActionResult ReceiptMaster(Receipt model, string command)
        {
            Receipt Receipt = new Models.Receipt();

            if (command == "Sumbit")
            {
                int Id = 0;
                if (model.Pay_Mode == "C")
                {
                    model.ChequeNo = "";
                    model.Cheque_Date = ("1/1/1753 12:00:00 AM");
                    model.Bank_Name = "";
                    model.Bank_Address = "";
                }

                if (ModelState.IsValid)
                {
                    Id = Receipt.SaveReceipt(model.Id, model.Cust_Id, model.Pay_Amount, model.Pay_Mode, model.Bank_Name, model.Bank_Address, model.ChequeNo, model.Cheque_Date);
                    if (Id > 0)
                    {
                        ViewData["Success"] = "Product was saved successfully.";
                        ViewData["ControlView"] = 1;

                        return RedirectToAction("ReceiptMaster", "Admin");

                    }
                    return RedirectToAction("ReceiptMaster", "Admin");
                }

                ObservableCollection<Receipt> ReceiptList = new ObservableCollection<Receipt>();
                ReceiptList = Receipt.GetReceiptList();
                return View(ReceiptList);
            }

            ObservableCollection<Receipt> ReceiptList1 = new ObservableCollection<Receipt>();
            ReceiptList1 = Receipt.GetReceiptList();
            return View(ReceiptList1);

        }

脚本用于DropDown中的绑定值

<script type="text/javascript">

    $(document).ready(function () {
        $.post('@Url.Action("SelectCustomerForDropJson", "Admin")', null, function (data) {
            var select = $("#Cust_Id");
            select.empty();
            select.append($('<option/>', { value: '', text: '--Select--' }));
            $.each(data, function (index, Data) {
                select.append($('<option/>', {
                    value: Data.Value,
                    text: Data.Text
                }));
            });
        });
    });
</script>

3 个答案:

答案 0 :(得分:2)

我不是100%肯定你在问什么,但听起来你需要enable client side validation on your RequiredIf attribute

答案 1 :(得分:2)

return RedirectToAction("ReceiptMaster", "Admin");更改为

return View(model);

在你的帖子中

如果您使用了RedirectToAction,那么它会加载HTTP GET方法。所以你的验证信息已经消失了。

然后复制然后复制我的下面的代码而不是你的邮政编码

并删除此行:Receipt Receipt = new Models.Receipt();调用模型而不是收据

//TO Insert
[HttpPost]
        public ActionResult ReceiptMaster(Receipt model, string command)
        {


            if (command == "Sumbit")
            {
                int Id = 0;
                if (model.Pay_Mode == "C")
                {
                    model.ChequeNo = "";
                    model.Cheque_Date = ("1/1/1753 12:00:00 AM");
                    model.Bank_Name = "";
                    model.Bank_Address = "";
                }

                if (ModelState.IsValid)
                {
                    Id = Receipt.SaveReceipt(model.Id, model.Cust_Id, model.Pay_Amount, model.Pay_Mode, model.Bank_Name, model.Bank_Address, model.ChequeNo, model.Cheque_Date);
                    if (Id > 0)
                    {
                        ViewData["Success"] = "Product was saved successfully.";
                        ViewData["ControlView"] = 1;
                          ObservableCollection<Receipt> ReceiptList = new              ObservableCollection<Receipt>();
            ReceiptList = Receipt.GetReceiptList();
            return View(ReceiptList);

                    }
                    ObservableCollection<Receipt> ReceiptList = new ObservableCollection<Receipt>();
            ReceiptList = Receipt.GetReceiptList();
            return View(ReceiptList);
                }

                ObservableCollection<Receipt> ReceiptList = new ObservableCollection<Receipt>();
                ReceiptList = Receipt.GetReceiptList();
                return View(ReceiptList);
            }

            ObservableCollection<Receipt> ReceiptList1 = new ObservableCollection<Receipt>();
            ReceiptList1 = Receipt.GetReceiptList();
            return View(ReceiptList1);

        }

修改

请为ReceiptList添加一个模型属性,并在post方法内部分配此属性中的值,现在仅返回模型(现在此ReceiptList值存储在新ReceiptList属性中) ,但是你只返回你的gridview属性来查看。但验证消息和先前的值存储在模型属性中,因此您需要在模型中为ReceiptList添加一个属性,并在此属性中读取和写入网格视图数据。

现在您将尝试我的下面的代码(必须看到我的评论,想象一下model.ReceiptList是我们在您的模型中添加新属性)

//TO Insert
[HttpPost]
        public ActionResult ReceiptMaster(Receipt model, string command)
        {


            if (command == "Sumbit")
            {
                int Id = 0;
                if (model.Pay_Mode == "C")
                {
                    model.ChequeNo = "";
                    model.Cheque_Date = ("1/1/1753 12:00:00 AM");
                    model.Bank_Name = "";
                    model.Bank_Address = "";
                }

                if (ModelState.IsValid)
                {
                    Id = Receipt.SaveReceipt(model.Id, model.Cust_Id, model.Pay_Amount, model.Pay_Mode, model.Bank_Name, model.Bank_Address, model.ChequeNo, model.Cheque_Date);
                    if (Id > 0)
                    {
                        ViewData["Success"] = "Product was saved successfully.";
                        ViewData["ControlView"] = 1;
                          ObservableCollection<Receipt> ReceiptList = new              ObservableCollection<Receipt>();
             model.ReceiptList = Receipt.GetReceiptList();// model.ReceiptList is your model property
            return View(model);

                    }
                    ObservableCollection<Receipt> ReceiptList = new              ObservableCollection<Receipt>();
             model.ReceiptList = Receipt.GetReceiptList();// model.ReceiptList is your model property
            return View(model);
                }

                ObservableCollection<Receipt> ReceiptList = new ObservableCollection<Receipt>();
                ReceiptList = Receipt.GetReceiptList();
                return View(ReceiptList);
            }

             ObservableCollection<Receipt> ReceiptList = new              ObservableCollection<Receipt>();
             model.ReceiptList = Receipt.GetReceiptList();// model.ReceiptList is your model property
            return View(model);

        }

在模型类中添加属性,例如

ObservableCollection<Receipt> ReceiptList  {get :set;}

答案 2 :(得分:0)

以下代码会阻止%100回发,只需尝试。

您需要使用Json才能阻止页面中的完整回发。之后,您必须返回部分视图。

例如;

HTML代码:

<input type="text" id="UserName" name="UserName"/>
<input type="button" onclick="ButonClick()" value="Enter"/>

Javascript代码:

function ButonClick() {
var data= {
UserName: $('#UserName').val(),
};
$.ajax({
url: "/Home/MyActionResult",
type: "POST",
dataType: "json",
contentType: 'application/json',
data: JSON.stringify(data),

控制器:

public ActionResult MyActionResult(string UserName,MyModel model)
{
var stringView = RenderRazorViewToString("_YourPartialView", model);
return Json(stringView, JsonRequestBehavior.AllowGet);
}

注意:

您需要使用以下代码渲染json的部分视图。

将以下内容添加到您的控制器中。

public string RenderRazorViewToString(string viewName, object model)
{
ViewData.Model = model;
using (var sw = new StringWriter())
{
var viewResult = ViewEngines.Engines.FindPartialView(ControllerContext, viewName);
var viewContext = new ViewContext(ControllerContext, viewResult.View, ViewData,    TempData, sw);
viewResult.View.Render(viewContext, sw);
viewResult.ViewEngine.ReleaseView(ControllerContext, viewResult.View);
return sw.GetStringBuilder().ToString();
}
}