php/html/js code confusion ...

[Jeremy_North]

Hi All,
Im having some confusion trying to accomplish the following.
I have a php script that's echoing html statements. the html statements produce a little form that has a table in it. The user enters data into the form, and on submit the user entered data are dumped into the $_GET variable. Simple. However, Ive got a select statement, inside the form, that looks somthing like:

echo '<select name="latlong_option"onchange="window.location=this.options[this.selectedIndex].value">';

echo '<select name="latlong_option" onchange="acqplan_e.php">';

echo '<option value="acqplan_e.php?latlong_option=dms" onmouseup="acqplan_e.php">select</option>'."\r\n";

echo '<option value="acqplan_e.php?latlong_option=dd" onmouseup="acqplan_e.php">Decimal degrees</option>'."\r\n";

echo '<option value="acqplan_e.php?latlong_option=dms" onmouseup="acqplan_e.php">Degree, min., sec.</option>'."\r\n";

echo '</select>';

Basically what's going on is the user is entering coordinates, they can select either decimal degrees or degree, min, sec. Depending on what the user selects the form displays with either single inputboxes (for decimal degrees) or sets of three input boxes (for deg, min, sec). ... if $_SESSION['latlon'] = 'dd', one bit of code is executed to show single input boxes, if the value is dms, another set of code runs.

My problem is this: besides the coordinates, the user will also be entering other data. when the user makes a selection with the above code, the form and table are redrawn to reflect the change and the previously entered data are lost. How can I save this data and print it back to the form after a selection is made?

[devinemke]

i don't know the broader aspects of your app but from what you have said i see no reason do anything server-side with regard to how your form is rendered. the user is choosing between 2 options and different form elements are displayed depending on which option was selected. you don't need to submit the form to the server to do this, just do everything client-side with javascript.

[Jeremy_North]

Ill try to explain more:

essentially when the form is initally drawn, It will be drawn based on one of two conditions based on input from an earlier page. either its drawn in "edit" or "new record" mode. In edit mode, the form has it's textboxes populated with data from a db, in new record mode, the form is blank. INitally the form is drawn with space for the user to enter coordinates in decimal degrees. The user can op to enter coordinates in DMS instead. This redraws the entire from by calling the code that drew it in the first place. when this happens, all other data that the user has entered in other areas of the form is lost. I need a way to retain this data so that if and when the form is redrawn, the user doesnt have to re-enter data.

Does your inital suggestion still apply? Must I use JS and not PHP to acomplish this?

Thanks

[devinemke]

Jeremy_North wrote:

...This redraws the entire from by calling the code that drew it in the first place.

that was precisely my point: why redraw the entire form? just use client-side code to add whatever text boxes you wish:

<a href="javascript:show_boxes('1')">show 1 text box</a><br>
<a href="javascript:show_boxes('3')">show 3 text boxes</a><br>
<a href="javascript:show_boxes('0')">remove all text boxes</a><br>

<script type="text/javascript" language="javascript">
function show_boxes(num)
{	
	for (i = 1; i <= 3; i++)
	{
		if (i <= num) {document.getElementById("text" + i).style.visibility = "visible";}
		else {document.getElementById("text" + i).style.visibility = "hidden";}		
	}	
}
</script>

<br>

<span id="text1" style="visibility:hidden;">text #1: <input type="text" name="text1"><br></span>
<span id="text2" style="visibility:hidden;">text #2: <input type="text" name="text2"><br></span>
<span id="text3" style="visibility:hidden;">text #3: <input type="text" name="text3"><br></span>

if you do not wish to do this client-side (for browser compatibilites reasons) then store all of the form elements in a session to retain them once the form is submitted.

[Jeremy_North]

Hi,
Thanks again for the reply. I see what you are saying, however the following applies to my situation ...

if you do not wish to do this client-side (for browser compatibilites reasons) then store all of the form elements in a session to retain them once the form is submitted.

I think my original question may not have been percise as this is exactly what I was attempting to ask, How to store the form elements in a session.. I know how to do it when the form is submitted with the POST or GET options, however, my "box type" selection option in embedded in the form and uses a touch of js to call the form redraw. How can I save the user-entered form data into a session var when the form is not being (re)called using the conventional GET/POST option.

Again, the bit of code im using to allow for the selection of 'boxtype' .. and some of the surrounding code for context ...

		
break;
// **************************************************************************
// CASE:  REVIEW / EDIT / New Record
		case "review":
		case "edit":
		case "New Record":
			$choiceMenu3="Table";
			if ($_SESSION['action']=='review') {
				$choiceOption="Review Record";
			} elseif ($_SESSION['action']=='edit'){
				$choiceOption="Edit Record";
			} elseif ($_SESSION['action']=='New Record'){
				$choiceOption="New Record";
			}
			echo "<br><br><path>".$choiceMenu1." / ".$choiceMenu2." / ".$choiceMenu3." / ".$choiceOption."</path><br><br>";

		echo '<form action="transact-acqplan.php" method="get">';

	// if statement here to control sensor drop down .. only happens in the case of edit/new record




		echo '<table width=650 border="1" align="left" cellpadding=3 cellspacing=1>';


		// loop over 
		// make column 1
		foreach ($fieldItems as $key => $value) {
		if ($key=="Coordinates"){
		if ($_SESSION['action']=='edit' OR $_SESSION['action']=='New Record'){
		// do nothing
		}
		}
		else{
  		echo '<tr><td valign="top">' . $value . '</td>';
			}

			// then set field value (column #2)
      	if ($key=="Coordinates") {
 // if we're in edit or new record mode, give a option list	
 if ($_SESSION['action']=='edit' OR $_SESSION['action']=='New Record'){	
		// havta end the first table
		echo '</table>';
		// and make a new one for coordinates
		echo '<table width=650 border="1" align="left" cellpadding=3 cellspacing=1>';
		        echo '<tr>';
    echo '<td colspan=2>Coordinate Format: ('.$_SESSION['latlong_option'].'):';
    echo '<select name="latlong_option" onchange="window.location=this.options[this.selectedIndex].value">'; // js that sets the option to control what type of boxes are drawn ...
       echo '<option value="acqplan_e.php?latlong_option=dms" onmouseup="acqplan_e.php">select</option>'."\r\n";
       echo '<option value="acqplan_e.php?latlong_option=dd" onmouseup="acqplan_e.php">Decimal degrees</option>'."\r\n";
       echo '<option value="acqplan_e.php?latlong_option=dms" onmouseup="acqplan_e.php">Degree, min., sec.</option>'."\r\n";
			echo '</select>';
    echo '</td></tr>';
  //      echo '<tr><td></td>';
   //     echo '<td>';

    echo '<table width=650 border="6" align="left">';
  if ($_SESSION['latlong_option']=='dd') {
  echo '<tr>';
    echo '<td colspan="3">Bounding Coordinates are in decimal degrees (dd) </td>';

... draw decimal degree boxes(above) .... or draw DMS boxes (below) ...

	}  if ($_SESSION['latlong_option']=='dms') {
  echo '<tr>';
    echo '<td colspan="3">Bounding Coordinates are in degrees, minutes, seconds (D°M\'S") </td>';
  echo '</tr>';
  echo '<tr>';
    echo '<td width="284"><input type="text" size="5" name="ULLaD" value="ULLat">°<input type="text" size="5" name="ULLaM" value="ULLat">\'<input type="text" size="5" name="ULLaS" value="ULLat">" </td>';
    echo '<td width="153" rowspan="2">&nbsp;</td>';

thanks

[devinemke]

since you are using the window.location() method in your onchange event handler the form is technically not submitted and thus there is no data in GET/POST. an alternate route is to have the form actually submit onchange like this:

onchange="this.form.submit();"

the effect will be essentially the same. then in the form handler collect the POST data, stick into a SESSION and spit out whatever new version of the form you want based on the user selection. you then have all of the data in $SESSION (or $POST for that matter) ready to prepopulate any of the existing fields.

[Jeremy_North]

Thanks!

I think

onchange="this.form.submit();"

is the silver bullet. Ill give that a try!
Thanks again.