To submit a form by pressing Enter key the standard solution is:
<input v-model="name" v-on:keyup.enter="submit" />
But what if a form has many input fields? Is it necessary to add v-on:keyup.enter="submit" to every single one of them, or is there a simpler solution?
In this case, you should wrap the inputs in a form as follows:
<form v-on:submit="submit">
</form>
Related
I'm using Statamic CMS
I've got a checkbox group with two checkboxes, I'd like both of them to be checked before the form will submit.
Setting the field as 'required' half works. The form will error if nothing is checked, but it submits if one of the boxes is ticked.
I can see under the validation tab, there's a list of additional rules. But I'm not sure which rule to use.
If it helps, this is what the HTML checkbox group looks like:
<div>
<label>Contact permissions</label>
<span>Please tick both checkboxes</span>
<label>
<input type="checkbox" name="checkboxes[]" value="gdpr" />
Please contact me with the details I've provided
</label>
<label>
<input type="checkbox" name="checkboxes[]" value="terms" />
I agree with the terms and conditions
</label>
</div>
I'm using the {{ fields }} tag to generate the HTML
Within the CMS, under the validation tab, there's a link to the Laravel docs. As I want to validate two checkboxes, I think I need the required_with: rule, but I can't get it to work...
required_with: is looking for two values, the example shows this:
required_with:foo,bar,..
The values of the checkboxes are, value="gdpr" and value="terms" so I (wrongly) assume this should work...
required_with:gdpr,terms
After saving the changes and testing the form, it still submits? Even though only one of the checkboxes might be ticked...
What is the correct syntax/values to use to get this to work?
:) foo,bar in the docs are field names in your form. What you're doing with gdpr,terms are values.
Plus, since both your buttons are named checkboxes[], the form is validating that if either one is selected, then it should be passed. Hopefully this helps!
I want to reset all the form fields on successful AMP form submission as I am allowing user for multiple data entry.
Manually I can do it by managing states of each field through amp-bind but I want to reset fields in one go. Is there any function like form.reset present which I can call on form submit success event?
You can use the clear action to reset all fields in a form:
<form id=myForm>
<input>
</form>
<button on="tap:myForm.clear">Clear inputs</button>
You can use submit-success.
<form id=myForm on=submit-success: myForm.clear>
<input name=name value= />
<button>Submit form</button>
</form>
I have a link on one page which looks like this:
http://www.domain.com/sample-link#product_id
and on the other page (sample-link), I have this input field:
<input type="text" name="name" value="name" />
So, when I click the link from the first page, I want to open the "sample-link" page, and autofill the name field with the "product_id" text. Any ideas how can I make this?
Thanks in advance.
You'll just have to add a tiny Javascript snippet:
if (document.location.hash)
document.getElementById('testbox').value = decodeURIComponent(document.location.hash.substr(1));
For obvious reasons you'll have to adjust the id of the text box.
It gets a bit more complicated in case you'd like to pass more than one value.
The call to decodeURIComponent() is optional, but required in case you're passing characters like spaces or non-alphanumerical stuff (just to be sure).
I have a form and using a normal submit button with no name like this below.
<input type="submit" value="Submit" />
Everything works fine like it is. My question is there a way I can give it a name say random numbers like this below.
<input type="submit" name="R312321321" value="Submit" />
Then when I submit can I get the value of the name of the submit button like if it was a hidden input. I can't use a hidden input for what I'm doing. The reason I want to do the submit button this way is browser macros look for the name. If the name is always changing its harder for their macro to work. Once I get the value of the submit button I can authenticate it which I have something already created just need to get the value of the submit in php.
Thank you
Yes, this would work. However, the spec says otherwise about input names beginning with numbers.
ID and NAME tokens must begin with a letter ([A-Za-z]) and may be
followed by any number of letters, digits ([0-9]), hyphens ("-"),
underscores ("_"), colons (":"), and periods (".").
After you submit the form you will have a key value pair
[312321321] => Submit
I'd like my form to include a certain value if the quantity is equal to 1 (via a text box).
I've managed to show what the total cost is using JavaScript and I could submit it with this value but I'm worried that when JavaScript is turned off the user will be able to submit the form without the extra fee being added. Therefor escaping the fee.
<form>
<label>Qunatity</label>
<input type="text" name="qyt" />
<input type="text" name="fee" value="250" />
<div class="total">[whatever the total is]</div>
<input type="submit" value="submit" />
</form>
Is there a way I can submit this form so that it submits 250 only if a quantity of 1 is added to the form? I'd like to avoid using a select input.
Will I need to split my form out into two stages to achieve this?
You need to check your logic in server-side code.
Most people have Javascript enabled, so you should do it in Javascript to provide a better experience, but you must always reproduce the logic on the server.
If you need to validate your input without JavaScript, have a server-side component (PHP?) to do the job and return the same form with an error message if no quantity was given. That way you don't have to split your form into two steps.
The best/safest way to handle this would be to do your total calculation on the server side. That way the data you store will always be correct.