First question! Glad to be here. :)
I have a form set up to validate the input, and then if all fields are valid, send the entered information over to an email:
<form onsubmit="return validateForm()" action="mailto:someemail#me.com" method="post" enctype="text/plain">
Everything works great! But now I need to reset the form after the information is transferred to the email (because my form is hidden on the same page, user can click the button again to make the form appear and the information from last time is still there). I can't add a line to my validateForm() to reset it because that happens before the information is transferred over, causing the email to lose the entered information. I also can't force the page to reset the form onload, because my webpage isn't reloaded after submission, and I certainly don't want to have to set a timer to clear it.
So my question is, how do I reset the form after the entered information is transferred to an email, using only HTML and JavaScript?
Thanks!
Related
I am building a multi-page form for my website. Each page has several fields and a Back Button and Next Button. The Next Button takes the user to the next page of the form. I have achieved this by adding a input button like <input type="submit" value="Next Step">. The Form action is set to a different php page. A Back button lets user go back to the previous page and make changes if any. For this, I added <input type="button" value="Back" onClick="history.go(-1);">
I have also added header('Cache-Control: max-age=900'); to all my pages. I also use Sessions to store data.
On clicking the back button, I can see all my previously entered text in the first form. But, on clicking the Next button, text entered in the next form disappears.
My question is, how can the user entered data be stored inspite of clicking the Next button. The browser forward button keeps the data though!
I may prefer you to use more elegant way of storing your forms' data by using any kind of local storage api. There is already an api that will do that for you:
Garlic.js
I'm not the developer of this api and I haven't tasted it by myself, but I've seen other people suggesting it to people.
I have a really simple form that allows a user to input an email address here:
<form method="post" action="http://www.mydomain.com/page2/">
<input type="email" name="email">
<input type="submit" value="Submit">
</form>
This works correctly and it takes the visitor to www.mydomain.com/page2 when the submit button is clicked.
I am trying to get it to email me this input email address also when the submit button is clicked. I understand how to email using PHP but can the action have two urls?
Or is there a simpler way of doing this?
On /page2/ access the email in the global variable $_POST['email']. And then you can send it to yourself with PHP mail(). Example:
mail('myemail#domain.com', 'Someone submitted my form', 'Their email was: ' . $_POST['email']);
If you are stuck somewhere else, let me know and I can update the answer.
Once a form is submitted, you are no longer on that page. You've navigated away.
The other way you can do this is submit the first action via AJAX, then submit the form naturally to the second destination. I would suggest using jQuery to make your AJAX calls since most of the AJAX code is already there for you to use.
Another option is to have page2 be a php script, and have it perform the two actions once it receives the form data. See: Post to another page within a PHP script
I understand how to email using PHP
Then I would recommend writing some PHP code that sends the email to you.
but can the action have two urls?
No. A web browser can't make two requests at the same time. Which response would take precedence?
Nor does it need to. Now, you have a target already:
http://www.mydomain.com/page2/
Don't you control that page? That would be the page on which you'd put your PHP code for sending an email. If you don't control that page, then you would want an intermediary page. Something like:
sendmailandredirect.php
(Named solely to illustrate intent, you can call it what you like.) What this page would do is send the email, then issue a redirect to your final target. Something like:
header('Location: http://www.mydomain.com/page2/');
In effect, there would be "two urls" but they're invoked in serial instead of in parallel.
If you wanted to keep the code seperate and the action url as /page2/ you could fire off an ajax request on submit to your sendmail handler.
I'm creating a form where the user will enter data, then click "Review" to see the data they entered. Then after review, "Save" the record.
I'm using a <cfform> to submit the form but wonder how to submit the data to the database from the "Review" page since there's no form here.
Should I set variables like FORM.Name = VARIABLES.Name to display on the review page, then convert them back after they submit the "Save"?
Not really sure what to do here. Overthinking?
Just keep in form scope. Basic output of form values, using baked in form.fieldList:
<cfloop list="#form.fieldList#" item="fieldName">
<cfoutput>
#fieldName#: #form[fieldName]#<br>
<input type="hidden" name="#fieldName#" value="#form[fieldName]#">
</cfoutput>
</cfloop>
Link to original form or submit to page where you save it, using values from hidden fields (which should mirror original form values)
A few other ways you could do this, but this seems simplest to me.
Why not using a second form with hidden input fields for the review page? Confirm would be a submit button to the page that saves the data to the server.
Second possibility (not that proper): save the data directly into the database and load it for the review from there. Trick: use a flag with "confirmed" and set it if confirmed. Bad part about that: you have to clean up older data that has not been confirmed.
Improving on Billy Cravens answer. This protects against the fields having Embedded Attacks
<cfoutput>
#lcase(fieldName)#: #xmlFormat(form[fieldName])#<br>
<input type="hidden" name="#fieldName#" value="#xmlFormat(form[fieldName])#" />
</cfoutput>
Also this will not work for image uploads. The lcase(fieldName) is to keeps the fields from being displayed as all caps. Lowercase is often easier to read.
I know I can send a custom field using IPN with $_POST['custom']
But can I do that with an uploaded file? More specifically an uploaded image?
And what if I have two custom fields? I previously used something like this:
<input type="hidden" name="custom" value="<?php echo $a.'|'.$b ?>"/>
But that was just text! Now I want to upload a file and I also have custom text, then I want to get it.
Is this possible and how would that look like?
Thanks!
I don't think it's possible to do it the way you're describing, but here's an alternative that I have used in the past.
Instead of having the form that contains the file upload post to PayPal, have it post to your site, and then store that uploaded file and any other custom data in a database (or any other way you choose to store it). Assign that data an id.
Now redirect the user to a page that contains basically the same form, except that the input fields should be hidden, and the form will post to PayPal. Fill in that form programmatically with the data from the previous post, and fill the 'custom' field with the id that you assigned to the custom data. This page would also contain a JavaScript statement like this (at the bottom after the form, to ensure that it doesn't execute until the form is loaded)...
<script type="text/javascript">
document.forms["paypalform"].submit();
</script>
...to automatically submit the form when the page is loaded. It's still a good idea to leave a submit button (you could style it as a link, if you want) in case the user has JavaScript disabled. It could say something like "Click here if you are not redirected to PayPal within 10 seconds." You could also add another message on the page such as "Redirecting to PayPal."
Now when you get your PDT or IPN information back from PayPal for that transaction, the 'custom' field will contain the id you assigned to the data earlier. It's just a matter of retrieving the data from wherever you stored it.
I've done this in ASP.NET before, and I assume it would work just as well in PHP (the server-side parts), but I can't say for sure.
Note: The 'custom' field can only contain up to 256 characters.
<FORM ID='htmlform' action="" onsubmit="return valforms(this)">
.....
<INPUT TYPE="submit" NAME="submit" VALUE="Submit">
When the user is done filling out the form, and clicks the submit button, I want all of the form information to be sent to me. How do I do this? This is only part of the code, the whole code is too long for me to type in here.
To reply on your question:
Oh, so like the page that emails the data is that an html page that I can have a message saying, "Thank you for your interest, you will hear back from us soon." and then have the page redirect to the home page again? I hope I'm not getting too complicated with this
You're almost right. Let me explain it to you:
the user gets a HTML page that was made in PHP, ASP,.. to fill in
some data in a form
the user fills in the data and clicks a button
The action on the button tells the server to process the page, or have another page to process it. Let's call this page PageX
PageX (written in PHP, ASP,...) will email the data to you
You can also have pageX return some text to the user's browser saying "thank you for your interest,....". You can also make a redirect to another page from this page
Does this answer your question?
The action part of the form element tells the browser what URL to post the information to. You would need to specify some page with some server-side code that would take that information and store it or send it in an email. The onsubmit part of your form element fires a JavaScript event that can be handled on the client's machine. You cannot do much on the client's machine without sending the data back to the server.