Member Avatar for welshly_2010

i am having problem filling a selection box with json data. here my php code

<script src="jquery.js"></script>
<script src="jquery.jCombo.js"></script>
<style type="text/css">
</style>

<?php
$directory = opendir("C:/xampp/htdocs/xml");

$storeFilesIntoArray[] = "please select XML to load";

while (($fileName = readdir($directory)) !== false)
{
 $getLastFourDigitsOfFile = substr($fileName,-4); 

 if($getLastFourDigitsOfFile == ".xml")
 {
  #echo "filename is " . $fileName . "<br/>";
    $storeFilesIntoArray[] = $fileName;
 }
}
$json = json_encode($storeFilesIntoArray);
echo $json;
closedir($directory);

?>

</script>

which give me this when i load that page on to a webpage

 ["please select XML to load","cd_catalog.xml"]

but i cant give to fill a dropbox with the data above because unsure how to use the json call to fill a selection box; here my code for the json call back function so far;

<script type="text/javascript">

$(document).ready(function(){
    $.ajax({
        url: "dropdown.php",
        data: data_str,
        type:POST,
        dataType: 'json',
        success: function(d)
        {
            alert();
        }

    });

<body>
<select name="list1" id="list1"></select><br><br>
</body>
  • 4 Contributors
  • 7 Replies
  • 190 Views
  • 1 Day Discussion Span
  • Latest Post Latest Post by gon1387
Member Avatar for riahc3

If it intrests you, I do something similar except with a database:

html:

<div id="fa"></div>

php:

myfun: function()
    {

        $j.ajax({  // Start AJAX function                                     
            url: 'mysqlcall.php',                  //script that gets the data     
            async: false,                           //for me it had to be async
            data: "pam="+varpam,                        //url argumnets here to pass
                                            //for example "id=5&parent=6"
            dataType: 'json',                //data format      

            success: function(data)          //on recieve of reply
                { //start success function

               var selecthtml='Dropdown: <select name="dd" id="dd">'

                    for (var i=0;i<data.length;i++)
                        {    //start for  

                            var row = data[i];          
                            var name = row[0]; 


                            var coo = row[1]; 

                            selecthtml=selecthtml+'<option value="'+coo+'">'+name+'</option>';



                        }  //end for
                        selecthtml=selecthtml+'</select>';
                           $j('#fa').append(selecthtml);



                        } //end success


    },

Hope it gives you some ideas.

Edited by riahc3
Member Avatar for diafol

Slightly? Completely.

Not really, somebody posted some code with the following line:

async: false,                           //for me it had to be async

If the OP decides to use said code, then they should be made aware of the fact that this is not recommended - ergo my link.

Member Avatar for riahc3

Not really, somebody posted some code with the following line:

....??? I posted it :P Only three people have posted in this thread and you couldnt see it was me?

Member Avatar for diafol

Only three people have posted in this thread and you couldnt see it was me?

Regardless. I read your last comment and just replied - your first comment was 'above the fold' and I just quoted it without looking at the name. It should be avoided if possible.

No big deal though. Code as you wish.

Member Avatar for gon1387

Hi welshly_201,

The data you recieved are parsed as an array. You can use it like this:

$(document).ready(function(){
    $.ajax({
        url: "dropdown.php",
        data: data_str,
        type: "POST", // You should put the type inside double or single quotes
        dataType: 'json',
        success: function(d)
        {
            // Alert shows "please select XML to load"
            alert(d[0]);

            // Alert shows "cd_catalog.xml"
            alert(d[1]);
        }
    });

With regards to the "async" config diafol and riahc3's talking about, it's better set to true, although it's aleady default to true. Having this to false will make your page, wait for the response before proceeding with the code. What it mean is this.

$.ajax({
   url: "HelloWorld.com/myService/",
   async: false,
    /******
        ... Other config ...
    ******/
});

// This will not be executed unless the ajax 
//  request above recieved a response
alert("Hi!");

ALthough depending on how you wanted the page to run or what strategy you'll be doing, it's best to use an async call to avoid unresponsive pages, or other mistakes in program executions pertaining to a synchronous flow.

Let me know if you have any other questions regarding JSON response parsing in JS and processing responses in php.

Edited by gon1387
Be a part of the DaniWeb community

We're a friendly, industry-focused community of developers, IT pros, digital marketers, and technology enthusiasts meeting, networking, learning, and sharing knowledge.