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
Related
I just came accross the below issue in a project of mine:
user clicks a button
a js function is called to check the
input of the form field and if accepted will submit the form to save_to_db.php in an
iframe.
in the iframe, save_to_db.php will save the form details to the db and calls another js function that updates the contents of html elements on the current page showing the latest status.
This used to work without any issues (and still does in most browsers).
But now in Chrome Mobile browser version 63.0.3239 somehow every link a user clicks after they clicked the button, will load to save_to_db.php (the form action of the button) instead of the link that is clicked.
Has anyone noticed this or similiar behaviour or does anyone know how to resolve this?
So I have a somewhat unique issue I believe and I'm not sure what's the best way around it. I have some legacy code that has worked fine in the past in all browser's and suddenly in IE10 it is not working. I'll try to explain as best I can how it works and what I think is the issue.
I am working on an online banking page which has an option for the user to download their account history as a QIF, CSV, etc. The page is written with Classic ASP and VB server code. The way the feature works is the user clicks the download button which reloads the page with a series of clickable images, one for each download file type. Based on the one they click, a javascript function is then called which submits a hidden form on the page and then submits a second hidden form in order to reload the original view with the account history and filters again. The first form action calls an asp page which builds the file and returns it as a response attachment which usually prompts the browser to download the file, and then the second submit action is just the original asp page with the history details. In IE10, the file doesn't download ever and instead some processing occurs and the second submit which reloads the history goes through fine.
What I've found in my looking is that if I comment out the javascript line that submits the second form, then the download works so I think what's happening is the submits are occuring asynchronously and the redirect one returns before the download one. Or something like that. I'm not sure. I'm trying to figure out a work around without having to completely rewrite the feature. Any thoughts?
EDIT:
The page this all occurs on is accountDetails.asp
The javascript --
function SetOFX(type){
// There is some code that does conditional handling of the #type parameter
document.forms.DownloadForm.submit();
document.forms.Finished.submit();
return false
}
The DownloadForm --
<form name="DownloadForm" id="DownloadForm" action="downloadofx.asp" method="post">
<!-- a bunch of input type="hidden" elements -->
</form>
The Finished Form --
<form name="Finished " id="Finished " action="accountDetails.asp" method="post">
<!-- a bunch of input type="hidden" elements -->
</form>
So the DownloadForm calls a separate asp page to get the download file and then the Finished form posts to the page the user is already on to reload the account history details instead of showing the download image buttons. I realize this is a really bad way of doing this in the first place; this is legacy code written by people who were learning and is already being used in production by hundreds of clients so I can't just rewrite it without a major project approval from my boss and all of our clients.
iI haven't tested any of these ideas, but if you want to keep the current architecture, you could try to detect when the file has been completely downloaded and then navigate away.
Have a look at this question to know how to detect when the file has been downloaded by the browser.
Another idea would be to drop the first form submission in favor of a simple a link with an href attribute that points to your file download link, using query string params to pass additionnal data. You might also want to put taget="_blank" on the link if you still experience the same issue without it.
Here's the answer we came up with in the end. The above javascript shouldn't have ever worked in the first place and in fact we found out after testing that it wasn't working in many places but the part we cared about (the file download) was always working. It turns out up until IE10, all browsers have been smart enough to know that you shouldn't submit two forms that way and they ended up ignoring the second submit. IE10 however was processing them both and the redirect was returning before the file download. Since we didn't care about an auto-redirect we just took that submit out and instead added a submit button to the finished form so the user could manually return to the previous view.
The fixed Javascript --
function SetOFX(type){
// There is some code that does conditional handling of the #type parameter
document.forms.DownloadForm.submit();
return false
}
The fixed Finished Form
<form name="Finished" id="Finished" action="accountDetails.asp" method="post">
<!-- a bunch of input type="hidden" elements -->
<input type="submit" value="Return to Account Details" />
</form>
I am new and apologies if i asked age old question. I have a problem with an asp.net web application, as follows:
Problem:
On Page 1 i need to enter details and click next button to go to Page 2
If i had any validation error(s), i clear them and then click next button
On Page 2 if i click BROWSER BACK button, i would expect to see corrected details on page 1 but it loads the Page 1 WITH VALIDATION ERRORS.
More information:
The aspx of Page 1 alread has meta tags with expire set to -1 and 'no-cache' set for both cache-control and pragma properties.
On IE 8, i get 'page expired' page but on firefox 8, it automatically refreshes the page instead of showing 'page expired' page.
The issue seems to be there even on IE, when i try to refresh the page manually, i could see the old validation errors similar to FIrefox behavior.
Out of curiosity i entered improper details on page 1 in such a way i am hampered by validation errors 3 times. Then i correct details and clicked next button to reach Page 2.
On page 2 on clicking browser back button, i will get the validation errors i recieved on THIRD TIME, or the latest version of page 1 with vlidation errors.
However browser back button works fine when there were no validation errors on previous page.
Sorry for writing so much info, just thought might give you more insight into the problem.
Sounds like you are trying to create a wizard-like process where you take the user through multiple steps (pages) before the end goal. If that is the case, the way I've handled that in the past is through the use of Panel tags. Add a Panel tag for each step in your process and add your form elements to each. You can also have a "Next" button to progress to the next step within each Panel. When the button is clicked, hide the current Panel and unhide the next. You can also apply validation logic to the button to prevent the user from advancing with bad input. At the end, you can redirect them to a different page for a "success" message or summary. If the success page was also another Panel on the page, the user would be able to resubmit the form by refreshing the page if not handled correctly.
We've done this a lot and have never run into validation issues like the kind you are describing. I hope this helps you a little.
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.
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.