在另一个ajax函数中使用ajax函数的输出

时间:2018-07-09 15:09:36

标签: javascript jquery asp.net ajax

我正在做什么的概述: 1-用户创建一个包含不同元素的模板 2-他按下按钮:

*第一个ajax函数在自定义模板数据库中创建一个新条目

*第二个ajax函数采用模板的ID,并将所有具有该ID作为外键的数据库保存在第二个数据库中。

第一批Ajax

var data1 = {}

        data1.ID = "1";
        data1.RName = '<%= Session["Name"] %>';
        data1.RType = '<%= Session["RType"] %>';
        data1.SType = '<%= Session["SType"] %>';

        $.ajax({
            url: '<%= ResolveUrl("~/WebService1.asmx/AddT") %>',
            data: JSON.stringify(data1),
            dataType: "json",
            type: "POST",
            contentType: "application/json; charset=utf-8",
            success: function (result) {
                alert(result);
                console.log(result);



            },  
            failure: function (jqXHR, textStatus, errorThrown) {
                alert("Status: " + jqXHR.status + "; Error: " + jqXHR.responseText); // Display error message  
            }
        });

这是它调用的Web服务。

[WebMethod(EnableSession = true)]

    public int AddT(string ID,string RName, string RType, string SType)
    {


        int id1 = Convert.ToInt32(Math.Floor(Convert.ToDouble(ID)));



        Models2.CustomTemplate itemo2 = new Models2.CustomTemplate
        {
            Id = id1,
            Name = RName,
            ReportType = RType,
            StudyType = SType

        };



        using (TestEntities db2 = new TestEntities())
        {
            db2.CustomTemplates.Add(itemo2);
            db2.SaveChanges();

        }

        int id2 = itemo2.Id;

        Session["TheID"] = id2;

        return id2;

    }

它只是创建模板,然后用所需的ID制作一个会话变量。

第二个AJAX

第二个ajax在循环中

$(".Type1").each(function (i, e) {[…]}

只需遍历所有元素并将它们添加到数据库中(每个元素都有自己的ajax函数)

var data = {};

            data.ID = "2";
            data.InitialID = Lid;
            data.Xpos = Xcoord;
            data.Ypos = Ycoord;
            data.Itemwidth = object1.width;
            data.Itemheight = object1.height;
            data.CTid = '<%= Session["TheID"] %>';

在这里您看到我如何尝试通过会话变量传递前一个ajax的输出(我也尝试过制作一个普通变量,但效果不佳)

$.ajax({

                url: '<%= ResolveUrl("~/WebService1.asmx/AddItemo") %>',
                data: JSON.stringify(data),
                dataType: "json",
                type: "POST",
                contentType: "application/json; charset=utf-8",
                success: function (result) {
                    alert(result);
                    console.log(result);
                },
                failure: function (jqXHR, textStatus, errorThrown) {
                    alert("Status: " + jqXHR.status + "; Error: " + jqXHR.responseText); // Display error message  
                }
            }); 

及其调用的Web服务:

[WebMethod(EnableSession = true)]

    public Item2 AddItemo(string ID, string InitialID, string Xpos, string Ypos, string Itemwidth, string Itemheight, string CTid)
    {

        int id1 = Convert.ToInt32(Math.Floor(Convert.ToDouble(ID)));
        int id = Convert.ToInt32(Math.Floor(Convert.ToDouble(InitialID)));
        int w = Convert.ToInt32(Math.Floor(Convert.ToDouble(Itemwidth)));
        int h = Convert.ToInt32(Math.Floor(Convert.ToDouble(Itemheight)));
        int x = Convert.ToInt32(Math.Floor(Convert.ToDouble(Xpos)));
        int y = Convert.ToInt32(Math.Floor(Convert.ToDouble(Ypos)));
        int cusID = Convert.ToInt32(Math.Floor(Convert.ToDouble(CTid)));


        Models2.Item2 itemo2 = new Models2.Item2
        {
            Id = id1,
            InitialID = id,
            Itemwidth = w,
            Itemheight = h,
            Xpos = x,
            Ypos = y,
            TemplateID = cusID

        };

        using (TestEntities db2 = new TestEntities())
        {
            db2.Item2.Add(itemo2);
            db2.SaveChanges();

        }


        return itemo2;

    }

问题在于,由于ajax是异步的,因此我尝试传递的变量尚未准备就绪,因此它给了我内部错误500:

ExceptionType:"System.FormatException"
Message:"Input string was not in a correct format."

我尝试了所有可以找到的东西:

1-使用

设置所有ajax
async:false,

2-在第一个ajax上使用.done

 $.ajax({}).done(ajax2)

3-$。when(ajax1).then(ajax2);

4-将第二个ajax放在第一个的成功函数中。

将5放入第一个ajax的完整功能

6-使用setinterval添加延迟

我正在考虑创建模板,重定向到第二个页面,在此我称为第二个ajax。

请帮助我, 我已经坚持了几天。

1 个答案:

答案 0 :(得分:2)

您需要检查Chrome DevTools中的网络面板。

  1. 所有XHR发送成功吗?
  2. 所有XHR请求参数和响应主体是否正确?
  

如果您对此不熟悉,那么实际上建议您通过执行以下步骤在此处复制/粘贴XHR:

     
      在Chrome DevTools的“网络”面板中
  1. 右键单击
  2.   
  3. 选择复制 => 以提取方式复制复制响应
  4.   

这是一个简单的伪代码,可以解决您的情况。

// first ajax
$.ajax({
  url: firstAjaxURL,
  success: function (result) {
    // you can get the database ID from "result"
    console.log(result.id);

    $(".Type1").each(function (i, e) {
      // second ajax can take the "result.id" as params
      $.ajax({
        url: secondAjaxURL,
        params: {id: result.id},
        success: function (secondResult) {
          console.log(secondResult);
        }
      })
    }
  }
})

就像上面的丑陋代码一样,当后面的ajax需要第一个ajax的响应内容作为params时,上面的代码将在回调函数内部和在回调函数内部使用回调函数。如果您需要3个或更多个ajax,该怎么办?此问题称为“回调地狱”。解决“回调地狱”的解决方案是:Promise,Generator,async / await。您可以对其进行搜索。