Jquery ajax 로딩 상태 메시지

Question

$.ajax({ 
       type: "POST", 
       url: "Services/Services.asmx/GetAllDoctors", 
       data: "{}", 
       contentType: "application/json; charset=utf-8", 
       dataType: "json", 
       success: function (data) { 
        for (var i = 0; i < data.d.length; i++) { 
         var centerAddress = CreateAddressToBind(data.d[i]); 
         doctorTemplates[i] = { row_ID: data.d[i].row_ID, DOCTOR_ID: data.d[i].DOCTOR_ID, DOCTOR_NAME: data.d[i].DOCTOR_NAME, LINE1_BLDG: data.d[i].LINE1_BLDG, LINE2_STREET: data.d[i].LINE2_STREET, LINE3_AREA: data.d[i].LINE3_AREA, CITY: data.d[i].CITY, PINCODE: data.d[i].PINCODE, MEDICALCENTER_ADDRESS: data.d[i].MEDICALCENTER_ADDRESS, STATE: data.d[i].PINCODE, OTHER_DETAILS: data.d[i].OTHER_DETAILS, CONTACT_DETAILS: data.d[i].CONTACT_DETAILS, modified: 0 } 
         $("#doctorTable").append("<tr id='tableRow'><td id='rowid' class='hiddenColumn'>" + data.d[i].row_ID.toString() + "</td><td id='doctorid'>" + data.d[i].DOCTOR_ID.toString() + "</td><td id='doctorname'>" + data.d[i].DOCTOR_NAME.toString() + "</td><td id='centerAddress'>" + data.d[i].MEDICALCENTER_ADDRESS.toString() + "</td><td id='doctorAddress'>" + data.d[i].LINE1_BLDG.toString() + "," + data.d[i].LINE2_STREET.toString() + "," + data.d[i].LINE3_AREA.toString() + "," + data.d[i].CITY.toString() + "," + data.d[i].PINCODE.toString() + "," + data.d[i].STATE.toString() + "</td><td id='cdetails'>" + data.d[i].CONTACT_DETAILS.toString() + "</td><td id='odetails'>" + data.d[i].OTHER_DETAILS.toString() + "</td><td><a href='#' onclick='EditRecord(this)'>Edit</a></td><td><a href='#' onclick='DeleteRecord(this)'>Delete</a></td><td class='modified'>0</td></tr>"); 
        } 
        $("#doctorTable").dataTable(); 
       } 
      }); 

콘텐츠가로드되는 동안 아약스 상태 메시지로드를 표시하려면 어떻게해야합니까?

Answer 1

그냥 요청을 보내기 전에 업데이트하는 선택기에서 일부 html 메시지를 제공하십시오. 이

$("#doctorTable").text("loading"); 
$.ajax(....); 

Answer 2

시도처럼 :

$('#doctorTable') 
    .hide() // hide it initially 
    .ajaxStart(function() { 
     $(this).show(); 
    }) 
    .ajaxStop(function() { 
     $(this).hide(); 
    });