IE8 Submits the form but sometimes doesn't refresh the page - javascript

I have a button and when I click that button a function works, it calls jQuery .submit function.
I use jQuery 1.4.2.
However, sometimes it submits but doesn't refresh the page. I got this problem just on IE8.
Actually it works on IE8 but sometimes I get this problem and sometimes not.
My page is like that; there are some text fields and a chechboxes near every text field. I check the checkbox and push the delete button, it submits the value and that text field disappear(it is deleted at server side and the page reloads all the text fields that saved at server side). The problem is that sometimes that textfield doesn't disappear from the screen but if I re-enter page's url and push enter or F5 the page or check the checkbox and push the delete button again everything works fine...

Sounds like browser caching issue. To solve this, when you submit the form add random value to its action, thus tricking the browser to think it's different page so it won't load the contents from its cache.
Sample code:
var rand = parseInt(Math.random() * 1000000 + 100000);
$(form).attr("action", "mypage.php?r=" + rand);
...

Problem was about my server side structure, was not related to only ie8.

Related

automatically post form when leaving page

This is a plain javascript question.
I have a page C in which sits a textarea T.
T's content gets added to by clicks on various buttons on C (essentially T accumulates the list of times at which the buttons were clicked).
There is also a button to submit the contents of T by a post request to a server (T being surrounded by a form element).
When the user forgets to click the submit button and closes the page's window, I want the posting of T's contents to happen anyway, just as if the user had clicked the submit button before closing the window.
I know I can intercept the page closing and prompt the user to do the submit, but that is NOT what I want.
It seems to be impossible to submit the form containing T from inside a function that is called by onbeforeunload.
Thanks for any tip.
This is simply not possible : this is a security measure designed to ensure a site can't prevent a user instantly leaving a page if he wants to.
The best you can do is posting your form using ajax each time a field is changed.
I've used this code in part of my application - it doesn't capture any text though but you could give it a try.
window.onbeforeunload = confirmExit;
function confirmExit(){
data = $("#data").val();
$.ajax({
url: 'complete.php?data=' + data
});
}

onChange() for dropdown does not work the second time

This is hard to sum up in the title. I'm using CodeIgniter with jQuery Mobile. I have a page(index.php) with a dropdown list which submits the form when clicked (onChange).
<select name="organiser_dropdown" onchange="this.form.submit()">
It works fine. So it brings me to the next page (view_events) with no problems. However, when I press the 'back' button on the mobile (Samsung Galaxy S Plus), and select an option from the dropdown list in index.php, the form submits, I go to the correct page (view_events) with the correct information, and then it brings me back to the page with the dropdown list.
There are no redirects and the code logic seems to be correct. When I test it in the desktop browser, everything works as normal.
I'm almost certain that the problem is that the phone is caching the page so when I click back to index.php, it doesn't reload the page, and somehow this is breaking it? I think it's caching because the page doesn't seem to take time to reload.
I have used a submit button instead of the onChange() function, and everything works as normal. That also indicates that it's an issue with caching.
I used jQuery to listen for the onChange event and to submit the form by clicking a hidden button. It worked without problems, but it loaded the page with the dropdown list still appearing on the phone GUI. This would seem a bit weird for usability reasons, if I was to kepe this as an option.
It's not a native phone App, it's a mobile website.
In CodeIgniter, the controller is using a function with 1 parameter which is the selected item from the dropdown list:
public function view_events($organiser_type = '') {...}
When the *$organiser_type* is not sent through the url, I have a piece of code which retrieves the value from the POSTed form:
if($this->input->post('organiser_dropdown')) {
$organiser_type = $this->input->post('organiser_dropdown');
}
I have kind of figured out the problem here. I think that jQuery Mobile is not fully executing the index.php page once i press the back button on the phone.
I put this in all my links to force a page load without ajax:
data-ajax="false"
More information regarding this can be found here: http://jquerymobile.com/test/docs/pages/page-links.html

Javascript How to auto submit

I am writing a script to make a page auto submit twice. The script should first press the first submit button, then have a small delay and press the second. Both are on the same document.
What I am doing is: get the document, then use document.GetElementByID('id_button').click(), and have timeOut for a delay to the second click. Thing is, the first button works fine, but the second won't work. I don't know why. Is my approach correct?
Have the action on the form reflect the state.
/Page.HTML
/Page.HTML? washere=true
/Page.HTML? washereagain=true
That can be identified by your script
What I am doing is: get the document, then use document.GetElementByID('id_button').click(),
Not all browsers support the click method for submit buttons, so your strategy will fail for a good number of browsers in use.
You can submit the form by calling its submit method. If you want to auto-submit it a certain number of times (which seems a pointless exercise, but that's your choice), set a cookie each time you submit the form and check it when the page loads to see how many times it's been submitted.

javascript form submitting to wrong target second time

I have a form I am submitting with form.submit() to a hidden iframe. I then take the result and process the data.
If the result fails (validation errors) then I display an error in a div tag.
The problem I have is that if you press the submit button again the form submits to a new tab.
I tried form.reset(); // just resets the form.
I have tried resetting the target of the form to the hidden iframe again but that doesn't seem to work either.
I tried this a long time back.
The trick was to set the target of the form to hidden iframe using html and not JS. What I mean is, you should do:
formContainer.html("<form target='iframe_name' .... />");
However,
get_form_by_id.setAttribute("target","iframe_name")
didn't provide the desired result.
(There shouldn't be a reason for it, however speaking from experience, I faced this issue when designing an IE compatible website and this was the solution that worked).

JavaScript auto-POST with NAME

I have an OnBase e-Form that I'm building. There are three buttons on the form that all submit. OnBase does different things based on the name of the button used to submit the form. If the button has a name of OBBtn_CrossReference it opens another window with a cross referenced document. I need to programmatically 'click' that button.
I've read several posts about how to use JavaScript to submit a form, but none seem to accomplish my goal. I just need to POST and to have it appear to come from a button named OBBtn_CrossReference.
I don't need to submit any data. The way the page is currently set up, the entire page is already a form and since I don't want to break the functionality of the other form buttons it seems I must leave it that way.
UPDATE:
The suggestion below was tested as a call from the onload event in the body tag and since the button posts the page reloads and the call is made over and over again spawning unlimited child windows. I would appreciate a suggestion on how to get the button to only be clicked the first time the page is loaded and not on postback.
There's a click() method on links, buttons, checkboxes. For example , I submitted this comment by running document.getElementById('submit-button').click() from chrome's command line.
I know I am a little late to this post, but you can try and leverage a cookie to get this done:
if (document.cookie.indexOf('xref=true', 0) < 0) {
// Set the xRef cookie, so we do not fire it again for this form.
document.cookie = 'xref=true';
//alert(document.cookie);
document.getElementById("OBBtn_CrossReference").click();
}
else {
document.cookie = "xref=false";
//alert(document.cookie);
}
I tested this on the Thick and Thin clients in 10.0 and it worked fine.
The postings on this site are my own and don't necessarily represent my company's positions, strategies or opinions.

Categories

Resources