Understanding of the synchronous state and ajax sucess, the complete sequence of the

Today write code, write a very simple delete function, but it has encountered a problem on the order of execution of ajax somehow, in this write down and share with you.

First the code.

	//第一步先同步删除
layer.confirm("确认删除所选数据?",function(){
		 $.ajax({
           type:"post",
           url:url,
           data:{"ids":ids},
           async:false,
	       traditional: true,
           success: function (data) {
        	   if(data.code=="1"){
        		   layer.msg('删除成功')
        	   }else{
        		   layer.msg('删除失败')
        	   }
             },
  		  });
 	   });
   //删除完毕后再刷新表格
    F5();

A very clear logic, first delete the data inside the database synchronization ajax, then refresh the page table.

Ideal is full, the reality is very skinny, I actually found this deletion method is to perform a refresh before pop-up "to confirm the deletion of the selected data," Editor's Note ah! Brother maybe; whether layer.confirm immediately thought of this method is asynchronous, then immediately replaced the layer window, and found that indeed, layerUi inside this method really is asynchronous, immediately put the code into this.

	layer.confirm("确认删除所选数据?",function(){
		 $.ajax({
           type:"post",
           url:"${ctx}/patrol/patrol!deleteBo.action",
           data:{"ids":ids},
           async:false,
	       traditional: true,
           success: function (data) {
        	   if(data.code=="1"){
        		   layer.msg('删除成功')
        	   }else{
        		   layer.msg('删除失败')
        	   }
             },
  		  });
//第二步的刷新
 F5();
 	   });

This finally is the first implementation of layer.confirm, but I also found that he actually has the code to perform a refresh before I pop to delete success, this is what ah, ah I ajax clearly synchronized, he clearly should be performed on the whole from the ajax down, why did he go refresh it.

I thought, is not it sync sync success , can only sync to synchronize ajax request, then I refresh not only put success inside, but as a programmer has to pursue, always unwilling to give in this situation I immediately thought ajax, there are arguments complete, immediately change the code as follows.

	layer.confirm("确认删除所选数据?",function(){
		 $.ajax({
           type:"post",
           url:"${ctx}/patrol/patrol!deleteBo.action",
           data:{"ids":ids},
           async:false,
	       traditional: true,
           success: function (data) {
        	   if(data.code=="1"){
        		   layer.msg('删除成功')
        	   }else{
        		   layer.msg('删除失败')
        	   }
             },
             complete: function(XMLHttpRequest, textStatus) { 
                //这里执行刷新
                F5();
            },
  		  });
 	   });

Run, boom, an explosion, it actually has to perform a complete refresh inside, success is asynchronous, fuck you complete and it should not be the same thing, unbelievers go to Baidu query wave, we found that a lot of people are say.

Are used to try catch finally analogy, terms of functionality, not entirely wrong, but the order completely wrong ah, it seems a different perspective of the slaves, the idea of ​​looking at things is not the same.

And after some testing, I found that no matter synchronous asynchronous, complete methods are executed first, it's just going to ask the server, it returns to a response, but the success they need to access the data level, and then return the data, which also the side that their order, so finally I gave in, put the code into this.

layer.confirm("确认删除所选数据?",function(){
		 $.ajax({
           type:"post",
           url:"${ctx}/patrol/patrol!deleteBo.action",
           data:{"ids":ids},
           async:false,
	       traditional: true,
           success: function (data) {
        	   if(data.code=="1"){
        		   layer.msg('删除成功')
        	   }else{
        		   layer.msg('删除失败')
        	   }
            //这里刷新
        	   F5();
             },
  		  });
 	   });

Well, get, although it is a small problem, but by this time, I am more thorough understanding of the difference between the success and complete ajax, while its synchronous asynchronous also have a better understanding.

Published 27 original articles · won praise 1 · views 3654

Guess you like

Origin blog.csdn.net/qq_40111437/article/details/84967466