Problem with jQuery's load

Problem with jQuery's load

Hello all,

I have the following selectboxes:

  1. <select name="select1" size="20" id="location" style="width:200px;">
        <option value="1">Location 1</option>
        <option value="2">Location 2</option>
    </select>


  1. <div id="products">
  2. <select name="select2" size="20" id="product" style="width:200px;">
        <option value="1">Product 1</option>
        <option value="2">Product 2</option>
    </select>


  3. </div>
If I select one of the first selectbox (for example Location 1), the second selectbox changes, that differs from your choice at selectbox 1. I do that with the following jQuery code:

  1. $('#location').change(function(){
        var location = $(this).val();
        $("#products").load("location.php?lid="+location);
    });


Now my PHP script creates a selectbox with the products that belong to location 1. With that jQuery script it loads the new selectbox into div with id products. I do that with the following code:

  1. $con = mysql_connect("localhost","user","pass");
    if (!$con)
      {
      die('Could not connect: ' . mysql_error());
      }

    mysql_select_db("db", $con);

    echo '<select name="select1" size="20" id="product" style="width:200px;">';

    if (isset($_GET['lid']))
    {
        $lid = $_GET['lid'];
        $result = mysql_query("SELECT * FROM bla WHERE id = 1 AND lid = $lid");

        while($row = mysql_fetch_array($result))
        {
            echo '<option value="'.$row['did'].'">'.$row['name'].'</option>';
        }
    }

    echo '</select>';




















And now I add the following code to the jQuery script:

  1. $('#product').change(function(){
        alert('Someone selected me, my value = ' + $(this).val());
    });

So when I click the products selectbox i get an alert.. But if I first select a location, and the products selectbox changes I don't get an alert when I change the value.

Does anyone knows a solution to this?

Thanks in advance,

Blaabi