I have a form and I want to set focus on the status message when the form is submitted.
I have tried the following code.
$('form').on('submit', function(){
$('.messages--status').focus();
});
But the problem is that when I submit the form the page reloads and therefore my code is not working.
Is there any way to find on page reload that the form is submitted?
So that can I set the focus on the status message based on that condition?
Append a query parameter your url, and show the message based on that.
Eg. suppose your form action url is www.foo.com/form/submit then make it, www.foo.com/form/submit?submitted,
so when the page loads you can check whether submitted is there in the URL or not.
Related
I am trying to upload an image to instagram's mobile website through selenium. It seems to find the element in question but when I try to submit it, the page merely refreshes.
uploadForm=driver.find_element_by_xpath('//*[#id="react-root"]/section/nav/div/div/form/input')
driver.execute_script("arguments[0].style.height='auto'; arguments[0].style.visibility='visible';", uploadForm)
#makes form visible
submitForm = driver.find_element_by_xpath('//*[#id="react-root"]/section/nav/div/div/form')
#selects whole form
driver.execute_script("arguments[0].style.height='auto'; arguments[0].style.visibility='visible';", submitForm)
#unhides form as well
uploadForm.send_keys("/testman.JPG")
#sends the file path to the input section of form
submitForm.submit()
#attempts to submit form, causing the refresh
Could there be some kind of JS listener preventing me from uploading this way? Here is the code of the form in question
Try doing a .click() on the submit button. Frequently, a dev will put a JavaScript onclick on the button that prevents the default action. You can see the default action for the form when the page "refreshes". The URL will contain your form as query-string parameter.
I have a form in my site. Fiddle is here
I removed tag because it gives error without action.
Here my issue is when I have full form with action, if I click the form its post back the page. Meanwhile the drop down menu show select an option :
before the form is submitted
when I select
After form is submitted
But I want the form should remain the values which is selected before the form is submitted. How can I do that?
You could either have the form content dynamically generated on the server-side, and when you submit, you generate the new form with the data already in it.
Or you could resort to ajax instead and don't do form submits.
When you submit your form, it will reload the page. And when the page is reloaded, the select option is by default "select an option".
You have to store the value before submitting, and when the page is reloaded, check if there is something stored. You can do that with the localStorage for exemple.
Or the second solution is to load the content in ajax, with a webmethod.
I'm writing a JQuery submission form validator, and every time I press the submit button my page reloads. The problem is that every time I loaded the page, I was passing information into the URL that told it which stylesheet to use. Is there a way I can tell the page to use that same URL (including the concatenated information) when it reloads?
How can I pass information into the page URL when I click the submit button and it reloads?
Just use the window.location property coming and going:
$('form').on('submit', function(evt){
evt.preventDefault(); // prevent normal submit mechanism
window.location = window.location; // redirect to current URL
});
Basically, when the user clicks the submit button, the event bubbles up to the form, which submits. If nothing interferes with this mechanism, the browser will submit the form using the form's action attribute. If the action attribute is absent, it will use the URL of the current page.
The code above intercepts the form submission, and substitutes your own code. Note that we could also intercept the button press ($('button').on('click')), but this is generally safer because it covers other ways that a form can get submitted, such as pressing enter on a default field.
To redirect the browser to any URL, all you have to do is set window.location. That property also stores the current URL, so setting it to itself, in essence, simply reloads the page. Of course if you needed to modify the URL, you could do it at this point.
By adding your css parameter as a hidden field in your form.
Then, depending on what you are calling through the form, a GET method would show up all your parameters in the url. If you are submitting as a POST, you can redirect the submition result and appending your css parameter into the URL.
Is it possible to replicate f5 action to link using jquery? I need to refresh the page and resend data using this link, I have tried :
location.reload(true); or document.location.reload(); or $.f5();
But did not satisfy me.
Steps to reproduce using f5 key :
1. fill form then submit
2. press f5 - confirm box will appear
The page that you're looking for used information that you entered.
Returning to that page might cause any action you took to be repeated.
Do you want to continue?
try using
window.location.reload(true);
if it wont resubmit the form. you have two more options.
Submit the form using ajax after once submitted and resubmit the form and second time refresh the page or clear the form
Or you can keep the post data in some session or in the post array [server side code] and refill the form and resubmit,
Make sure you keep the track of numbers of submit you made since it will cause you trap in some recursion.
BUT why you want to resubmit the form you already have data you can perform both actions,
And if you have to post the form to some other action for second submit you can do the same may be using CURL at server side.
Try this:
window.location.reload(false);
// If we needed to pull the document from
// the web-server again (such as where the document contents
// change dynamically) we would pass the argument as 'true'.
source
I have this form: http://lawb.co.il/HTMLPage.html
When someone click on the submit button ("שלח טופס" ) they are automaticaly redirected.
How can I prevent this action after clicking on the "שלח טופס" button, or that the page will redirect to a page that I choose and still I will get the information that people fill in the form?
The code is here http://jsfiddle.net/TCpkb/4/
Can you help me with it pleas?
You need to submit using AJAX and then redirect manually to your custom page. If you cannot use JavaScript, there is unfortunately no way to control the redirection if you let the user directly submit the HTML form.