My question is how can I print and submit a form at the same time.
I am using the following code, but if printing takes longer than 2 seconds, it cancels the submit of the form.
<button class="btn btn-primary" id="saveandprint"
onclick="jQuery('#printableArea').print() + setTimeout(function(){document.getElementById('save').click()}, 2000)">
Save And Print</button>
The jQuery plugin I am using for printing:
<script src="jQuery.print.js"></script>
Thank you!
If the browser is navigating to another page to submit the form, no. If it's being sent over ajax, then I believe so.
If you need the print operation to occur only when the form's submitted, it's better to have it triggered on the page the browser is being directed to. Loading and fetching of resources won't pause if the browser's waiting for the user to confirm a print dialogue.
Related
We are using a submit button in a timesheet which gets disabled once the month is finished. User cannot submit on next month.
Problem some user go to inspect element and remove disabled and submit the form.
<a id="submit_time_sheet_id" href="javascript:void(0);"
onclick="isAllDaysPunched()" class="btn btn-xs btn-primary"
disabled="disabled">FinalSubmit</a>
User removes disabled="disabled" and form gets submitted.How to prevent user from modifying code
This will always be possible. You can't prevent anyone from using the developer tools to manipulate your form. That's why you always have to check data sent to the server server side.
“How to prevent user from modifying code?”
The answer is: you can't. How your website is opened is absolutely only decided by the respective user. Any person may download the HTML/JS/CSS source code of your website and modify it according to their needs. Or they directly invoke the form submit using tools like cURL.
The only way to prevent the submitting of data in a specified period, is to check the state – whether a user can submit data or not –on the server-side.
According to this Answer
you can recheck your validations in the submit action.
I have a page, to which I POST information via form method="post". I would like to relaod it with JavaScript, but location.reload(true) and location.reload() makes browsers ask if I want to send the POST data again.
I would like to make JavaScript reload the page with GET instead of POST to skip the POST data.
How can I achieve that?
window.location.href = window.location.href
try
To reload a page without post data using javascript the easiest way I've found is to use an extra form to submit - this works regardless of whether the url is # or anything.
<form name="reloadForm">
<button type="submit">
Continue
</button>
</form>
<script>
document.reloadForm.submit() ;
</script>
That will show a button briefly on screen that the user can click continue on but the script will automatically submit it - this method sorts out a number of problems - the form is empty so it will not submit any post data (the button isn't named so even that won't submit a value). It works even if the url is set to #, and finally it gives a backup in case the user has disabled javascript (or the javascript doesn't work for some reason) they've still got a continue button available to click.
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'm updating an existing application that has several different button types on some pages that submit forms. I need each button to be able to execute some javascript right before submitting a form. I put my js code in the onsubmit event of the form, but not all buttons execute it. I created a sample that shows 3 different buttons that all submit the form. Buttons 1 and 3 will display the alert I entered into the form's onsubmit event. Button 2 does not. I know I could put the alert code in the onclick for button 2 before the submit() call, but I really need a way that is consistent with all buttons. I need all buttons to execute the alert in my sample and I want to update code in one place and have it work for all buttons that are submitting this form. Is this possible? Let me know if I need to provide more information.
Code:
<html>
<body>
<form name="form1" action="x.html" method="get" onsubmit="alert('onsubmit javascript executed');">
<br><br>
<input type="submit" value="1. html input type submit">
<br><br>
<input type="button" value="2. html input type button with onclick" onclick="document.form1.submit();">
<br><br>
<button style="width:180px;margin-right:5px;height:30px" onclick="document.form1.submit();">
3. html button with onclick
</button>
</form>
</body>
</html>
Update: 1/15/2014
Thanks for the ideas, but unfortunately, it is not addressing the issue of creating one solution that works for all buttons that may cause a submit event. I spent all day yesterday trying different options based on the responses of both Jordan and Benjamin but still have not had luck. So I thought I would take a step back and explain why I am trying to do what I am asking about.
I have a classic ASP application. On the pages that require input from the user, I am getting many users that are timing out and when they click a button that submits the page they lose their information. So I am adding a javascript timer to the page to first warn the user they are about to time out and then let them know that they have timed out so that they can copy and paste their work somewhere else to save it. A key point is that the way this app was designed is that most pages submit to a hidden iframe so that the page doesn’t have to be reloaded. If the user times out they don’t know it because it happens in the hidden iframe and they think the app just locked up.
My solution to this problem was to create a javascript timer on the page. It creates a variable with the start time that the page loaded and counts down each second displaying a javascript message at set times. I set it up and it works great, with one exception. If the user submits a page (to the hidden iframe), their session timeout gets reset, but my javascript variable that tracks time does not. This would lead to them getting a timeout message when they have not really timed out. My first thought was that this would be an easy fix because after the page loads I can write a javascript function that finds every form onsubmit event and prepend a line of code to update my timer variable. However, based on my original question, this is an issue because the form onsubmit event is not being called if the button is not a submit button even though it calls the submit() function of the form. Ideally, I wanted to provide code that could be added to each form page that would not require any other updates to that page.
Unless someone has a better idea, I think I’m going to have to update some existing code on each page. For any <input type=submit> or <button type=submit>, the update to the form’s onsubmit is fine and that is handled automatically by the javascript code I add to the page that finds all the forms and updates the onsubmit event. But for each <input type=button> and <button type=button> I will have to manually check their onclick event and each function that it might call to see if it calls the submit() function. If it does, then I have to do like Jordan pointed out and make it call a function where I can enter my code before calling the submit().
Any ideas to address my issue or to suggest a different method are appreciated. Thanks again.
Maybe you could instead submit the form from an event handler on the non-standard buttons, and have your code execute beforehand:
HTML
<button onclick="formSubmitHandler()">Submit</button>
JS
function formSubmitHandler() {
// your code
document.form1.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.