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
A php and javascript question
Moderator: General Moderators
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..
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..
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
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
- Vincent Puglia
- Forum Commoner
- Posts: 67
- Joined: Thu Sep 04, 2003 4:20 pm
- Location: where the World once stood
Hi,
If the arrays already exist on the client-side, you can create the second selection object with this:
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
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)
{
var numOfOptions = dataArray.length/2;
var Len = destSel.options.length;
for (var i = 0; i < numOfOptions; i++)
{
destSel.optionsїLen] = new Option(dataArrayїi++]);
destSel.optionsїLen].value = dataArrayїi];
}
}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