I have two forms both using select so my values are within dropdown. I want to be able to submit the two forms without the use of submit buttons.
The first form submits using the onchange="this.form.submit()"
method. However, the second form doesn't submit when an option selected.
How do I make each form submit using onchange="this.form.submit()"?
//This form submits using onchange="this.form.submit()"
<select class="clientselect" name="clientlist" id="clientlist" onchange="this.form.submit()">
<option value="">All Clients</option>
<? echo makeClientList($conn); ?>
</select>
//This for does'nt sybmit using onchange="this.form.submit()"
<select class="clientselect" name="filterstatus" id="filterstatus" onchange="this.form.submit()">
<option value="">Filter by Status</option>
<? echo getStatus($conn); ?>
</select>
If you give each form a name attribute then you can reference that in your onchange, for example:
onchange="document.form1.submit()"
You'll need to change form1 for the name of each form
Related
I have a simple form made in PHP, I am trying to pass the select value in the page mentioned in the action URL,
<form action="filtertable.php" method="post">
<select class="form-select" name="filtercategory" aria-label="Default select example"
onchange="this.form.submit()">
<option selected>Select Category</option>
<option value="<?php echo $roww["c_id"]; ?>"><?php echo $roww["cname"]; ?></option>
</select>
</form>
when the user selects on any select box it will go to the page filtertable.php, and from there am trying to get the selected value like this:
<?php
$filtercategory=$_POST['filtercategory'];
However it doesn't work, can anyone please tell me what is wrong in here, thanks in advance
is there any mistake in write in this.form.submit();?
This is my select box i want to submit form on change but from is not submited on change. I don't know whats is wrong in that.
<select name="workerId" onchange="this.form.submit();">
<option value="">Select Worker Name</option>
{html_options values=$workerArray.workerId output=$workerArray.workerName}
</select>
hey guys i am building a form in which i want when a user select an option from the dropdown menus a text to be displayed and calculate the price.
The dropdown menu is:
<select id="recipient" name="recipient" tabindex="6" class="selmenu">
<option value="staff">Site Staff</option>
<option value="editor">Editor-in-Chief</option>
<option value="technical">Tech Department</option>
<option value="pr">Public Relations</option>
<option value="support">General Support</option>
</select>
and the other dropdown menu is:
<select id="recipient" name="recipient" tabindex="6" class="selmenu">
<option value="one">1</option>
<option value="two">2</option>
<option value="three">3</option>
<option value="four">4</option>
<option value="five">5</option>
</select>
What i want to do is when the user selects something from the first and the second menu i want a textfield to change dynamically... can anyone point me the way?
only ajax/jquery could do that in combination of php step might be...
onchange of any dropdown make a ajax request to php script.
return the json response from php script
use this response to either manipulate your form or display data on page.
you don't need to use php for this, it can all be done with jquery/javscript
an example using jquery is below (i had to rename your second select as you had re-used an ID):
$('.selmenu').change(function() {
$('#output').text($('#recipient option:selected').text() + ' ' + $('#recipient2 option:selected').text());
})
output is the id of your textbox.
on a select value being changed, output will be filled with the selected value in both select controls
I have 2 php html forms, both consisting of 1 select list. In the first form, I have a select list that asks the user to select their State. According to the state selection on the first page, when the user clicks submit, the second selection list should show the postcodes for that state.
I am having difficulty in performing this task as they 2 select lists are on 2 different pages, i know how to use javascript if they are on the same but i am a bit stumped as they are on different pages. Im not sure how to link them together.
State* <select id="state" name="state"">
<option value="">Select</option>
<option value="OKC">OKC</option>
<option value="NYC">NYC</option>
<option value="CAL">CAL</option>
</select><br />
So if the user selects OKC from first list on the first page, the second list on the second page should show only postcodes for OKC
If you absolutely need to have 2 different PHP pages for your select elements, you could use an HTTP parameter. For example you could have the first form have a submit button which takes you to the second PHP page:
firstpage.php:
<form action="secondpage.php" method="get">
<select id="state" name="state">
<option value="">Select</option>
<option value="OKC">OKC</option>
<option value="NYC">NYC</option>
<option value="CAL">CAL</option>
</select>
<input type="submit" value="Next page" />
</form>
The submit button would take your browser to the secondpage.php but according to your state selection, it would attach a parameter, for example secondpage.php?state=OKC.
On secondpage.php you could use the parameter to your advantage:
$state = $_GET['state'];
Use PHP statements to dynamically generate your <select> element:
<?php
$state = $_GET['state'];
$postcodes = null;
if($state == "NYC")
{
$postcodes = array("postcode1", "postcode2");
}
if($state == "OKC")
{
$postcodes = array("postcode3", "postcode4");
}
?>
<form action="anotherpage.php" method="get">
<select id="postcode" name="postcode">
<?php
foreach ($postcodes as $p)
{
echo '<option value="'.$p.'">'.$p.'</option>';
}
?>
</select>
<input type="submit" value="Next page" />
</form>
Of course there are more efficient ways to go about this, but this should give you an idea.
below is my code (1.jsp)
<html>
<head>
<script type="text/javascript">
function changeFunc() {
var selectBox = document.getElementById("selectBox");
var selectedValue = selectBox.options[selectBox.selectedIndex].value;
document.write("\n value is"+selectedValue);
}
</script>
</head>
<body>
<form method="post" action="SampServlet">
<select id="selectBox" name="selurl" onchange="changeFunc();">
<option value="1">Option #1</option>
<option value="2">Option #2</option>
</select>
</form>
</body>
</html>
Here I have inserted this code into a jsp page.And getting the value of "selectedValue" from javascript to scriptlet with in the same jsp like this.
<% String val=(String)request.getParameter("selurl");
System.out.println("\n selected value is:"+val); %>
I am getting selected value as null as output. And if I print javascript selectedValue parameter it is giving me correct output i.e.,output as the option selected.But in scriptlet am getting null.Where is the error.I included all headers and directives.Please help me.
In your web browser you have only html, javascript and css. All JSP code is meant to be run on the server. So you get only the output of the jsp file. And after this you cannot change the jsp code.
Use submit Button to get Your Selected value at same page and
no need any function,no need onsubmit.
for example:
<form method="post" action="">
<select id="selectBox" name="selurl">
<option value="1">Option #1</option>
<option value="2">Option #2</option>
</select>
<input type="submit" value="Submit" name="sub">
//use scriplet tag
<% String r=request.getParameter("sub");
if(r.equals("Submit"){
String s=request.getParameter("selurl");
System.out.println("selected value is "+s);
}%>
</form>
Your select element should have a name attribute and you must use that name in request.getParameter()
<select id="selectBox" name="selurl"">
<option value="1">Option #1</option>
<option value="2">Option #2</option>
</select>
String val = request.getParameter("mySelect");
EDIT:
If you want the server request to be made on the select element's onchange event, you must Ajax.
Using jQuery,
$.post('SampServlet', {selectedValue: selectedValue}, function(data) {
//Update view
});
You're missing the <submit> button.
<form method="post" action="SampServlet">
<select id="selectBox" name="selurl" onchange="changeFunc();">
<option value="1">Option #1</option>
<option value="2">Option #2</option>
</select>
<input type="submit" /> <!-- MISSING!! -->
</form>
Add the button and click on it to submit the form to your servlet with the selected value sent as selurl. Please, note that your form's action attribute is pointing to SampServlet which seems to be a servlet. For jsps we usually have something like action="page.jsp" in the form.
EDIT:
If you want to post the form automatically when the user selects a value from the drop-down just set your onchange to: (you won't even need the <submit> button then)
onchange="this.form.submit()"