If I have three text input and I want to combine the values in these three text input into one POST name, how can I do that?
UPDATE:
a good example would be if I have a phone number field, and I have three fields for the phone number... I wanted this to be posted as one so back in the server side I can just access it as $POST['phone']
Would be nice if something like jQuery can help me out here.
Have them as an array:
<input type="text" name="inputs[]" />
<input type="text" name="inputs[]" />
<input type="text" name="inputs[]" />
Then you can access them in the POST array.
You have not indicated the programming language, but in PHP it would be, $_POST['inputs'][0], $_POST['inputs'][1], $_POST['inputs'][2]...
Since you want to have only one phone input which contains the full phone number appear on server side, not parts of it, and you are using jQuery in your project, this will make things easy for you:
1. Sample Markup
<form id="my_form" method="post">
<input type="text" name="phones[]" />
<input type="text" name="phones[]" />
<input type="text" name="phones[]" />
<input type="hidden" name="phone" />
<input type="submit" name="send" value="Send It" />
</form>
2. jQuery
$(document).ready(function(){
var $phones = $('#my_form input[name="phones[]"]'),
$phone = $('#my_form input[name="phone"]');
$('#my_form').submit(function(){
// join all the phone parts together
var phone_number = '';
$phones.each(function(){
phone_number += this.value;
});
// change the hidden input element's value
$phone.val(phone_number);
// remove the phone parts input elements
$phones.remove();
});
});
I wonder why you would need to do that.
In php, you can do as Shef said.
In simple single word cases, you can concatenate them with some separator (e.g. # or $) and process the same on the server side.
Related
So I have an input form in Angular here:
<input ng-model="sc.zip" class="form-control" maxlength="5" type="text" />
I don't want type="numbers" because the form needs to be a plain empty textbox. However, I only want the user to be able to type numbers. Either I need to detect when the input is not a digit, or be able to search through the box to find non-digits when submitting.
Either way, I need to validate that the form is digits only. Any help would be appreciated!
use regex
<input name="title" type="text" ng-model="sc.zip" ng-pattern="/^[0-9]*$/" required/>
I am trying to use Pattern attribute to do validation on text box.
When ever user entered any of these .....i want to show some validation message.
So i created that element as follows:
<input type="text" pattern="/(<!|&#|<\?|<|>)/" title="Required" required />
When ever i entered any text it is showing the alert...
How to get rid of this?
You were using the wrong pattern. In HTML patterns, you don't need an opening and closing delimiter. Also, the browser checks, if the entered text MATCHES the pattern, but you would need the exact opposite (if I understood it correctly). Try something like this:
<form>
<input type="text" pattern="^((?!(<)|(<!)|(<\?)|(&#)|(>)).)*$" title="Required" required />
<input type="submit" />
</form>
I've got a simple form in html:
<form action="" method="post">
<input id="title" name="title" size="30" type="text" value="">
<input type="submit" value="Save this stuff">
</form>
I also have a file upload on the page, which handles uploads using ajax and adds the files to a mongoDB. The file upload returns the mongoDB id of the file (for example 12345) and I want to add that id to the form as a hidden field so that the id is POSTed to the server upon submitting the form. Since the user can add multiple files though, I want to add a list of id's to the form.
I found how I can add one hidden field to a form from javascript, but this always handles a single field, not a field with multiple values. So I thought of adding a checkbox field to the form so that I can submit multiple values in one element, but it kinda feels like a hack.
Can anybody hint me in the right direction on how I can add a hidden list of values to a form using Javascript? All tips are welcome!
[EDIT]
In the end I would like the form to look something like this:
<form action="" method="post">
<input type="hidden" name="ids" value="[123, 534, 634, 938, 283, 293]">
<input id="title" name="title" size="30" type="text" value="">
<input type="submit" value="Save this stuff">
</form>
I am not sure if I understand your question correctly, so I may just be guessing here.
Try adding multiple hidden inputs with a name such as ids[] so that they will be posted to the server as an array.
Example:
<form action="" method="post">
<input type="hidden" name="ids[]" value="123">
<input type="hidden" name="ids[]" value="534">
<input type="hidden" name="ids[]" value="634">
<input type="hidden" name="ids[]" value="938">
<input type="hidden" name="ids[]" value="283">
<input type="hidden" name="ids[]" value="293">
<input type="submit" value="Save this stuff">
</form>
Why not simply concatenating all the ids into a string like so "123,456,890,..etc" and then adding them as a value to ids inupt. When you need them, simply split by ',' which would give you an array with ids?
Todo so only with javascript something like this should work
var elem = document.getElementById("ids");
elem.value = elem.value + "," + newId;
Do you mean that for each time the user clicks the 'upload' button you need to add a hidden field to the form?
Can you post the entire form, that should clear things up...
[Edit]
you could store the id's in an Array, everytime an id should be added to the hidden field's value you could do somthing like:
$('#ids').attr('value', idArray.join());
I'm just typing this out of the box so excuse any little errors
I'm sure there's a simple answer to this, but I'm a novice teaching myself Javascript and JQuery and I just don't know enough to figure it out myself. Any help you can provide is greatly appreciated.
I'm building a form that generates HTML emails for my company based on hundreds of different inputs entered by the form user. Rather than copying and pasting each and every input name into a $_POST line in the form's action script to retrieve the input's data, I'm wondering if there's a way to use Javascript/JQuery to generate a list of the name="" fields from each input on the form to make this easier?
For example, from the following slice of the code, how can I automatically generate a list that contains the name values "bottlespecial6image", "bottlespecial6imagewidth", "bottlespecial6imageheight", "bottlespecial6imagelink", and "bottlespecial6includeprice" (with the idea that my form has hundreds (if not thousands) of inputs, so copying/pasting seems inefficient):
<input type="text" name="bottlespecial6image" value=""/>
<input type="text" name="bottlespecial6imagewidth" value=""/>
<input type="text" name="bottlespecial6imageheight" value=""/>
<input type="text" name="bottlespecial6imagelink" value=""/>
<input type="radio" name="bottlespecial6includeprice" value="yes" checked="checked" />
<input type="radio" name="bottlespecial6includeprice" value="no" checked="checked" />
I apologize if this has already been covered here -- I searched around here for similar questions, but couldn't find anything.
To create a serialized array to submit, you'd use jQuery's serialize()
$('form').serialize();
to just get the names in an array, you can map them:
var inputs = $('form').find('input[name]'); //all inputs with a name in the form
var names = $.map(inputs, function(el) { return el.name });
FIDDLE
$("[name='yourrequiredname']")
will give you list of all elements by same name
I have a dynamic form that adds users to the site, made so you can duplicate the fields to add several users on one go.
So, my looks like
<input name="user[1][name]" value="" />
<input name="user[1][username]" value="" />
<input name="user[1][password]" value="" />
And then the number is changed on the duplicated fields, eg:
<input name="user[2][name]" value="" />
<input name="user[2][username]" value="" />
<input name="user[2][password]" value="" />
and so on.
On PHP I can handle each user since it has it's own array.
But I would like to validate, for example, the username on each user via jQuery.
The closest I got to is
$(this).find('input[name="user[][username]"]').each(function() {
But for it to work I need to explicitly write the number on the first [], eg:
$(this).find('input[name="user[1][username]"]').each(function() {
Is there a way to select ALL of them? I tried putting * and * between the [] but it didn't work.
Thanks for your help!
You can use the ends with selector
You could use a for loop and not have to write the numbers yourself really easily:
var number_of_forms = 3
for(var i=1;i<=number_of_forms;i++){
$(this).find('input[name="user[' + i + '][username]"]').each(function() {
}