Form not being submitted with correct data - javascript

I have a form for a quiz that has 3 different inputs. Number of questions, and two types of tests. i am modifying existing code that works fine but we want the layout different which requires it to be coded differently. this is the version that isn't working. Basically I need the number of questions and category to be sent with the button clicked. For some reason it isn't sending either. Any help would be great, thanks!
<strong>Questions</strong>
<select name="num_questions">
{section name=foo start=10 loop=31}
<option value={$smarty.section.foo.index}>{$smarty.section.foo.index}</option>
{/section}
</select>
</div>
<select onchange="$('.questions_{$c.categorynum}').val(this.value);" name="category">
{foreach from=$categories item=c}
{if ($c.categorynum != 1 and $c.categorynum < 8)}
<div class="questiontitle" style="float:left;">
<option value={$c.categorynum}><strong>{$c.name}</strong></option>
</div>
{/if}
{/foreach}
</select>
<form action="test.php" method="post" style="float:left;">
<input type="submit" value="Create Exam" name="create" style="margin:0 3px;"/>
<input type="hidden" name="category" class="category" value="{$c.categorynum}"/>
<input type="hidden" class="questions_{$c.categorynum}" name="num_questions" value="10"/>
</form>
<form action="simulation.php" method="post" style="float:left;">
<input type="submit" name="flashcard" value="Flash Cards" style="margin:0 3px;"/>
<input type="hidden" name="create" value="1"/>
<input type="hidden" name="category" value="{$c.categorynum}"/>
<input type="hidden" class="questions_{$c.categorynum}" name="numquestions" value="10"/>
</form>

Related

how to send values to a sevlet from a html updated by javascript

<form method="post" action="../SubCategory">
<div id="destinationFields">
//after the page loaded i will drag and drop some divs fromsourceFields by jquery plugin
</div>
<button type="submit" id="button">Add</button>
</form>
<div id="sourceFields">
<div>
<label class="control-label" id="label" for="Name">size:</label>
<input type="hidden" value="1" name="labelValue" />
</div>
<div>
<label class="control-label" id="label" for="Name">Brand :</label>
<input type="hidden" value="2" name="labelValue" />
</div>
<div>
<label class="control-label" id="label" for="Name">width:</label>
<input type="hidden" value="3" name="labelValue" />
</div>
</div>
this is how the page is loading, there are some elements(divs) out of the form (you can see that in sourceFields)
i will drag and drop it into destinationFields but after i press submit and check in the sevlet the changes are not done
(i think it means the actual html is not changing)
Using Ajax call .
For more detail visit given url:-
http://www.programming-free.com/2012/08/ajax-with-jsp-and-servlet-using-jquery.html

Using this.form.submit() on label tags

To replicate my problem (using FireFox), please go to this page.
If you click the first image, which is a label tag, the form will submit, BUT the value won't be picked-up, so the subsequent page is incorrect.
Hit your back button & click the same image again & you get the correct response.
The same applies on the next page. Click the image label & you'll get a page error. Hit the back button & repeat - this value will be picked-up & the script will continue.
Can anyone explain why this is happening & how I can correct this?
Here's the form that isn't behaving:
<form action="lookup.asp" method="post">
<div class="boxes">
<div class="box">
<label for="first" onClick="this.form.submit()"> <img src="images/mintmarks/stgeorge-london.png" alt="No mintmark - London"> </label>
<input value="1" type="radio" name="Mintmark" id="first" onClick="this.form.submit()" checked="checked">
</div>
<div class="box">
<label for="third" onClick="this.form.submit()"> <img src="images/mintmarks/stgeorge-melbourne.png" alt="Melbourne mintmark"> </label>
<input value="3" type="radio" name="Mintmark" id="third" onClick="this.form.submit()">
</div>
</div>
<div class="boxes">
<div class="box">
<label for="second" onClick="this.form.submit()"> <img src="images/mintmarks/stgeorge-sydney.png" alt="Sydney mintmark"> </label>
<input value="2" type="radio" name="Mintmark" id="second" onClick="this.form.submit()">
</div>
</div>
<div class="boxes">
<div class="row">
<input name="CoinDate" type="hidden" value="1895" />
<input name="Bust" type="hidden" value="7" />
<input name="Design" type="hidden" value="1" />
<input type="submit" class="button" id="js-button" value="SELECT MINTMARK">
</div>
</div>
</form>
Thanks!
first change
<form action="lookup.asp" method="post">
to
<form action="lookup.asp" method="post" name="test_form" id="test_form">
Second change
onClick="this.form.submit()"
to
onClick="document.forms.test_form.submit()"
EDIT: You can also do it like this
onclick="submit_form()"
<script>
function submit_form()
{
$("#test_form").submit();
}
</script>

passing html value from a form to JavaScript function

I am trying to pass the value and text from a form to a JavaScript function using the onclick on a button but don't seem to be able to get it to work I want to keep this as generic as possible so I copy and paste the form
<form name='f1'>
<form method="post" action="https://www.paypal.com/cgi-bin/webscr">
<input type="hidden" name="item_name" value="Span>
<input type="hidden" name="amount" value="68">
<input type="hidden" name="cmd" value="_cart">
<input type="hidden" name="add" value="1">
<input type="hidden" name="business" value="test#hotmail.com">
<select name="del">
<option value="0">Delivery To</option>
<option value="41">Uk</option>
<option value="39">USA</option>
<option value="20">World Wide</option>
</select>
<input type="image" src="http://www.paypalobjects.com/en_US/i/btn/x-click-but22.gif"
onClick="shipping1(this.options.selectedindex.value,this.options.selectedindex.text)" border="0" name="submit" width="87" height="23" alt="Make payments with PayPal - it's fast, free and secure!">
</form>
</form>
i think it may be the formating of this.options
any help would be great
try this.
onClick="shipping1(this.form.del[this.form.del.selectedIndex].value,this.form.del[this.form.del.selectedIndex].text)"

checkbox onclick event loads as if checked

When I load the page both forms are displayed. If I check and then uncheck "add" the second form disappears. How do I make this page load with form 2 hidden on load?
<html>
<title>Car Service</title>
<strong>Car Service:</strong><br><br>
<input type="submit" id="accountsearch" name="accountsearch" value="Select Customer" onclick="window.open('selectaccount.php');"><br><br>
<form name="newservicesetup" id="newservicesetup" action="" method="post">
<select name="ordertype" id="ordertype">
<option>(Select Service)</option>
<option value="Service">Service</option>
<option value="ServiceHardware">Service w/ Hardware</option>
</select>
<input type="text" name="qty1" id="qty1" value="Quantity" size="5" onclick="this.value=''">
<input type="checkbox" id="add" value="0" name="add" onclick="
if (this.checked) {
document.getElementById('newservicesetup1').style.display='inline';
} else {
document.getElementById('newservicesetup1').style.display='none'; } return true;" >
</form>
<form name="newservicesetup1" id="newservicesetup1" action="" method="post">
<select name="ordertype1" id="ordertype1">
<option>(Select Service)</option>
<option value="Service">Service</option>
<option value="ServiceHardware">Service w/ Hardware</option>
</select>
<input type="text" name="qty2" id="qty2" value="Quantity" size="5" onclick="this.value=''">
</form>
<br>
XX: <input type="file" name="sfa" id="sfa">
AA1: <input type="file" name="pbxws" id="pbxws"><br> <br>
<input type="submit" name="next" id="next" value="Next">
set the second forms css class to hidden or something like that and then define .hidden in your css to be display:none. Or put style='display:none' t ostart with on the second form
Change your second form tag to read this....
<form name="newservicesetup1" id="newservicesetup1" action="" method="post" style="display:none;">

Forced selection in hidden / Backend using Javascript OR JQuery

I have regular form like this.
<form action="/domainchecker.php" method="post">
<input type="text" name="domain" size="20">
<fieldset>
<select name="ext">
<option>.com</option>
<option>.net</option>
<option>.org</option>
<option>.us</option>
<option>.info</option>
<option>.biz</option>
<option>.mobi</option>
<option>.name</option>
<option>.tv</option>
<option>.me</option>
</select>
</fieldset>
<input type="submit" value="Go">
</form>
This selectbox enables to select only one option.
What I want is Forced selection in hidden / backend for the first 5 options regardless user select it or not.
How can I achieve this using JavaScript OR JQuery ?
Thanks.
Since you are using PHP you can try this:
<form action="/domainchecker.php" method="post">
<input type="hidden" name="ext[]" value=".com">
<input type="hidden" name="ext[]" value=".net">
<input type="hidden" name="ext[]" value=".org">
<input type="hidden" name="ext[]" value=".us">
<input type="hidden" name="ext[]" value=".info">
<input type="text" name="domain" size="20">
<fieldset>
<select name="ext[]">
<option>.com</option>
<option>.net</option>
<option>.org</option>
<option>.us</option>
<option>.info</option>
<option>.biz</option>
<option>.mobi</option>
<option>.name</option>
<option>.tv</option>
<option>.me</option>
</select>
</fieldset>
<input type="submit" value="Go">
</form>
Note the brackets in the fields' names. In your PHP script you'll need something like:
$extensions = $_POST['ext'];
foreach ($extensions as $ext) {
#do something
}
Note that the $extensions array will contain duplicates if the user selected one of the first 5 entries in the dropdown.
You can also use checkboxes instead of a dropdown like this:
<form action="/domainchecker.php" method="post">
<input type="text" name="domain" size="20">
<fieldset>
<input type="checkbox" name="ext[]" value=".com" selected="true">
<input type="checkbox" name="ext[]" value=".net" selected="true">
<input type="checkbox" name="ext[]" value=".org" selected="true">
<input type="checkbox" name="ext[]" value=".us" selected="true">
<input type="checkbox" name="ext[]" value=".info" selected="true">
<input type="checkbox" name="ext[]" value=".biz">
<input type="checkbox" name="ext[]" value=".mobi">
<input type="checkbox" name="ext[]" value=".name">
<input type="checkbox" name="ext[]" value=".tv">
<input type="checkbox" name="ext[]" value=".me">
</select>
</fieldset>
<input type="submit" value="Go">
</form>
The PHP is the same, without the duplicate issue
Add them server-side.
you can't do multiple selection on your select if attribute multiple is not set
like this, then have default selection by setting the option's attribute selected="selected"
<fieldset>
<select name="ext" size="5" multiple="multiple" >
<option>.com</option>
<option>.net</option>
<option selected="selected">.org</option>
<option selected="selected">.us</option>
<option selected="selected">.info</option>
<option>.biz</option>
<option selected="selected">.mobi</option>
<option>.name</option>
<option>.tv</option>
<option>.me</option>
</select>
</fieldset>

Categories