Question

我有一个用下面的html代码定义的表单：

<form id="addUser" method="post" action=@Url.RouteUrl("DefaultApi", new {controller = "User", action = "Add", httproute = "true"})>

我也有提交按钮：

<input type="submit" class="btn btn-primary" value="Add user" />

当我点击按钮时，浏览器会转到api url，但我只是想从api获取价值并将其传递到页面上的href。

我怎么能成功？

Answer 1

首先删除表单标签，然后在input元素中输入= submit。然后在javascript中

$(button).click(function(){
$.ajax({
   type:'POST',
   url:/api/User/Add or /User/Add
   success: function(declare parameter that will contain value returned by api)
   {
     // update your href here using the above parameter 
   }
 });
});

希望这会有所帮助......

Answer 2

除了Daniyals的回答，要传递输入值：

data={};
$("input").each(function(elem){
data[elem.name]=elem.value;
});

然后使用以下行执行ajax调用：

data:data,

Answer 3

根据您在问题上提供的信息，我假设您的网络API端点接受表单数据并返回您的网页应重定向到的新网址。

您可以使用jQuery来劫持表单提交事件，使用ajax发送数据，一旦您从Web api调用（新网址）获得响应，使用它来设置location.href的新值属性，以便浏览器将发出新的GET请求。

您必须确保阻止正常的表单提交行为。您可以使用jQuery preventDefault方法来执行此操作。

$(function(){
  $("[type='submit']").click(function(e){
     e.preventDefault(); 
     var _formUrl=$(this).attr("action");
     //make the ajax call now.
   //Build an object which matches the structure of our view model class
    var model = {  Name: "Shyju", Id: 123 };
    //update the above line with data read from your form.
    $.ajax({
        type: "POST",
        data: JSON.stringify(model),
        url: _formUrl,
        contentType: "application/json"
    }).done(function(res) {       
        console.log('res', res);
        // Do something with the result :)
        window.location.href=res;
    });

  });

});

另请查看How to pass json POST data to Web API method as object

表单提交后获取响应？

3 个答案: