jQuery Field Change Submit not working - php

I have the below form that i want to remove the submit button from (or hide it).
<form action="cart.php" method="post">
<input name="quantity" type="text" value="3" size="1" maxlength="2" />
<input name="adjustBtn" type="submit" value="change" />
<input name="item_to_adjust" type="hidden" value="1" />
</form>
In a jQuery file called test.js that i have included in the page i have the bellow that should submit the form when the input field "quantity" has changed, but it does not, i cannot get it to work and i have tried all sorts of form submit functions from other posts on SO. One person even said that if the submit button had a name of submit it would not work but i do not have that.
$(document).ready( function() {
$('#quantity').change(function(){
//$(this).closest("form").submit(); <-- commented out as not working either.
//$(this).closest('form')[0].submit(); <-- commented out as not working either.
$('#adjustBtn').submit();
});
} );
Anyone have any idea why it wont submit the form? I have tested in chrome and IE.

You need to submit the form instead of the button:
$("#adjustBtn").closest("form").submit();
Also, you didn't give an id to your adjustBtn, thus $("#adjustBtn") won't work;
<input id="adjustBtn" name="adjustBtn" type="submit" value="change" />
The same thing happens with #quantity, that's why the change handler doesn't get fired, you need to also add the id:
<input id="quantity" name="quantity" type="text" value="3" size="1" maxlength="2" />

It should be:
<form action="cart.php" method="post" id="autoSubmit">
<input name="quantity" type="text" value="3" size="1" maxlength="2" />
<input name="item_to_adjust" type="hidden" value="1" />
</form>
And the jQuery:
$(document).ready( function() {
$('#quantity').change(function(){
$('#autoSubmit').submit();
});
} );

Related

Submit form through GET and preserve already existing GET parameters

Let's say I have a form that I send via GET:
<form method="get" action="/search.php?foo=bar&test=1&something=else">
<input type="text" name="day" placeholder="day"/>
<input type="text" name="link" placeholder="link"/>
</form>
And after submitting my form and processing the data (which consists of only saving it to a file), the url is changed to:
search.php?day=test&link=google.com
What should I do so the url becomes:
/search.php?foo=bar&test=1&something=else&day=test&link=google.com
(preserving the old parameters that were included in action attribute.)
The form action will change every time and it's difficult to keep the old GET parameters in the form action.
However, you can go with hidden fields.
Try this:
<form method="get" action="/search.php">
<input type="hidden" name="foo" value="bar"/> <!-- Add this -->
<input type="hidden" name="test" value="1"/> <!-- Add this -->
<input type="text" name="day" placeholder="day"/>
<input type="text" name="link" placeholder="link"/>
</form>
You could try changing the action before submitting, depending how you're going to submit the form. This can be done if you apply IDs to your texts and either a name or an ID to the form.
HTML:
<form id="frm" method="get" action="/search.php?foo=bar&test=1&something=else">
<input type="text" name="day" id="day" placeholder="day"/>
<input type="text" name="link" id="link" placeholder="link"/>
</form>
Then with JavaScript you can run a function and change the form's action:
var _form = document.getElementById('frm');
var day = document.getElementById('day').value;
var link = document.getElementById('link').value;
_form.action += '&day=' + day + '&link=' + link;
_form.submit();
You could try to use a hidden input field.
<input type="hidden" name="name" value="value">
if you are getting your variables first from get and then want to add into 2nd form you could get this and create input fields hidden with these get values
Now when you submit form in get url you will get all you desire data
<?php
if($_GET){
if(isset($_GET['submit1'])){
$foo = $_GET['foo'];
$test = $_GET['test'];
$something = $_GET['something'];
?>
<form method="get" action="/search.php">
<input type="hidden" name="foo" placeholder="foo" value="<?php echo $foo; ?>"/>
<input type="hidden" name="test" placeholder="test" value="<?php echo $test; ?>"/>
<input type="hidden" name="something" placeholder="something" value="<?php echo $something; ?>"/>
<input type="text" name="day" placeholder="day"/>
<input type="text" name="link" placeholder="link"/>
</form>
<?php
}
}
?>

More than one html form in a php file

I have a php and html based tool that has a form that, when submitted, outputs the data reformatted using echo commands.
I'd like to add a 2nd form to the same page that will also output using echo.
My issue is, when I submit the 2nd form the first forms output disappears. I'd like to make it so the echo output from the first form does not go away when the 2nd form is submitted so they will both be on the screen at the same time.
Is there a way I can do this?
Only one <form> block in a page can be submitted at a single time. <input> fields defined in one form will not be submitted when the other form is submitted.
e.g.
<form>
<input type="text" name="foo" />
<input type="submit" />
</form>
<form>
<input type="text" name="bar" />
<input type="submit" />
</form>
Clicking on submit will submit either a foo field, OR a bar field. Not both. If you want both fields to be submitted, then you have to either build them into a SINGLE form:
<form>
<input type="text" name="foo" />
<input type="text" name="bar" />
<input type="submit" />
</form>
or use Javascript to copy the data from one form to another.
<form method="post"> <div>Module1</div> <input type="text"
value="module1" name="module_id"> <input type="text" value="title 1"
name="title"> <input type="text" value="some text 1" name="text">
<input type="submit" name="form_1" value="submit"> </form>
<form method="post"> <div >Module2</div> <input type="text"
value="module2" name="module_id"> <input type="text" value="title 2"
name="title"> <input type="text" value="some text 2" name="text">
<input type="submit" name="form_2" value="submit"> </form>
<?php
if(isset($_POST['form_1'])){
echo '<pre>';
print_r($_POST); }
if(isset($_POST['form_2'])){
echo '<pre>';
print_r($_POST); } ?>
Yes,you can do it.
Eg :
// form1 on page a.php
<form method="post" action="a.php" name="form_one" >
<input type="text" name="form_1" value="if(isset($_POST['form_1'])) echo $_POST['form_1']; ?>" >
<input type="submit" name="submit_1" >
</form>
<?php
if(isset($_POST['submit']))
{
?>
<form method="post" action="a.php" name="form_two" >
<input type="text" name="form_2" value="if(isset($_POST['form_2'])) echo $_POST['form_2']; ?>" >
<input type="submit" name="submit_2" >
</form>
<?php
}
?>
Now when you will submit form_one you will see form_two appear and the value in form one will stay intact in form_one and one the submitting form two the value will remain.
Hope it helped :)

Submit button, next step

I am done with the search page where the user enters the information and select from the drop-list. I've also added the button AddList where you can have more than one search form with tag names changed. All of the searches will eventually be executed in one Submit button and each search will go in one single query. My table caries all the information and tuples contain only numbers.
UPDATED: I tried changing the input type of the input tags but the enable and disable functions can't seem to work on integers, only on text fields. How can I fix that?
My submission is tomorrow, and here is my search code:
<script type="text/javascript">
$('#exactButton').live('click', function(){
$(this).prev().prev().prev().prev().prev().removeAttr('disabled');
$(this).prev().prev().prev().attr('disabled',true);
$(this).prev().prev().prev().prev().attr('disabled',true);
});
$('#rangeButton').live('click',function(){
$(this).prev().prev().removeAttr('disabled');
$(this).prev().prev().prev().removeAttr('disabled');
$(this).prev().prev().prev().prev().attr('disabled',true);
});
})
</script>
And this is my HTML code:
<button id="button">Add List</button><br><br>
<form id ="form" name="search" method="get" action="test.php">
<div id="div">
<select name ="select" >
...options...
</select>
Value:<input type="text" name="exact" id="exactField" />
From: <input type="text" name="from" id="fromField" />
To: <input type="text" name="to" id="toField" />
<br>
<input type="button" name="answer" value="Range" id="rangeButton" />
<input type="button" name="answer" value="Exact" id="exactButton" />
</div>
<br>
<input type="submit"name="search" value="Submit">
</form>
Thank you in advance..
as Dagon said, you will see all submitted parameters in the URL since you are submitting the form with method GET. here is very good explanation for this: http://www.w3schools.com/php/php_get.asp
One idea:
add some custom attributtes to the elements (to the clones too).
this.attr("mycustomattribute","somevalue");
after this, you can get all elements on the page with your custom attribute and your value.
divs = $('div[mycustomattribute="somevalue"]'); //should give all div container with attribute "mycustomattribute" with value "somevalue"
divs.each(function(){
console.log(this,$(this).attr('name'));//show expression (for debug)
});
then you can collect this elements, serialize it and add it to your post Not tested, but an idea.
Kind Regards
In PHP, it's already there.
print_r($_GET); will list all parameters sent by GET method
print_r($_POST); will list all parameters send by POST method.
Then, of course, you will need to iterate in the array to include each values in your query statement.
You can naming input with prefix or suffix correspond to sequence that user click to add list and add those set of inputs to only form.
<form id ="form" name="search" method="get" action="test.php">
<div>
<select name ="select[1]" >
...options...
</select>
Value:<input type="text" name="exact[1]" class="exactField" />
From: <input type="text" name="from[1]" class="fromField" />
To: <input type="text" name="to[1]" class="toField" />
<br>
<input type="button" name="answer[1]" value="Range" class="rangeButton" />
<input type="button" name="answer[1]" value="Exact" class="exactButton" />
</div>
<div>
<select name ="select[2]" >
...options...
</select>
Value:<input type="text" name="exact[2]" class="exactField" />
From: <input type="text" name="from[2]" class="fromField" />
To: <input type="text" name="to[2]" class="toField" />
<br>
<input type="button" name="answer[2]" value="Range" class="rangeButton" />
<input type="button" name="answer[2]" value="Exact" class="exactButton" />
</div>
.
.
.
<br>
<input type="submit"name="search" value="Submit">
</form>

Input field cloned through jQuery won't submit

I have a set of hidden input fields, which are cloned when the page is loaded and/or a button is clicked.
Html:
<div class="book_form" id="book_form_hidden">
<input type="checkbox" name="select" class="sell_checkbox" />
<h1>ISBN:</h1>
<input type="text" name="isbn" class="input_large" maxlength="20" />
<h1>Condition:</h1>
<input type="text" name="condition" class="input_medium" maxlength="100" />
<h1>Price:</h1>
<input type="text" name="price" class="input_price" maxlength="3" />
<input type="hidden" name="title" value="">
<input type="hidden" name="author" value="">
<input type="hidden" name="publisher" value="">
<input type="hidden" name="thumbnail" value="">
</div>
jQuery:
function addOne() {
var clone = $("#book_form_hidden").clone().removeAttr("id");
clone.find("input").each(function() {
$(this).attr("name", $(this).attr("name") + "[" + n + "]");
});
n++;
clone.appendTo($("#form_container"));
}
When I submit the form and send the data to PHP using a regular submit button, none of the inputs that were created through jQuery are submitted but only the input fields that were initially hidden (and have empty values).
Do I need use AJAX to submit form content that was created dynamically? I am confused.
Thanks so much for your help.

how to pass values from one page to another on jquery form submit

I'm trying to build a form using php & jquery, but I'm a little confused as to what to do with the jquery portion of it...
Basically, when the user submits the first form, I want to direct them to the "next step" form, but I want to retain the values submitted from the first one in a hidden input field...
If someone can either show me how or point me to a good tutorial, I'd appreciate it...
I don't have any of the php or jquery yet, and this is just a simplified version of the html markup...
//first.php
<form name="form1" method="post" action="second.php">
<input type="text" name="name" value="" />Name
<input type="submit" name="step1" value="Next" />
</form>
//second.php
<form name="form2" method="post" action="process.php">
<input type="hidden" name="name" value="{$_POST['name']}" />
<input type="text" name="message" value="" />message
<input type="submit" name="step2" value="Finish" />
</form>
<input type="hidden" name="name" value="{$_POST['name']}" />
should be,
<input type="hidden" name="name" value="<?php echo $_POST['name']}; ?>" />
and also sanitize the input, if you want
I don't no if there is a better way to do that.
But, when I need to do such thing, I do in this way:
<script>
<?php
foreach($_POST as $key => $valule)
{
echo "$('$key').val('$value')";
}
?>
</script>
So, in your nextstep file, all you'll need to do is set up the hidden fields and then just loop through the post vars and set each one via jquery.

Categories