ajaxComplete - how to call/trigger?

Question

How do I trigger a function when an AJAX response is complete?

On change of the drop down the manageImagesDynamicObjectDetails function is called:

<select id="imageComponentSelection" name="imageComponentSelection" onchange="manageImagesDynamicObjectDetails()">

This function passes variables related to this AJAX call to my makeRequests function.

function manageImagesDynamicObjectDetails(){
  var sendContent = "selection=".concat(document.getElementById('imageComponentSelection').value);
  var fileName = "RetrieveObjectsInformation";
  var elementId = "objectData";
  if(sendContent != "Select a class to view components"){
  makeRequest(fileName,sendContent,elementId);
  } 
}

makeRequest is a function which will be called for all AJAX calls and deals with them appropriately.

function makeRequest(fileName,sendContent,elementId) {
 var xmlHttpRequest = getXMLHttpRequest();
 xmlHttpRequest.onreadystatechange = getReadyStateHandler(xmlHttpRequest,elementId);
 xmlHttpRequest.open("POST", fileName, true);
 xmlHttpRequest.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
 xmlHttpRequest.send(sendContent);
}

When the speicif AJAX call is complete I want to call the resizeObjectList function.

function resizeObjectList(){
  var windowHeight = $('#contentWrapper').height();
  var newObjectListHeight = windowHeight - 53 - 20 - 20 - 60;
  var element =  document.getElementById("componentObjectList");
  if (typeof(element) != 'undefined' && element != null){
    document.getElementById("componentObjectList").style.height = newObjectListHeight;
  }
}

How do I do this? I've tried ajaxComplete and ajaxStop but I could not get them to trigger.

Tucker · Accepted Answer · 2013-02-10T16:22:49.523

0

I beleive you want somthing like: response = xmlHttpRequest.responseText;

bute the above works if you make ajax async. read: http://www.w3schools.com/ajax/ajax_xmlhttprequest_send.asp

if you use jquery, it makes ajax a lot more simple: http://api.jquery.com/jQuery.ajax/

here is an example:

$.ajax({
  url: "http://fiddle.jshell.net/favicon.png",
  type: "GET"
  data: "key0=val0&key1-val1"
}).done(function( data ) {
  alert(data)
});

edited Feb 10 '13 at 16:22

answered Feb 10 '13 at 16:08

Tucker

7,017
9
37
55

i recommend reading the link i also pasted in my response to better understand jquery and ajax. It will be your best friend. – Tucker Feb 10 '13 at 16:11
Do you know how to use jquery? you must first install jquery, then you can use it's ajax capabilities (as well as many other things). Heres how you install jquery: http://stackoverflow.com/questions/1458349/installing-jquery – Tucker Feb 10 '13 at 16:18
Yes I know how to install JQuery and I'm using it. I just don't find the JQuery Ajax that well explained. – Colin747 Feb 10 '13 at 16:19
i dug something up that might answer your question. see edited answer – Tucker Feb 10 '13 at 16:23

ajaxComplete - how to call/trigger?

1 Answers1