Forum Moderators: open
I have 2 drop down lists on a page. Depending on the option selected by the user from the lists, records are displayed on the page. The user has to click on a 'submit' button which refreshes the page with the relevant records.
But when the submit button is pressed the drop down lists do not display the value the user selected, but get reset to their initial values.
Any help wud be appreciated.
A very similar issue is being discussed here [webmasterworld.com].
In your case, since you are round tripping the page, you could set the selected attribute on the select list to the users choice.
HTH
Thanks
In this cased the third option will be selected. This is the value for HTML4.01.
HTH
<select name="site[]" onChange="MM_jumpMenu('parent',this,0)" size="1">
<option>keanu reeves</option>
<option>tom cruise</option>
<option>johny depp</option>
<option selected>ALL</option>
</select>
after this i have a button:
<input type="submit" name="Submit" value="GO->">
the user can select something from the drop down list and click on "go" to see a list of films of the chosen actor on the same page as the drop down list.
Suppose the selected is "ALL". Now the user selects 'tom cruise' and hits GO. Then the page gets refreshed and displays list of his movies in the same page however the drop down list is still showing 'ALL'. I want it to show "tom cruise".
Its possible?
me a little confused.
Thanks a lot for all the help.
For this you can use Javascript, PERL, PHP, ASP, or any number of scripting/programming languages.
1) Page 1: User selects item from list
2) Page 1: User clicks "GO->" (or MM script goes automatically)
3) Request is sent to server, including selected item
4) Page is put together at the server:
You could use PHP, ASP, PERL, ColdFusion, etc. at this point to determine the selection (you are already using it to get the data/page) and write the Page 2 code with the proper item selected.
5) Page is delivered to client.
6) Page 2: Contains content re: selected item
You could use Javascript, VBScript, etc. at this point to determine the selection from the previous page by grabbing the item from the URI and dynamically modifying the default selection to the one in the URI.
What web languages do you use?
How can I update the page without making the user click on 'GO->' button?
Thanks
Page 1:
<select name="site[]" onChange="this.form.submit()">
<option />keanu reeves
<option />tom cruise
<option />johny depp
<option selected />ALL
</select>
<input type="submit" name="Submit" value="GO->">
Page 2 (where the form's "action" points to):
<select name="site[]" onChange="this.form.submit()">
<?php
switch ($_POST["site[]"]) {
case "1":
print "<option selected />keanu reeves\n";
print "<option />tom cruise\n";
print "<option />johny depp\n";
print "<option />ALL\n";
break;
case "2":
print "<option />keanu reeves\n";
print "<option selected />tom cruise\n";
print "<option />johny depp\n";
print "<option />ALL\n";
break;
case "3":
print "<option />keanu reeves\n";
print "<option />tom cruise\n";
print "<option selected />johny depp\n";
print "<option />ALL\n";
break;
case "4":
print "<option />keanu reeves\n";
print "<option />tom cruise\n";
print "<option />johny depp\n";
print "<option selected />ALL\n";
break;
}
?>
</select>
That ought to do it!
So the user can view records filtered by criteria of names of actors as well as the year.
The 2 lists have options as shown below.
Keanu Reeves
Tom Cruise
Johny Depp
1990-1995
1996-1998
1999-2003
Since i have put this.form.submit() the change is immediate without the need for a submit button.
But the issue is that when u select johny depp (and the default is keanu reeves) the page immediately gets refreshed and the value in the drop down list becomes keanu again.
So this doesnt allow me to select johny depp for a particular year.
It has immediately changed to its default value.
My code looks as follows.
<td>Site:
<select name="site[]" onChange="this.form.submit()" size="1">
<option />FMDC
<option />PMDC
<option />ERDC
<option selected />ALL
</select>
</td>
<td>Year:
<select name="year[]" onChange="this.form.submit()" size="1">
<option>1990-1995</option>
<option>1996-1998</option>
<option>1999-2003</option>
</select>
</td>
And yes its all inside a form with method="POST"
wheres the problem?
Not a big problem, although without seeing the rest of the form code it's a little tough to figure out why the drop down menus are being treated as arrays. I'm electing NOT to treat them as arrays. Also, the default "size" of a SELECT menu is "1" ... no need to put that in there.
Here are more code changes, taking out the auto-submit function, which means the user must click the submit button. I'm only printing a few lines of code, here, so you'll need to put them in the appropriate place(s) in your actual page:
===snipsnip===
<form action="<?=$PHP_SELF?>" method="post">
<table><tr><td>Site:
<select name="site">
<?
# Check for the "site" parameter in the URI
switch ($_POST["site"]) {
# If "site=ALL", do this:
case "ALL":
?>
<option selected />ALL
<option />FMDC
<option />PMDC
<option />ERDC
<?
break;
# If "site=FMDC" do this:
case "FMDC":
?>
<option />ALL
<option selected />FMDC
<option />PMDC
<option />ERDC
<?
break;
# etc ...
case "PMDC":
?>
<option />ALL
<option />FMDC
<option selected />PMDC
<option />ERDC
<?
break;
case "ERDC":
?>
<option />ALL
<option />FMDC
<option />PMDC
<option selected />ERDC
<?
break;
# If there is NO "site" parameter in the URI, do this:
default:
?>
<option selected />ALL
<option />FMDC
<option />PMDC
<option />ERDC
<?
}
# End of what to do with "site" in the URI
?>
</select>
</td>
<td>Year:
<select name="year">
<?
# Check for the "year" parameter in the URI
switch ($_POST["year"]) {
# If "year=1990-1995" do this:
case "1990-1995":
?>
<option selected />1990-1995
<option />1996-1998
<option />1999-2003
<?
break;
# If "year=1996-1998" do this:
case "1996-1998":
?>
<option />1990-1995
<option selected />1996-1998
<option />1999-2003
<?
break;
# etc ...
case "1999-2003":
?>
<option />1990-1995
<option />1996-1998
<option selected />1999-2003
<?
break;
# If there is NO "year" parameter in the URI, do this:
default:
?>
<option selected />1990-1995
<option />1996-1998
<option />1999-2003
<?
}
# End of what to do with "year" in the URI
?>
</select>
</td>
<td>
<input type="submit" value="GO->">
</td>
</tr></table>
===snipsnip===
(To test this, copy everything between the "===snipsnip==="s and paste it into a new file. Save it and upload it to your server, then check the page in your browser.)
