Option

Hi i need some help,how to do this in jquery.in the <select> how can i load the data to the select element that was queried in the database…

for example


<select>
  <opption></option>

</select>


Hi there,

Dynamically creating a <select> element and adding a few <options> to it isn’t too hard.
But it would help to know what form is the data in.
How are you fetching it from the database?

Hi thank you for the reply,Okay i just tried to alert first so that i can see what is the data returned but it fails to alert

this how i query my string to other page


 $(function(){ 
  $.ajax
	({
	   type: "POST",
	  data: "id="+myid,
	  url: "members.php",
	 	
	  success: function(r)
	  {
              var id = r.empid;
	     $('#emp').val(r.empname);
             mydropdown(id);

	 }
  });
});


 function  mydropdown(id){
              
              $.getJSON('toselectdropdown.php','empid = id',getEmpId);

                function getEmpId(e){
                   alert (e.emp);
                }

 }



toselectdropdown.php


  <?php 
   if(isset($_POST['empid'])){

         $empid = $_POST['empid'];


          $sql = mysql_query("select * from myemployee where emp_id  = $empid");

          if(!$sql){
              die("Failed".mysql_error());
          }

        while($row = mysql_fetch_array($sql,MYSQL_BOTH)){

               $empaddr= $row['emp_addr'];

              $emp_data = array('emp'=>$empaddr);

            echo json_encode($emp_data);

        }




    }


    }
 ?>

but it will not alert.I hope you can help me on this.

Thank you in advance.

Hi,

Try changing this:

$.getJSON('toselectdropdown.php','empid = id',getEmpId);

function getEmpId(e){
  alert (e.emp);
}

Into this:

$.getJSON('toselectdropdown.php','empid = id', function(e){
  alert(e.emp);
});

Does that help?

:sick:

Hi pullo, Thank you for the reply, It did not alert.:scratch:

Hi there,

The syntax of the first part looks fine to me.

What we need to check now, is what is being returned from the initial ajax call.

Can you change this:

success: function(r)
{
  var id = r.empid;
  $('#emp').val(r.empname);
  mydropdown(id);
}

to this:

success: function(r)
{
  console.log(r);
}

and post the results.

Hi pullo, sorry for the late reply…I tried to put the code but i could not see where is the output of the console.log?
where i can see the output that the ajax initial returned?

If you test this in Chrome, press F12, click on the console tab and reload the page.
Then you will see the output of console.log()
Which browser are you using out of interest?

Hi, i am using FF

this is the output

Object { empid=

“0001”

, empname=

“Christina”

}

I also tried this




function  mydropdown(id){
              
              $.getJSON('toselectdropdown.php','empid = id',function(e){

              
                   console.log(e);
                });

 }



the params is

empid id

the result of log is null

OK, and what happens if you change:

success: function(r)
{
  var id = r.empid;
  $('#emp').val(r.empname);
  mydropdown(id);
}

to

success: function(r)
{
  var id = r.empid;
  console.log(id);
}

Presumably the output will be “undefined”.

i get 0001,

but if i use this

function mydropdown(id){

          $.getJSON('toselectdropdown.php','empid = id',function(e){

          
               console.log(e);
            });

}

there is no output.

I think the reason why i cannot display is because empid = id,instead of 0001,the display is “id”.
can you please see the getJSON function if that is correct especiall y in the empid= id,

Thank you in advance.

Hi there,

You always come on line the minute I step away from the PC :slight_smile:

What happens if you try this:

function  mydropdown(id){
  $.getJSON('toselectdropdown.php', {empid : id}, function(e){
    console.log(e);
  });
}

Hi, :slight_smile:

I get syntax error: missing: after the property id

{empid : id}

I also tried this by surrounding the curly braces into single quote,it runs but still i get null because the id cannot get 0001 value.it will display always like this {id= cls}


function  mydropdown(id){
  $.getJSON('toselectdropdown.php', '{empid : id}', function(e){
    console.log(e);
  });

Typo. That should be empid: (no space)

Okay i remove now the space but the result of the console is still null,it cannot get the real value which is 0001,
the value of the id is still id,.how can get the exact value ?

Hi, I’ll have to have a look at this later, as I’m away from the PC right now.
I’m sure we’ll be able to get to the bottom of it.

In the meantime, could you please post a typical response from toselectdropdown.php, i.e. What you would hope to get back from a sucessful call.

hi here it is.


 if(isset($_POST['id'])){

       


          $consql = mysql_query("select * from employee ");

        

        while($row = mysql_fetch_array($consql,MYSQL_BOTH)){

               $empaddress= $row['emp_address'];
              

            $data = array('empaddress'=>$empaddres);
          
            echo json_encode($data);


        }

}

Hi there,

So I’m just having a play around with this.

Let’s summarize:

$.ajax
({
  type: "POST",
  data: "id="+myid,
  url: "members.php",

  success: function(r)
  {
    var id = r.empid;
    $('#emp').val(r.empname);
    mydropdown(id);
  }
});

This works as expected.
r contains:

Object { empid="0001", empname="Christina"}
function  mydropdown(id){
  $.getJSON('toselectdropdown.php','empid = id',getEmpId);
  function getEmpId(e){
    alert (e.emp);
  }
}

This is where the problems start.

What is the reason you are using getJSON?
Does it have any advantage over $.ajax?

I can make your script work when toselectdropdown.php echos a JSON string and I pass the id as before ({empid: id}).
i.e. if I place this in the code:

echo json_encode(array("empid"=>"0001", "empname"=>"Christina"));

it works, but if I change it to this:

$empid = $_POST['id'];
echo json_encode(array("empid"=>$empid,"empname"=>"Christina"));

it dies silently.

Can you therefore do this:

function  mydropdown(id){
  $.ajax
  ({
    type: "POST",
    url: "toselectdropdown.php",
    data: { "id": id },
    dataType: "json",
    success:function(r)
    {
      console.log(r.id);
    }
  });
}

On my setup, this worked fine, but as there are DB queries etc involved, it is quite hard to replicate everything.