0

I have a DDL (#engine) that needs to have its option values set via a MySql table based on the selected #make ddl.

I have the below script which passes to a php file - I know the php file is fine as I can output the results of the query independantly.

But, I cannot get the option values to update based on the returned array ... maybe a result of using GET? It's the first time i'm trying to return via AJAX (usually just use it to update data tables etc.)

Is there something amiss in my script?

$(document).ready(function() {

$("select#make").change(function(){
    $('#engine').find('option').remove().end(); //clear the engine ddl
    var make = $(this).find("option:selected").val(); //Need the value not the text

    $.ajax({
        url:'get-engine.php',
        type:'GET',
        data:{engine:make},
        dataType:'json',
        cache:false,
        success:function(data){


         var ddl = document.getElementById('engine');                      

         for(var c=0;c<obj.length;c++)
              {              
               var option = document.createElement('option');
               option.value = obj[c];
               option.text  = obj[c];                           
               ddl.appendChild(option);
              }


    },
        error:function(jxhr){
        alert(jxhr.responseText);

    }
    }); 

});
});

And the get-engine.php ..

$make = $_GET['engine'];

    $query= ("SELECT * FROM tb_engine where make_id='$make'");
    $result = mysql_query($query);
    $temp = array();

    while ($row = mysql_fetch_assoc($result)) {

     if(empty($temp))
     {
       $temp=array($row['engine_type']);
     }
     else
     {  
       array_push($temp,$row['engine_type']);
     }

    }
    echo (json_encode($temp));
    ?>

It so far refuses to update, can't quite find why?

Thanks in advance for all advice

Marc
  • 537
  • 2
  • 7
  • 19
  • do you get the `json` response back? have you checked in the firebug console... – Rafay Dec 09 '11 at 16:03
  • Hi, Yes it does, thats all fine - I can see the response array in firebug ... sent back as an array as expected, it just seems that my script is not creating the option values based on the returned array? – Marc Dec 09 '11 at 16:15
  • can you post your json response – Rafay Dec 09 '11 at 16:17
  • Sure - per the Response firebug tab it comes back as: ["Turbo Diesel","Turbocharged Petrol","Turbo Diesel","Turbocharged Petrol"] – Marc Dec 09 '11 at 16:19
  • You are not setting obj to be anything before trying to find its length in the for loop. – alexarno Dec 09 '11 at 16:40
  • If my array contains 2 fields, an ID and a name for each row, how would I split the select to have the value as one item, and the text as the second item? – Marc Dec 09 '11 at 19:30

1 Answers1

1

you can try 

//json is the json you have recieved in the success handler

$("#engine").empty();
$.each( json, function( index, item ) {
           $("<option/>",{value:item,text:item}).appendTo("#engine");

        });

DEMO

Rafay
  • 30,950
  • 5
  • 68
  • 101