When I step through the Chrome debugger, the DOM changes appear and then disappear when it exits ajax. This doesn’t happen when I hard load the data. To test, I made this simple file and the same thing happens? Any ideas?
Thanks for getting back to me and sorry for wasting your time. I made some mistakes when deleting some of my debugging statements. Below is the full file. The “Test for Debug Line” shows up immediately after stepping past the window.document.getElementById(“links”).innerHTML = “
Test for Debug
”; line. It then returns to the previous placeholder.
function getWiki() {
var wiki = document.getElementById(“q”).value;
var wikiUrl;
wikiUrl = “https://en.wikipedia.org/w/api.php?action=opensearch&search=” + wiki + “&format=json&origin=*”;
console.log(wikiUrl);
$.ajax({
url: wikiUrl,
method: “GET”,
dataType: “jsonp”,
crossDomain: true,
success: function(qdata, textStatus, jqXHR) {
listitems = “
Update: I deconstructed and pulled it out of the function and to the top of the .js and it works. When I put it back in the function it doesn’t. I must be missing some sort of global variables.
It sticks out to me that you’re using a POST request and you aren’t posting to the server. I would use a GET. Besides that I would test your request using a callback that takes 1 argument then log that argument to see if you get anything back.
example would be: .then(function(data){console.log(data)})
I switched to GET. There are two versions here (everything is in one file if you are inclined to cut and paste). The only difference is that in the first has a document.getElementById(“wsearch”).addEventListener(“submit”, function() {
while the second goes straight through (resulting in no user interaction). In the first case the change sticks, in the second it doesn’t. I wonder if this might be related to the Cross-Origin requests.
Few things here if you haven’t got this yet. You should make a function that calls your get request. Store your variables and elements in that function and not globally. Then on your button submit call you should call that function. That should help.
Here is what I would do for the function to give you an idea: