Question

我刚刚开始探索asp mvc和jquery。

我有一个简单的表单，有两个字段，一个日期和金额。

我想要实现的行为是，在提交表单时，如果我的数据库中尚不存在该记录，则添加该项目。如果它已经存在，则发出警告并要求用户确认。如果用户继续，则覆盖现有记录。

这是我的Mark Up

<% using (Html.BeginForm())
       { %>
    <div>
        <%:Html.LabelFor(mod => Model.bal.Date) %>
    </div>
    <div>
        <%: Html.TextBoxFor(mod => Model.bal.Date)%>
        <%:Html.ValidationMessageFor(mod => Model.bal.Date)%>
    </div>
    <div>
        <%: Html.LabelFor(mod => Model.bal.Amount)%>
    </div>
    <div>
        <%: Html.TextBoxFor(mod => Model.bal.Amount)%>
        <%: Html.ValidationMessageFor(mod => Model.bal.Amount)%>
    </div>
    <p>
        <input type="submit" value="Create" />

这是我的控制器代码

        [HttpPost]
        public ActionResult Index(Balance bal)
        {

            var dataContext = new DataDataContext();
            if (ModelState.IsValid)
            {
                // Check if exsists
                if (dataContext.Balances.ToList().Contains(bal, new BalanceEquality()))
                {
                    //Exsists, Warn then edit
                    // Add code here to open popup 
                    // if Continue then over write exsisting data in db

                }
                else
                {
                    //Not exsist, insert
                    dataContext.Balances.InsertOnSubmit(bal);
                    dataContext.SubmitChanges();
                }
            }

            compModel myModel = new compModel();
            myModel.bal = bal;
            myModel.allBalances = dataContext.Balances.OrderBy(ball => ball.Date).ToList();
            return View(myModel);
        }

我遇到的问题是如何在Controller中显示和获取Jquery Popup的结果。

我考虑过在ViewData集合中设置一个变量，但这对我来说似乎不是“最佳实践”

由于

Answer 1

你处于错误的执行结束抱歉，Controller独立于View，即除了返回View之外，你不能在执行Controller代码期间回复响应。你可以做至少四件事之一（我相信还有其他解决方案）：

1 - 使用Ajax调用JsonResult控制器方法，该方法确定在单击提交按钮后该条目是否已存在 - 然后根据查询结果，您可以显示弹出窗口，其中“是”提交表单并覆盖，或“否”停止提交的表格。

2 - 您可以返回视图（不向db提交查询）并要求用户确认覆盖现有记录 - 但您必须添加一些额外的逻辑，如隐藏的输入字段，以确定用户已看到该消息并已同意覆盖。这不是一个好方法，可能对用户来说不是很直观。

3 - 在表单中添加“覆盖现有记录”复选框，确认用户希望覆盖数据（如果已存在）。

4 - 逻辑上单独为用户添加和编辑，以便当用户想要更新现有记录时，他们从列表中选择记录并编辑现有数据 - 这将是我认为最传统的方法。然后，如果用户尝试添加与现有项目相同的新项目，则只需重新显示该页面，并显示一条错误，指出该记录已存在。

Answer 2

我继续实施了答案的第一个选项。

坚持传统的添加和编辑方案，并使用标准的asp mvc模式肯定会更容易。但这是一次很好的学习经历。

继承代码和标记，它仍然需要更多的工作，但你明白了。任何意见/建议将不胜感激。

        function validate() {

        // Need to do form validation
        var balance = {};
        balance.date = $("#bal_Date").val();
        balance.amount = $("#bal_Amount").val();
        $.post("balance/validate"
               , balance
                , function (data) {
                    if (data.valid) {
                        $("#existCheck").val("Valid");
                        checkBalanceExist();
                    }
                    else {
                        $("#existCheck").val("Not Valid");
                        $("#errorMessage").text(data.message);
                    }
                }
                , 'json'
                 );
    };






    function checkBalanceExist() {

        $("#existCheck").val($("#bal_Date").val());


        // Do ajax call to see if balance exist
        var balance = {};
        balance.date = $("#bal_Date").val();
        balance.amount = $("#bal_Amount").val();
        $.post("balance/doesBalanceExist"
               , balance
                , balanceCheckPost
                , 'json'
                 );
    };


    balanceCheckPost = function (data) {
        $("#existCheck").val(data);
        if (data) {
            // Does Exist
            $("#existCheck").val("Exist");
            // raise confirmation popup 


            $('#dialog').dialog('open');

        }
        else {
            // Does Not Exist
            $("#existCheck").val("NOT Exist");

            // insert Item
            var balance = {};
            balance.date = $("#bal_Date").val();
            balance.amount = $("#bal_Amount").val();
            $.post("balance/insert",
               balance,
                confirmChange
                 );
        }

    };



    function overWriteBalance() {
        // insert Item
        var balance = {};
        balance.date = $("#bal_Date").val();
        balance.amount = $("#bal_Amount").val();
        $.post("balance/edit",
               balance,
                confirmChange
                 );
    };




    confirmChange = function () {
        $("#existCheck").val("Changed");
    };

和

  public JsonResult validate(Balance bal)
    {
        if (ModelState.IsValid)
        {
            return Json(new { valid = true });
        }
        else
        {
            var errorMessage = "";
            foreach (var key in ModelState.Keys)
            {
                errorMessage += ModelState[key].Errors.FirstOrDefault().ErrorMessage;

            }
            return Json(new { valid = false, message = errorMessage });
        }
    }

    public JsonResult doesBalanceExist(Balance bal)
    {
        var dataContext = new DataDataContext();
        return Json(dataContext.Balances.ToList().Contains(bal, new BalanceEquality()));
    }

    public ActionResult Index()
    {
        var dataContext = new DataDataContext();

        compModel myModel = new compModel();
        myModel.bal = new Balance();
        myModel.allBalances = dataContext.Balances.OrderBy(bal => bal.Date).ToList();

        return View(myModel);
    }

    [HttpPost]
    public ActionResult Index(Balance bal)
    {
        var dataContext = new DataDataContext();

        compModel myModel = new compModel();
        myModel.bal = new Balance();
        myModel.allBalances = dataContext.Balances.OrderBy(ball => ball.Date).ToList();

        return View(myModel);



    }

    public void insert(Balance bal)
    {
        var dataContext = new DataDataContext();
        dataContext.Balances.InsertOnSubmit(bal);
        dataContext.SubmitChanges();
    }


    public void edit(Balance bal)
    {
        var dataContext = new DataDataContext();
        var balToEdit = dataContext.Balances.Single(b => b.Date == bal.Date);
        balToEdit.Amount = bal.Amount;
        dataContext.SubmitChanges();
    }

}

来自MVC控制器的JQuery Popup

2 个答案: