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.
Related
I'm doing a form where when you select an option (with the and tag), a text below the form change according to the choice.
I would like to have this text along with my form data when send to a POST request.
I'm using Express and EJS.
Btw I also have GET parameters and would like the same thing as the text, any thoughts ?
Can you help me please ?
Thanks !
Whatever code you have that changes the text according to your choice, can also set a hidden form value in your form to the same value. That hidden form value will not display to the end user in the browser, but will be sent with the form as part of the POST (as another value of the form).
Here's an example of a hidden form element from that previous linked reference:
<input type="hidden" id="custId" name="custId" value="3487">
If this is inside your <form>, you can then change it with your Javascript to whatever you want it to and it will be automatically sent to your server as one of your form values when the form is POSTed to your server, but won't be shown to the user because of the type="hidden".
My question references the following question/answer provided in this stackoverflow post: Form Variables are not showing up after form submit. ColdFusion
I wanted to comment in the above referenced post, but I don't have enough reputation points. I see the answer by Samuel Dealey above indicating that using a cflocation or location.replace() could result in Form variables not showing up. That is exactly what is happening in my scenario.
I have a simple registration form submission. Upon form submission the form data is sent to a page named addCampaign.cfm. addCampaign.cfm contains code that will write the registration data to the database. After writing the registration info to database, I verify that info was written to database. At that point I then redirect the user to a specific page if registration was successful, and if not successful then redirect back to the registration form page with an appropriate error message.
I have tried using both for the redirect, and have attempted using javascript location.replace(), both result in the same problem.
The issue I am running into is that:
1) The redirect never occurs
2) I am using to display the struct, but it lists it as empty
3) I have removed the cflocation and location.replace() and can verify that my form elements do exist in the form struct.
4) The form data is being written to the database, which is very strange, considering that the form struct is being displayed as empty.
I don't understand why the form struct is empty when the data is being written to the database, and furthermore I don't know why the redirect does not work. Can anybody provide some clarification on why this would be happening?
Consider this code on a single file
<cfif cgi.request_method EQ "post">
<cfdump var="#form#">
<!--- More importantly, DB inserts --->
</cfif>
<form method="post" action="?">
<!--- Lots of other fields go here too --->
<input type="submit" name="btnSubmit" id="btnSubmit" value="OK" />
</form>
If you do it this way, you don't have to worry about pushing data over redirect of some sort. You are already on the page you want. action="?" basically means submit to the same field as I am already on. Note that the file's behavior is different on a GET vs POST.
I'm trying to scrape prices from this site:
https://www.pensketruckrental.com/quote/start.html
I can easily enter the form data, and I can activate the "Get A Quote" button and click it.
What I can't seem to do is get the form data to submit using a web scraper (I'm just doing it in VBA). When I input text using the scraper, the button remains grayed out, and even making a .click call on the button just displays errors on the form telling you not to leave the fields blank. Apparently it only recognizes data when you use an input device?
The code for one of the required fields, pickupLocation, is the following when I enter it manually (and thus the button works and the form can be submitted):
<input
type="text"
id="pickUpLocation"
name="pickUpLocation"
class="penskeValidateField penskeGoogleTypeAhead penskeInlineError ng-isolate-scope ng-touched ng-focused ng-dirty ng-valid-penske-err_loc_empty_sa ng-valid ng-valid-parse ng-valid-required"
aria-invalid="false"
aria-required="false"
country="rentalEntryCtrl.formItems.country"
penske-validate-field="pickuplocation"
required=""
autocompelete="off"
data-penske-placeholder="rentalEntryCtrl.activePlaceHolders.pickUpLocation"
ng-model="rentalEntryCtrl.formItems.pickupLocationSearchCriteria.address"
autocomplete="off">
And when I enter the data automatically using my scraper the tag & attributes read as follows:
<input
type="text"
id="pickUpLocation"
name="pickUpLocation"
class="penskeValidateField penskeGoogleTypeAhead penskeInlineError ng-pristine ng-isolate-scope ng-invalid ng-invalid-required placeholder ng-touched"
aria-invalid="true"
aria-required="true"
country="rentalEntryCtrl.formItems.country"
penske-validate-field="pickuplocation"
required=""
autocomplete="off"
data-penske-placeholder="rentalEntryCtrl.activePlaceHolders.pickUpLocation"
ng-model="rentalEntryCtrl.formItems.pickupLocationSearchCriteria.address"
autocompelete="off">
So of course I tried to copy the fields in the first code block into the second code block using setAttribute(), but even though I could change the attributes, I still couldn't get the form to submit properly.
I've looked at others that have dealt with something somewhat similar with autocorrect; their solutions have involved looking at the header and responses and just using the straight XHR to loop through the autocomplete queries, but the pricing information I'm scraping comes after several pages of form submissions, so that's not an option here.
I'm stuck I think; any ideas on how to populate the form and click the button/submit via my scraper?
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.
I need to have a form submitted using the enter key, however, I have to use a BUTTON instead of SUBMIT as the type in order for the page to not refresh. How can I get my BUTTON to act as a SUBMIT and be executed whenever someone pushes their enter key?
<form>
<input type=text ...>
<input type=button ...>
</form>
A lot of the information I found about this mentions Netscape/IE/lots of outdated material.
This is my HTML output, I'm looking to hide the submit button and use ENTER:
http://i.stack.imgur.com/Ohepe.png
with Javascript enabled
<input type="button" onclick="this.form.submit()" ... />
should work
I have to use a BUTTON instead of SUBMIT as the type in order for the page to not refresh
Nah. Use a normal submit button that refreshes the page. (And ideally, for accessibility, make it work!) Then add progressive enhancement to replace the submission action of the form with something smoother when JS is available. Use return false (or event.preventDefault() in the DOM 2 Events model) to stop the form submitting in this case.
<form id="foo" method="POST" action="dosomething.script">
...
<input type="submit" value="Do something"/>
</form>
document.getElement('foo').onsubmit= function() {
beginAJAXSubmission();
return false;
};
Catching the submit event of a form is generally better than trying to pick up click on buttons, because it will always fire when the form would normally be submitted, including on Enter keypresses. click on the first submit button in a form will usually be fired on an Enter keypress, but there are cases (depending on number of controls in the form and what browser it is) where it doesn't happen and so you can end up falling through to actually submitting the form.
as other said, you have to use Javascript. I recommend JQuery framework.
But i don't understand the refresh thing?
Normal way is you hit submit and your form will be sent over a request to the server.
Server process the data and return a response (HTML/JSon..etc) this response will normally be redirect to a result page (to avoid the famous warning about re-post on refresh).
Now if your form is only a little piece of a bigger page, you might want to use ajax to post the little form and then take the result and update your DOM.
All this said, nothing prevent you to use submit type for the button, it is actually the best way to make your enter key defaut to this action. All you have to do is to use Jquery and intercept the submit of your form and make an ajax call instead of going the normal way.
you will find plenty of example to use JQuery since its probably the most used javascript framework.
Hope it help