Page 1 of 1

A php and javascript question

Posted: Thu Sep 18, 2003 10:28 am
by zw1971
I'm writing a web page which contains 2 forms. THe first form has a listbox, how can I use onClick() to dynamically load the second form based on the listbox selection? My code is like this:


<form name="form1" method="post" action="">
<div align="center">
<select name="listbox1" onChange="display_index(document.form1.listbox1.value)">
<?php
do {
?>
<option value="<?php echo $row_document_type['dt_id']?>"<?php if (!(strcmp($row_document_type['dt_id'], $row_document_type['dt_description']))) {echo "SELECTED";}?> ><?php echo $row_document_type['dt_description']; ?></option>
<?php
mysql_select_db($database_localhost, $localhost);
$query_document_index_definitions = sprintf("SELECT * FROM t_documentindexdefinition WHERE dt_id = %s ORDER BY did_id ASC", $row_document_type['dt_id']);
$document_index_definitions = mysql_query($query_document_index_definitions, $localhost) or die(mysql_error());
$row_document_index_definitions = mysql_fetch_assoc($document_index_definitions);
$totalRows_document_index_definitions = mysql_num_rows($document_index_definitions);
$dt_id=$row_document_type['dt_id'];
echo "<script language='javascript'>";
echo "var document_index_definition$dt_id=new Array(";
do{
echo "'";
echo $row_document_index_definitions['did_description'];
echo "'";
echo ",";
}while ($row_document_index_definitions=mysql_fetch_assoc($document_index_definitions));
echo "'foo')";
echo "</script>";
?>
<?php
} while ($row_document_type = mysql_fetch_assoc($document_type));
$rows = mysql_num_rows($document_type);
if($rows > 0) {
mysql_data_seek($document_type, 0);
$row_document_type = mysql_fetch_assoc($document_type);
}
?>
</select>


</div>
</form>

How can I write the 2nd form's code to be dynamically show up using javascript?

Many thanks

Posted: Thu Sep 18, 2003 11:03 am
by igoy
not onClick().... use onChange() event for the first select menu.. using that event execute the script to write the content to next select menu.. offcourse you cannot execute PHP script since it will have to reload the page in order to show the changes..

this is a common issue, and some time ago I had also been thru this question.. how to get PHP and Javascript interact..but we all forget one basic funda. PHP is a serverside language and JAVASCRIPT is client side. So what ? PHP renders the data then outputs the HTML, while javascript is a part of the output. so runs on Client side. so there is no direct interaction of JS and PHP.

so you will have to write the content to next select menu using javascript. if you want the data to be dynamic that means from database or so.. you will have to output it in page first itself. and then display according to user selects from first select menu..

Posted: Thu Sep 18, 2003 11:31 am
by zw1971
Sorry, I did use onChange() in my code.

If you carefully read my code, you'll notice I already created the arrays using js. But I got some problem to use the array to describe the tables.

Who can tell me what's wrong with this code:

<option name="select" onChange="display(this.form.select.value)">
</option>
<script language="javascrip">
function display(obj)
{

alert("document_index_definition"+ojb+)
}
</javascript>

//while I already defined arrays document_index_definition1, document_index_definition2, document_index_definition3, document_index_definition4. But why the popup only shows the variable name instead of the value in it?

Thanks

Posted: Fri Sep 19, 2003 11:46 am
by Vincent Puglia
Hi,

If the arrays already exist on the client-side, you can create the second selection object with this:

Code: Select all

function fillSel(destSel, dataArray)
&#123;

  var numOfOptions = dataArray.length/2;
  var Len = destSel.options.length;
  for (var i = 0; i < numOfOptions; i++)  
  &#123;
     destSel.options&#1111;Len] = new Option(dataArray&#1111;i++]);
     destSel.options&#1111;Len].value = dataArray&#1111;i];
  &#125;
&#125;
where:

destSel = the destination select object (document.formname.selectname)
dataArray = an array of text and values for the objects --
(dataArray[0] = 'Atari 600'; dataArray[1] = '$9.99'; )

Vinny