通过 JavaScript 从视图访问 Post 方法

Accessing Post method from View through JavaScript

本文关键字：Post 方法 访问 视图 JavaScript 通过      更新时间：2023-09-26

我从我的视图访问操作结果[帖子]时遇到问题。

视图：

@using (Html.BeginForm()){
<form id="edit-order-form" action="@Href("~/Orders/Edit")">///EDIT:
   ....
  <div class="row">
            <span class="label"><label for="ShipPostalCode">PostalCode:</label></span>
            <input type="text" id="txtShipPostalCode" name="ShipPostalCode" value="@ViewBag.ShipPostalCode" />
        </div>
        <div class="row">
            <span class="label">&nbsp;</span>
            <input type="submit" id="btnSave" name="submit" value="Save" />
        </div>
        </fieldset>
    </form>
<script type="text/javascript">
$("#btnSave").live("click", saveRecord);
function saveRecord() {
$.ajax(
 { type: "Post" ,
     url: '@Url.Action("Save", "OrdersList")',
     data: {
    OrderID: $("#hdnOrderID").val(),
    ShipName: $("#txtShipName").val(),
    ShipAddress: $("#ShipAddress").val(),
    RequiredDate: $("#RequiredDate").val(),
    ShipPostalCode: $("#ShipPostalCode").val(),
         },
         dataType: "html" ,
         success: function  (data){
             alert ('saved');
              }
     }).....

控制器：

        [HttpPost]
    //[ValidateAntiForgeryToken]
    public ActionResult Save(int orderId = 0, string ShipName = "", string ShipAddress = "", string ShipPostalCode = "", DateTime? RequiredDate = null)
    {
        SqlConnection conn = new SqlConnection(ConfigurationManager.ConnectionStrings["NorthwindConnectionString"].ConnectionString);
        using (SqlCommand cmd = new SqlCommand("GetOrders", conn))
        {
            conn.Open();
            //SqlCommand cmd = new SqlCommand( "GetOrders", "connection string");
            cmd.CommandType = CommandType.StoredProcedure;
            cmd.Parameters.AddWithValue("@ID", orderId);
            cmd.Parameters.AddWithValue("@ShipName", ShipName);
            cmd.Parameters.AddWithValue("@ShipAddress", ShipAddress);
            SqlParameter paramDate = cmd.Parameters.Add("@RequiredDate",
            System.Data.SqlDbType.DateTime);
            paramDate.Value = RequiredDate;
            //cmd.Parameters.AddWithValue("@RequiredDate", RequiredDate);
            cmd.Parameters.AddWithValue("@ShipPostalCode", ShipPostalCode);
            //SqlParameter Total = cmd.Parameters.Add("@Total", SqlDbType.Int);
            //Total.Direction = ParameterDirection.Output;
            cmd.ExecuteNonQuery();

            conn.Close();

            return View();
        }
    }

不会调用控制器操作。可能 javascript 函数也不是。

首先，您需要做的是将"btnSave"输入元素的"type"属性更改为"按钮"，这样它就不会在单击时发布页面。具有"提交"类型的"输入"元素实际上将发布页面，当您想要在单击按钮时执行javascript时，这不是您想要的。

接下来，您需要做的是使用IE或Chrome并拉起开发人员工具"F12"。在 Chrome 中，点击"来源"标签，然后点击"元素"标签下方的"框箭头"打开"导航器"。找到保存您的 javascript 的文件，并在具有以下语法的行断点，$.ajax( . 然后转到您的页面并单击"提交"按钮。从那里，你应该看到最有可能导致你的javascript失败的异常。

此外，您可能想打开"Fiddler"并观察您的 RESTful 服务的"发布"是否正在启动。

您是否尝试过改用document.forms[0].submit();？要查看是发布还是您的 javascript 有问题？

同样 .live 已被弃用，您应该改用 .on。

示例代码：

$("#btnSave").on("click", saveRecord);
//or $("#btnSave").click( function(){
//    document.forms[0].submit();
//});
function saveRecord() {
    document.forms[0].submit();
 })

并将保存操作结果的属性更改为[HttpPost]及以下[ActionName("Edit")]

相关文章：