please help with reloading form (so close to working properly!)

[shure2]

hi,

I have a list box with product names (product table) and a list box with product details (productdetails table).

When I select a product name the form refreshes and populates the product details list box with values for the product selected.

Previously when I selected a product the data from the product table was written to various text fields, and now I want to make it so that when I select a product, it not only refreshes the form and populates the product details list box, but also populate a number of text fields with data from the product table.

The code I have made works fine to populate the product details list box, but it populates the product text fields BEFORE it refreshes the page (can see it for a split second!) and then when the page finishes refreshing the product fields are blank 🙁

function reload(form)
{
var val=prodform.prodid.options[form.prodid.options.selectedIndex].value;
self.location='product_page.php?prodid=' + val ;
showProductName();
}

function showProductName() {
		var prodid = document.prodform.prodid.value;
                //var val=prodform.prodid.options[prodform.prodid.options.selectedIndex].value;
                //var val = document.prodform.prodid.options[document.prodform.prodid.options.selectedIndex].value;
		document.prodform.prodcompid.value = prodDetailsArray[prodid]["prodcompid"];
                //document.prodform.proddetid.value = prodDetailsArray[prodid]["prodid"];
                document.prodform.prodcode.value = prodDetailsArray[prodid]["prodcode"];
		document.prodform.prodname.value = prodDetailsArray[prodid]["prodname"];
                document.prodform.prodcategory.value = prodDetailsArray[prodid]["prodcategory"];
                document.prodform.produnitprice.value = prodDetailsArray[prodid]["produnitprice"];
                document.prodform.prodphoto.value = prodDetailsArray[prodid]["prodphoto"];
                document.prodform.proddescription.value = prodDetailsArray[prodid]["proddescription"];
	}

//window.onload=function() {
		//showProductName();
                //reload(form);
                //showProductSpecName();

//}

</script>

<?php
@$cat=$_GET['prodid']; // Use this line or below line if register_global is off
if(strlen($cat) > 0 and !is_numeric($cat)){ // to check if $cat is numeric data or not.
echo "Data Error";
exit;
}

///////// Getting the data from Mysql table for first list box//////////
$quer2=mysql_query("SELECT DISTINCT prodname,prodid FROM product where userid = '".$_SESSION['userid']."' order by prodname");
///////////// End of query for first list box////////////

/////// for second drop down list we will check if category is selected else we will display all the subcategory/////
if(isset($cat) and strlen($cat) > 0){
$quer=mysql_query("SELECT DISTINCT proddetfield FROM productdetail where prodid=$cat order by proddetfield");
}else{$quer=mysql_query("SELECT DISTINCT proddetfield FROM productdetail order by proddetfield"); }
////////// end of query for second subcategory drop down list box ///////////////////////////

/////// for third drop down list we will check if category is selected else we will display all the subcategory/////
if(isset($cat) and strlen($cat) > 0){
$quer1=mysql_query("SELECT DISTINCT prodqualfield FROM productquality where prodid=$cat order by prodqualfield");
}else{$quer1=mysql_query("SELECT DISTINCT prodqualfield FROM productquality order by prodqualfield"); }
////////// end of query for third subcategory drop down list box ///////////////////////////




?>

<form method="post" name="prodform"  action="dd-check.php">
    <div id="topl">
        <div class ="toplpost">
            <h1 class="title"> Select a product </h1>
            <div class="entry">
                <select name="prodid" onchange="reload(this.form)">
                <?php


            while($noticia2 = mysql_fetch_array($quer2))
            {
                if($noticia2['prodid']==@$cat){echo "<option selected value='$noticia2[prodid]'>$noticia2[prodname]</option>"."<BR>";}
                else{echo  "<option value='$noticia2[prodid]'>$noticia2[prodname]</option>";}


                 //$selected = ($prodrow1['prodid']==$_SESSION['prodid']) ? ' selected="selected"' : '';
                 //echo "<option value=\"{$prodrow1['prodid']}\"{$selected}>{$prodrow1['prodname']}</option>\n";

            } ?>
	</select>
            <?php
            //////////        Starting of second drop downlist /////////
            echo "<select name='subcat'><option value=''>Select one</option>";
            while($noticia = mysql_fetch_array($quer)) {
            echo  "<option value='$noticia[proddetfield]'>$noticia[proddetfield]</option>";
            }
            echo "</select>";

thanks for any help, hopefully it will just be a case of calling the function that populates the product fields somewhere else!

[ixalmida]

If you're going to force a reload anyway, why not just post the data and redirect?

The better question may be why you are forcing a page reload at all. There are a couple of better ways to handle what you want to do. If there isn't a lot of data and you don't mind exposing details in the source, you could just pre-populate some Javascript arrays with all the options related to "Product Name" and let Javascript update the page sans-refresh.

If you have a lot of data (or expect to), then the best answer would probably be to learn AJAX. If you already know PHP and Javascript, you should be able to learn the basics of AJAX in a few hours.

[shure2]

ixalmida;10949665 wrote:

If you're going to force a reload anyway, why not just post the data and redirect?

The better question may be why you are forcing a page reload at all. There are a couple of better ways to handle what you want to do. If there isn't a lot of data and you don't mind exposing details in the source, you could just pre-populate some Javascript arrays with all the options related to "Product Name" and let Javascript update the page sans-refresh.

If you have a lot of data (or expect to), then the best answer would probably be to learn AJAX. If you already know PHP and Javascript, you should be able to learn the basics of AJAX in a few hours.

thanks for your reply, I don't really know javascript or php very well and although I would like to learn ajax I'm a bit stricken with time 🙁

if you could show me how to populate a list box based on another without reloading then I can learn the proper method.

otherwise I know its not the best method but is it possible to merge the javascript that populates the product text fields dynamically with the javascript that reloads the page?

[ixalmida]

Unfortunately, I'm under time constraints today. Basically, you'll use PHP to build Javascript arrays for Box2 and Box3 in the page header (google "javascript arrays"). You'll also pre-populate your option boxes as you've been doing. The thing that makes it go is a function in your page header that updates Box2 and Box3 based on Box1 and the onChange event in Box1. You can use multi-dimensional arrays or two separate arrays (one for option value, one for option text).

There should be good tutorials online for this if you google "javascript add options".

Perhaps someone else with more time can give you a more detailed tutorial.