My WordPress installation has mysteriously begun to stop applying some layout fixes and I suspect that it has something to do with a strange GET request that I'm trying to hunt down:
I'm guessing that I'm assembling the url, mydomain.com/undefined with a variable that I fail to assign a value and is thus evaluated as "undefined". My question is, where is this happening.
When I click the link to "undefined:1" on the right, it takes me to a list of images and displays the markup for my site's 404 page:
How can I isolate the place on my site where the GET request is being made?
Try XHR breakpoints. After defining the breakpoint, you should pause on the JS that's making the request. If it happens during load, then reload the page, and you should still pause when that code is encountered.
Related
Bear with me as this is my first question here. I will try to format it as best I can.
I have installed a contact form plugin to my wordpress site and after setting everything up, I am now getting an error when I load the page that states this:
AJAX CALL ERROR
Error: 0 error
Verify the attribute action of the form. It seems there is an error
I spoke with the developer and he is able to load it on his demo site, I ran the site in debug mode, and looked at the .htaccess information. He is telling me that there must be something wrong with the server configuration since it only shows on the front end. I don't see anything in the htaccess file which would cause this. I am not very familiar with Ajax or htaccess(a little but not much) so That is why I'm asking this here. Does anyone have a suggestion, because I'm at a loss right now. Thanks
Open up Chrome, go to "Tools" then "Developer Tools", then click on the "Network" tab, try to load the page and monitor the AJAX calls the form is making. You can click on them and look at the request and response headers and the content returned by all the AJAX calls. Find the one that is broken. Start your debugging there.
If the server is returning some sort of error, like a 500 error, then look at the contents of the page being returned, there may be a better error message there. If it's a 404 error, then you're form is trying to make an AJAX call to something the server can't find.
If you go to http://jsbin.com/ibozun/2, hit "Add Item," and then hit "Save," you will see that a second dialog is opened on top of the first one. The form in the dialog is posting to itself (no action defined) - this is by design. Because the dialog has duplicated itself, now you have to hit "Cancel" 2 times to get it to close.
The use-case for this setup is a MS MVC3 page with unobtrusive JQuery validation on it. The default scripts (in other words, I have no custom validators - the scripts are straight from MS) cause an ajax call to the server, and JQM treats that the same as a self-posting form - so you wind up with a duplicate dialog if validation fails.
A similar thing happens if the second page as a page, rather than a dialog - the form posting to itself results in a second history entry in the browser, so to get back to page 1, you have to hit back 2 times.
I believed this be a bug in JQM, but after submitting a bug on GitHub, I was told that this is the expected behavior. So, assuming this behavior that will not be changing in the framework, how do I prevent this from happening for my instance (preferring NOT to edit the framework JS)? Do I have to write my own ajax calls for validation so that I can prevent JQM from knowing that anything has happened? That seems unfortunate...
One idea I had was to detect that the nextPage and current page are the same on "pageHide", and manipulate the dialog/history myself, but have had no luck.
Thanks in advance!
First, there is no dialog duplication in the example. Second, my response and an explanation as to why solving the history issues with posting back to the same page for users of the library is hard can be found here. This example is particularly thorny because it's also in a dialog which we don't support linking to, so disabling ajax for the form (ie forcing it to reload), which would work if it were embedded in a page, won't serve.
The quick solution here is to switch the dialog to a page and add the data-ajax=false data attribute to the form. Mind you this causes a page flash/reload and requires that the form document be fully formed with a head including javascript,css, etc.
The problem is this:
When I change the content on a page via AJAX and then use the browsers back and forward button to go to the same page, then I will be presented with the content of the page before the AJAX was executed.
This seems to be specific to IE (confirmed on version 8), as Firefox will render the last version of the page.
Just to clarify, I don't need (nor want for usability reasons) to replay the AJAX calls when clicking back/forward.
We were thinking about firing the last AJAX call on page load (if that event is even triggered), but we would like not to force everyone to wait through the additional AJAX call when going to the page the second time, also this would cause the first real load of the page to be slower as well.
Maybe someone has a good solution for this?
I think it will be useful : http://www.ibm.com/developerworks/library/os-php-rad2/ ;)
I am a beginner using ajax and I always thought that it is completely asynchronous. But I discovered that a call can be interrupted by a page reload or a page change (like clicking on a hyperlink). I was under the impression that when an ajax call is started, it is carried out no matter what the browser does afterwards. Is that wrong?
Now to the specific problem I am having: think of an online test where users answer questions (by typing into textboxes). When a textbox loses focus, an ajax call is triggered which persists the value of the textbox to a DB. That works well when changing between textboxes. However, I also have a submit button which triggeres a post action to another page (it is the submit button). When I enter something into a textbox and click on the button afterwards, the call is not carried out. Moreover, when I type into a textbox, click somewhere else (also triggering the call) and swiftly click on the submit button, the call is also not made. Is that expected behaviour?
The reason I am using ajax in the first place is to persist the values so when something unforseeable happens, like a browser crash, the already typed in text is already saved.
Is my way of thinking wrong? How would you go about solving this problem?
Thank you for your time!
AJAX is asynchronous.
When you send an AJAX request the javascript engine sends it off and sets up a handler for the response.
However, if you send an AJAX request to the server and then navigate away from the page before it is received, nothing will happen. Why? Because with each page load the entire Javascript environment is tore down and reinitialized, it has no idea what happened on the last page.
For your problem I would intercept the form submit action and do whatever you need to do with the data, and then submit the form.
Edit: In response to your comment. You are correct. If the ajax request is sent, and you're not depending on it's return value, then it should not matter.
I'd suggest debugging your problem with Firebug to see if the AJAX call is really being sent properly, and to confirm your server is properly processing it.
Unless you do something special with persistent local storage, all javascript and ajax calls are blown away when a new page is loaded over the current page. Also when a submit is done on a form.
To save things intra-page, save the data asap. Eg, perhaps save on key-up, perhaps periodically with a timer, not just on lose-focus.
Re submitting the page: change the on-click behavior to first store, then to go to a new page.
All of the effects that you are seeing are normal.
Also, be sure to test on both slow (ie 6 or 7) and fast browsers (chrome)
I have a problem with ajax updater that i couldnt solve.
I have this code Servicii
It works perfectly in firefox but in internet explorer it does nothing.Also if i open the site from my harddrive it works but it only works for the link once then i have to reload the whole page...
Does anybody have an ideea on how to solve this problem?
Thank you
I've had this exact problem. I'm assuming that you've got a function which periodically makes a request to the server to fetch data then updates the page if that data has changed since the last time you made the request.
Internet Explorer will cache the results of Ajax calls to the same resource even if you tell it not to in your HTTP headers. So if you make a request to get_data?id=whatever over and over again, IE will make the request once and then stop making it in the future and simply return the result of the first request.
The solution is to add a dummy parameter to the request string. So first you request get_data?id=whatever&ie_hack=0 then get_data?id=whatever&ie_hack=1 etc. This will stop IE from caching the results and force it to make the request each time, since it sees a different query string for each request.
I also ran into a problem like this, not with caching but with race conditions. IE executed the render part of the function before the any data was returned. Here's the issue, and solution:
Returned AJAX html breaks IE click events