Page 1 of 1

Javascript Onload

Posted: Sun Oct 14, 2007 3:33 pm
by davidtube
I have a list box which updates when it's contents when a choice is made from another list box.
It works by using the an "onchange" event call in the first list box.

Code: Select all

<select name="category" id="category" onchange="getSecond(this.value);">
That's fine but when the page loads the default option in the first list box, the second list box displays the wrong list until the first box is changed. So I thought I'd use "onload" but I can't use this for a list box. I've tried it in the body tag like this:

Code: Select all

<body onload="getSecond(document.myform.category.value);">
But it still isn't working. Have got the call right?

Thanks

Posted: Sun Oct 14, 2007 5:15 pm
by RobertGonzalez
Moved to Client Side.

Posted: Sun Oct 14, 2007 5:56 pm
by Kieran Huggins
I'll bet "getSecond()" references "this".

You'll save yourself a headache if you use jQuery, plus you'll be unknowingly on the road to a clean, progressively enhanced site ;)

Posted: Mon Oct 15, 2007 3:49 am
by davidtube
Thanks. I'll look into JQuery sometime.

I can't see the JavaScript referencing "This" though.

Code: Select all

<script type="text/javascript">
  function getSecond(value) {
    var url = 'sublist.php';
    var myAjax = new Ajax.Request
      (
        url,
        {
          method: "post",
          parameters : "catagory="+value,           
          onSuccess: function transResult (response) {
            document.getElementById('sublist').innerHTML=response.responseText;                       
          },
          onFailure: function transResult (response) {
            alert ('Failure'+response.responseText);
          }
        }
      );
      return false;
  }
  </script>

Posted: Mon Oct 15, 2007 3:52 am
by Kieran Huggins
try:

Code: Select all

<body onload="getSecond(document.getElementById('category').value)">
Does that work?

Posted: Mon Oct 15, 2007 3:54 am
by VladSun

Code: Select all

<body onload="getSecond(document.forms.myform.category.value);">
EDIT: It's almost the same as Kieran Huggins's suggestion :)

Posted: Mon Oct 15, 2007 9:24 am
by davidtube
Thanks for your suggestions. For some reason it's still not working though. I've come up with a work-around of adding a blank option at the top of the list if there is no particular default option needed (forcing the user to make a change to the list box). It looks like this if you're interested:

Code: Select all

<select name="category" id="category" onchange="getSecond(this.value);">
	<?php
$currentcat=mysql_query("SELECT category FROM product WHERE title='$_GET[title]' AND subcat='$_GET[subcat]'");

while ($_rows=mysql_fetch_array($currentcat))
{
$_SESSION[currentcat]=$_rows[category];

echo "<option value=" .$_SESSION[currentcat].">".$_SESSION[currentcat]."</option>";


}
if ($_SESSION[existing]=='0'){
echo "<option value=''></option>";
}

	$categories=mysql_query("SELECT category FROM subcat GROUP BY category");

while ($_rows=mysql_fetch_array($categories))
{
echo "<option value=" . $_rows[category] . ">" . $_rows[category] . "</option>";

}
	?>

				</select>