sunfighter, thanks for your reply!
I'm able to populate from db and link to the additional fields based on the dropdown list selection. To achieve that, I have the following code:
PHP Code:
<?php
echo"
<script type='text/javascript' src='js/jquery-1.3.2.min.js'></script>
<script language='JavaScript'> ";?>
var num_of_cats = 17; // This is the number of categories, including the first, blank, category.
var open_in_newwindow=1; //Set 1 to open links in new window, 0 for no.
<?php
include '../datalogin.php';// make sure this is available to make connection to db
$result = mysql_query("SELECT * FROM products");
echo "var option_array = new Array(num_of_cats);";
$count=1;
echo"option_array[0] = new Array(\"Please Select a Merchandise\");";
while($row = mysql_fetch_array($result))
{
echo"option_array[".$count."] = new Array(\"--select One--\",\"\",\"\");";
$count++;
}
$result2 = mysql_query("SELECT * FROM products");
echo"var text_array = new Array(num_of_cats);";
$count=1;
echo "text_array[0] = new Array(\"Please Select a Merchandise\");";
while($row_1 = mysql_fetch_array($result2))
{
echo "text_array[".$count."] = new Array(\"".$row_1['product_desc']."\");";
$count++;
}
$result3 = mysql_query("SELECT * FROM products");
echo "var text_array2 = new Array(num_of_cats);";
$count=1;
echo "text_array2[0] = new Array(\"Please Select a Merchandise\");";
while($row_2 = mysql_fetch_array($result3))
{
echo "text_array2[".$count."] = new Array(\"".$row_2['unit_cost']."\");";
$count++;
}
?>
<?php
echo"
var options = 0;
function switch_select()
{
for (loop = window.document.PaymentForm.select_2.options.length-1; loop > 0; loop--)
{
window.document.PaymentForm.select_2.options[loop] = null;
}
for (loop = 0; loop < option_array[window.document.PaymentForm.select_1.selectedIndex].length; loop++)
{
window.document.PaymentForm.select_2.options[loop] = new Option(option_array[window.document.PaymentForm.select_1.selectedIndex][loop]);
}
window.document.PaymentForm.select_2.selectedIndex = 0;
}
function switch_text()
{
window.document.PaymentForm.mytextarea.value = text_array[window.document.PaymentForm.select_1.selectedIndex][window.document.PaymentForm.select_2.selectedIndex];
window.document.PaymentForm.cost.value = text_array2[window.document.PaymentForm.select_1.selectedIndex][window.document.PaymentForm.select_2.selectedIndex];
//window.document.PaymentForm.gift_card.value = text_array3[window.document.PaymentForm.select_1.selectedIndex][window.document.PaymentForm.select_2.selectedIndex];
//window.document.PaymentForm.qty.value = text_array4[window.document.PaymentForm.select_1.selectedIndex][window.document.PaymentForm.select_2.selectedIndex];
}
function box()
{
if (window.document.PaymentForm.select_2.selectedIndex == 0)
{
alert(\"Sorry, you have to select an item\");
} else {
if (open_in_newwindow==1)
window.open(url_array[window.document.PaymentForm.select_1.selectedIndex][window.document.PaymentForm.select_2.selectedIndex],\"_blank\");
else
window.location=url_array[window.document.PaymentForm.select_1.selectedIndex][window.document.PaymentForm.select_2.selectedIndex]
}
}
function set_orig()
{
window.document.PaymentForm.select_1.selectedIndex = 0;
window.document.PaymentForm.select_2.selectedIndex = 0;
}
window.onload=set_orig
</script> ";
// get product items from db again
$get_products = "select id as id_num, items as display_name2 from products order by id_num";
$get_products_res = mysql_query($get_products) or die (mysql_error());
if (mysql_num_rows($get_products_res) < 1)
{
// no records
$display_block .="<p><em>Sorry, no records to select</em></p>";
}
else
{
echo" <form name='PaymentForm' onSubmit='return false;'>
<tr><td><select name='select_1' style='width:200px; color:#003399; text-align:center; font-size:1em' onChange=\"switch_select(); switch_text();\">
<option>-- Select an Item --</option>";
while ($recs2 = mysql_fetch_array($get_products_res))
{
$id_num = $recs2['id_num'];
$display_name2 = stripslashes($recs2['display_name2']);
//$display_block .= "<option value=\"$id_num\">$display_name2</option>";
echo "<option>$display_name2</option>";
}
}
echo "</select> </td>";
echo "
<select name='select_2' onChange=\"switch_text();\" style='display:none' disabled='true'>
<option>You need to select a category</option>
<option></option>
<option></option>
</select>";
echo"<td><textarea name='mytextarea' rows='2' cols='40' class='expand10-1000' style='color:#003399; text-align:left; font-size:1.1em; border-left: none; border-right: none; border-bottom: none'></textarea><td>
<td valign='top' width='17%'><input type='text' name='qty' class=\"qty\" size='3' maxlength='3' value='' class='combo3' rel='code_id' title='' style='color:#003399; text-align:left; font-size:1.1em; border-left: none; border-right: none; border-bottom: none'></td>
<td valign='top' width='17%'><input type='text' name='cost' class=\"cost\" size='6' maxlength='6' value='0.00' class='combo3' rel='code_id' title='' style='color:#003399; text-align:left; font-size:1.1em; border-left: none; border-right: none; border-bottom: none'></td>
</tr>
</form>";
?>
I know the above code is a bit messy, but it is my first attempt. But at the moment it is working --I'll tidy it up later.
Now using jquery, I have added a button for the user to add another selection. Essentially, once the button is clicked, I want to load the above option.
for the Jquery, I' m using:
PHP Code:
$(document).ready(function() {
$('input').click(function(){
$(this).select();
});
$('#addrow').click(function(){
$('.item-row:last').after('<tr class="item-row"><td class="item name"><div class="delete-wpr">[COLOR="Red"] //--LOAD SELECTION CODE HERE!--//[/COLOR]</td></tr>');
if ($('.delete').length > 0) { $('.delete').show(); }//Not sure about the if clause
bind();
});
Therein lies my challenge thus far...
Any further thoughts!