I've search high and low for an answer to this but unfortunately I'm stuck. The problem is only occuring in Firefox (tested IE, Chrome and Safari also - works fine, no errors of any sort). I'll detail the sequence of events to save posting all my code.
ASP.NET MVC 3 application, basic form loads into a jQuery UI dialog
Custom jQuery to hijax the form submit (serialize the form and then $.post to the server - no compiler errors when debugging and post shows up in Firebug without errors)
Http GET (automatically happens) getting the response object from the server (+ success text and XHR), response is plain HTML in this case (again, shows up in Firebug with no errors)
Custom jQuery to change the HTML of the UI dialog from it's current HTML to the response Html - this is where it fails.
I've used javascript alerts to debug the sequence of events and as soon as the post (and get) is complete, everything just... sort of stops.
As I say, only in firefox! Very odd, just wondering if there's any known bugs with ajax and firefox or anybody has heard of a similar situation?
I must also add, that on other parts of my site, this works perfectly in all browsers! The only difference between this form and the other forms that do successfully complete the function is that the response from this form is the same "page" again but updated rather than a new "page". (I use "page" as I got all this working with Javascript turned off first and for graceful degredation)
HELP! Or laugh, either is fine.
UPDATE
I have tried sending a view with a blank model back as the action result - works in every browser except firefox - firefox retains the values from the previous post! And then I got to thinking - that's a trait of firefox isn't it? And maybe that's why the original "re-direct" html response doesn't work?? I think it's time to give up and let people know they can't use Firefox for that particular function!
Ok so I'm answering my own question.
The only way I found to get round it is to use $.ajax instead of $.post and to use the option async : false
Hope this helps somebody.
Rob
Have you tried adding the attribute [OutputCache(Location = System.Web.UI.OutputCacheLocation.None)] to your Action for your GET? It sounds to me like a caching issue.
Related
Here's what I'm trying to achieve with my Chrome extension and the issue I'm facing:
My extension runs an ajax call every x minutes to a server and based on the result, displays the updated information in the extension pop-up window.
I was able to implement all of this logic with my ajax call made from popup.js and it works perfectly fine.
The only limitation I currently face is that the extension user has to click on the extension icon for the popup.js/html script to be triggered and executed (which is expected).
- I'm trying to figure how to trigger the ajax call function when the browser is launched.
Solution trial 1: I moved my ajax call and response logic from popup.js to background.js and included a chrome.runtime.onStartup.addListener. The problem with this approach is that background.js can't access my popup DOM and thus I cannot display my updated information.
Solution trial 2: I kept my ajax call and response logic in popup.js. In background.js, I added a chrome.runtime.sendMessage within the chrome.runtime.onStartup.addListener. The problem with this approach is that popup.js is not triggered obviously (no user click on extension icon yet) and thus apparently not able to get the message from background.js to execute the ajax call.
I'm pretty confused with what is the right approach to follow, it feels a bit like an chicken & egg problem.
Any help or feedback would be very much appreciated. Thanks in advance!
P.S: I'm using Manifest V3
I am attempting to make an AJAX contact form with Webscript (http://webscript.io), but I am running into a problem. Without AJAX, the form worked well and the email was delivered. After trying to add AJAX functionality, I stopped receiving emails through the form, yet the AJAX appears to run successfully. Here is a JS Bin with my example code: http://jsbin.com/aqahok/1/edit. I have a feeling the problem doesn't lie in the Webscript (which I believe you cannot view) but in the JS since the form worked without AJAX.
Thank you for taking a look at my problem and feel free to ask me any questions you may have.
Your JavaScript is looking for input[name="message"], but it should be looking for textarea[name="message"]. I changed that and tried to send an email. It appears to have worked (no error), so hopefully that's it.
The JS Bin you created makes webscript.io return 500 Internal Server Error (you can see it in Firebug or Chrome Dev Tools). AJAX part just does not check response and show the "Contact Form Submitted!". So problem is on their side.
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.
I have a form that uses Html.BeginForm and for most cases this works as you would expect.
But in some situations I display a partialview that does several ajax calls to populate itself. When the partial view has been displayed I need to click the submit button twice to get the form to post. On the first click I can see the form refresh, and then on the second click the form actually posts. This is when using IE9, using Firefox the posts work on the first click.
I would like to know if anyone has seen this behaivor before I spend a lot of time trying figure this out.
Install Fiddler, open it up, and then reproduce the issue in IE. Fiddler will capture all of the requests, so you can see exactly what was sent to the server (and back).
Had a similar issue. The reason was, we had a in view and in addition we were doing $('#form').submit() as well. But the button didn't have "type" attribute. After setting button type=button. It was good.
1) I saw an interview question on this, and I'm assuming it's something to do with form submission and avoiding double submissions. Can someone confirm this?
2) Assuming this assumption is correct, can this be done with Ajax? If so is there a link someone can point me to?
(I'm assuming you'd generate some sort of random number and include it in the form as a hidden field, then ensure that number hadn't been submitted before for the session).
Redirect-after-post is a technique to avoid problems with the user refreshing or using the back button to get back to a posted form. In short, instead of providing a response page to an HTTP post, which will trigger another post if its reloaded, you issue a 303 redirect (or a 302, to support ancient browsers by taking advantage of a bug that is as old as the web). This causes the browser to issue a second HTTP request - a get this time - and if the response page to that is reloaded there shouldn't be any problems. Just make sure that all the changes are made by the post handler and the page you redirect to has no side effects.
If you post using XMLHttpRequest then the redirect will be followed; unless you specifically support it using the hash part of the location or the new HTML5 history methods then the back button and reload aren't going to trigger an AJAX post again.