• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 732
  • Last Modified:

retain form values upon page reload

I am creating my first web application.  I have two drop down lists in a form that populates from database. One should  populate after the selection of the first.  I am using a javascript that reloads the page and populates the second drop down.   The problem I am having is that when I fill out the form and then select from the 1st drop down, the page reloads and I loose everything.  I need users to be able to fill in the form, select from the 2nd drop down depending on what value is selected from the 1st drop down. The user should then be able to continue filling in the form with all input still in the fields.  I do not have time to learn Ajax.   I would prefer to add to what I have.  I have learned so much from this and would appreciate any help you can give.

I am using the following script:


<script language="javascript">

function reload(form)
{
var schoolsel=form.school.options[form.school.options.selectedIndex].value; 
self.location='add.php?school=' + schoolsel;
}
</script>

//----PART OF FORM

<?php 
	echo "<tr><td><label>School: </label></td><td><select id='school' name='school' onchange='reload(this.form)'><option value=''>Select School</option>";
			while ($s=odbc_fetch_array($query))
				{
					$schoolname = $s['sname'];
					$schoolid = $s['sid'];
					if($schoolid==@$selschool){
					echo "<option selected='selected' value=".$schoolid.">".$schoolname."</option>";}
				         	else
						{
							echo "<option value=".$schoolid.">".$schoolname."</option>";
						}
										
					} echo "</select></td></tr>";
				
//***********************START DEPARTMENT DROPDOWN
				
						echo "<tr><td><label>Department:</label> </td><td>
							<select name='deptselect'><option value=''>Select Department</option>";
							while($d=odbc_fetch_array($deptqry))
								{					
									$depts = $d['dname'];
									$deptid = $d['did'];
									$schoolsid = $d['schools_sid'];
									echo "<option value=".$deptid.">".$depts."</option>";
								}
							echo "</select></td></tr>";
						
?>

Open in new window

0
webappnewbie
Asked:
webappnewbie
  • 5
  • 4
1 Solution
 
ropennerCommented:
added two lines....

line 13 which grabs the previous selection which you've called 'school' from the $_Request variable (always present)

and

line 23 which compares the current value with the schoolid previously choosen to see if it should show as selected now.... and inserts the string "selected" into the option so it looks like:

<OPTION selected VALUE=1>
<script language="javascript">

function reload(form)
{
var schoolsel=form.school.options[form.school.options.selectedIndex].value; 
self.location='add.php?school=' + schoolsel;
}
</script>

//----PART OF FORM

<?php 
	$current_selection = (isset($_REQUEST{'school'})?$_REQUEST{'school'}:"");
	echo "<tr><td><label>School: </label></td><td><select id='school' name='school' onchange='reload(this.form)'><option value=''>Select School</option>";
			while ($s=odbc_fetch_array($query))
				{
					$schoolname = $s['sname'];
					$schoolid = $s['sid'];
					if($schoolid==@$selschool){
					echo "<option selected='selected' value=".$schoolid.">".$schoolname."</option>";}
				         	else
						{
							$selected = ($current_selection == $schoolid?"selected":"");
							echo "<option $selected value=".$schoolid.">".$schoolname."</option>";
						}
										
					} echo "</select></td></tr>";
				
//***********************START DEPARTMENT DROPDOWN
				
						echo "<tr><td><label>Department:</label> </td><td>
							<select name='deptselect'><option value=''>Select Department</option>";
							while($d=odbc_fetch_array($deptqry))
								{					
									$depts = $d['dname'];
									$deptid = $d['did'];
									$schoolsid = $d['schools_sid'];
									echo "<option value=".$deptid.">".$depts."</option>";
								}
							echo "</select></td></tr>";
						
?>

Open in new window

0
 
ropennerCommented:
I misread your code ... it is simplified below

<script language="javascript">
function reload(form){
      var schoolsel=form.school.options[form.school.options.selectedIndex].value;
      self.location='add.php?school=' + schoolsel;
}
</script>

//----PART OF FORM

<?php
      $current_selection = (isset($_REQUEST{'school'})?$_REQUEST{'school'}:"");
      echo "<tr><td><label>School: </label></td><td><select id='school' name='school' onchange='reload(this.form)'><option value=''>Select School</option>";
      while ($s=odbc_fetch_array($query))      {
                  $schoolname = $s['sname'];
                  $schoolid = $s['sid'];
                  $selected = (strcmp($current_selection,"$schoolid")==0?"selected":"");
                  echo "<option $selected value=".$schoolid.">".$schoolname."</option>";            
      }
      echo "</select></td></tr>";
                        
//***********************START DEPARTMENT DROPDOWN
      echo "<tr><td><label>Department:</label> </td><td>
      <select name='deptselect'><option value=''>Select Department</option>";
      while($d=odbc_fetch_array($deptqry))            {                              
                  $depts = $d['dname'];
                  $deptid = $d['did'];
                  $schoolsid = $d['schools_sid'];
                  echo "<option value=".$deptid.">".$depts."</option>";
            }
      echo "</select></td></tr>";                        
?>
0
 
webappnewbieAuthor Commented:
Thank you; however, when the page reloads when I select a school, the values previously entered (fname, lname, title, etc...) disappears.
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
ropennerCommented:
what I do and would advise you to do is submit the whole form, instead of appending the 'schoolsel' to the self.location in javascript.

form.submit();

This can be done for the SELECT's onchange as shown below


Then on the submission, show the same form with any previously filled out fields like in this example 'fname'

so the PHP would look like below, except you need all of the above query stuff in there.  Since you haven't shown where you set fname or lname or title this is a sample of how to get previous values from $_REQUEST and use them in the form.  If they haven't entered anything it will be blank and if they have it will have the value they submitted on the form.

$fname_input = (isset($_REQUEST{'fname'})?$_REQUEST{'fname'}:"");

print <<< endofstraighttext
<FORM action=add.php method=post>
<SELECT name=school onchange="javascript:this.form.submit();">
     <OPTION value=1>school name 1</OPTION>
</SELECT>
<INPUT type=text name=fname value=$fname_input>
</FORM>
endofstraighttext

0
 
webappnewbieAuthor Commented:
I set all variables to the Post value:

$fname =  $_POST['name'];
$lname = $_POST['lname'];

I did what you suggest and still nothing.  I may be doing something wrong.  I commented out the javascript all together and used the onchange example.  Still no luck.  
0
 
webappnewbieAuthor Commented:
$fname = $_POST['fname']; is the variable for first name

0
 
ropennerCommented:
This is a fully working sample.

<?PHP
$fname_input = $_POST['fname'];
$school_input = $_POST['school'];
$current_selection = (isset($_REQUEST{'school'})?$_REQUEST{'school'}:"");


print <<< endofstraighttext
first name[$fname_input]<BR>
school [$school_input]<BR>
<FORM action=add.php method=post>
<SELECT name=school onchange="javascript:this.form.submit();">
<OPTION value=""></OPTION>
endofstraighttext;

for ($i=1; $i < 4; $i++) {
      $selected = (strcmp($current_selection,"$i")==0?"selected":"");
      print "<OPTION value=$i $selected>school name $i</OPTION>";
}
     
print <<< endofstraighttext
</SELECT><BR>
<INPUT type=text name=fname value="$fname_input">
</FORM>
endofstraighttext;
?>



if this is all you have for the file add.php then it should post whatever is typed in the  blank and put it back in the blank.  I printed the value input in the text blank above as well for confirmation that it did POST the data.

Picture shows the output after the first posting picture of output
0
 
webappnewbieAuthor Commented:
PERFECT!!!   If I only had a brain. I'm learning though...thank you soooooooo much ropenner!!!!!!  
0
 
webappnewbieAuthor Commented:
ropenner was very patient!
0

Featured Post

What does it mean to be "Always On"?

Is your cloud always on? With an Always On cloud you won't have to worry about downtime for maintenance or software application code updates, ensuring that your bottom line isn't affected.

  • 5
  • 4
Tackle projects and never again get stuck behind a technical roadblock.
Join Now