mysql db result convert as a json array

Question

I am trying to write a auto complete, which the auto complete items load one time when the PHP page loads. With the items that are fetched from mysql DB , i have create a json array like this

<?php
$bnkArray = array();
$sql_bnk = mysql_query("SELECT BName, BCode, ID  FROM bank");
while($rBnk = mysql_fetch_array($sql_bnk)){

    $bnkDet = array(
        'label' => $rBnk['BName'],
        'value' => $rBnk['BName'],
        'otherDetails' => $rBnk['BName'].'||'. $rBnk['BCode'].'||'. $rBnk['ID'] 
    );  
    array_push($bnkArray, $bnkDet);
}

?>

i need this array as like this javascript array

<script>

var bankSource11 = [
      {
        value: "jquery",
        label: "jQuery",
        otherDetails: "the write less, do more, JavaScript library",

      },
      {
        value: "jquery-ui",
        label: "jQuery UI",
        otherDetails: "the official user interface library for jQuery",

      },
      {
        value: "sizzlejs",
        label: "Sizzle JS",
        otherDetails: "a pure-JavaScript CSS selector engine",

      }
    ];
</script>

if i call this array like this in my auto complete this is not working

var bankSource = [<?php echo  $bnkArray; ?>];

what is this array type.. how to do this.

this is the autocomplete part

$(this).autocomplete({
            minLength: 0,
            source: bankSource,
            focus: function( event, ui ) {
                $(this).val( ui.item.label );
                return false;
            },
            select: function( event, ui ) {
                console.log(ui.item.value +' ____ ' + ui.item.otherDetails);
                $( "#project" ).val( ui.item.label );
                $( "#project-id" ).val( ui.item.value );
                $( "#project-description" ).html( ui.item.otherDetails );

                return false;
              }
            })


        }

Are you using javascript and PHP on same page?

sandeepsure
– sandeepsure

2015-10-21 06:17:47 +00:00
Commented Oct 21, 2015 at 6:17 — sandeepsure
– sandeepsure, Commented Oct 21, 2015 at 6:17
yes both are in one page

Nasik Ahd
– Nasik Ahd

2015-10-21 06:18:25 +00:00
Commented Oct 21, 2015 at 6:18 — Nasik Ahd
– Nasik Ahd, Commented Oct 21, 2015 at 6:18

mario.van.zadel · Accepted Answer · 2015-10-21 06:13:17Z

3

Please replace

var bankSource = [<?php echo  $bnkArray; ?>];

with

var bankSource = <?php echo json_encode($bnkArray); ?>;

edited Oct 21, 2015 at 6:13

answered Oct 21, 2015 at 6:07

mario.van.zadel

2,94716 silver badges24 bronze badges

Sign up to request clarification or add additional context in comments.

7 Comments

Nasik Ahd Over a year ago

after changing the var bankSource = <?php echo json_encode($bnkArray); ?>; the auto complete is showing empty results

mario.van.zadel Over a year ago

Does the generated javascript array looks okay? Are there any errors in your console?

Nasik Ahd Over a year ago

there is not any errors in the console, i am confusing with the array

Nasik Ahd Over a year ago

please check the my auto complete code to i have update the codes

mario.van.zadel Over a year ago

Why are there double "[" and "]"s? Please remove the braces around <?php echo json_encode($bnkArray); ?>.

|

sandeepsure · Accepted Answer · 2015-10-21 06:54:58Z

2

Here is a sample example which i modified accroding to your requirement. Kindly study it and let me know if you have any question.

 <?php
    $bnkArray = array();
    $sql_bnk = mysql_query("SELECT BName, BCode, ID  FROM bank");
    while($rBnk = mysql_fetch_array($sql_bnk)){

        $bnkDet = array(
            'label' => $rBnk['BName'],
            'value' => $rBnk['BName'],
            'otherDetails' => $rBnk['BName'].'||'. $rBnk['BCode'].'||'. $rBnk['ID'] 
        );  
        array_push($bnkArray, $bnkDet);
    }

    ?>


    <head>
      <meta charset="utf-8">
      <title>jQuery UI Autocomplete - Default functionality</title>
      <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
      <script src="//code.jquery.com/jquery-1.10.2.js"></script>
      <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
      <link rel="stylesheet" href="/resources/demos/style.css">
      <script>
      $(function() {
        var bankSource11  = <?php echo json_encode($bnkArray); ?>;
        $( "#My_Input" ).autocomplete({
          source: bankSource11  
        });
      });
      </script>
    </head>
    <body>

    <div class="ui-widget">
      <input id="My_Input">
    </div>

edited Oct 21, 2015 at 6:54

answered Oct 21, 2015 at 6:23

sandeepsure

1,1251 gold badge10 silver badges17 bronze badges

2 Comments

Nasik Ahd Over a year ago

if the [ ] remove in the bankSource11 variable it is working.. thank you for your effort

sandeepsure Over a year ago

@NSK If you find this answer helpful Mark it as accepted and upvote. So, other can also get confidence.

Niranjan N Raju · Accepted Answer · 2015-11-23 03:19:34Z

1

change this line like this,

var bankSource = [<?php echo  $bnkArray; ?>];

to

var bankSource = "<?php echo  json_encode($bnkArray); ?>";

Php variable is enclosed with quotes and assigned to js variable.

edited Nov 23, 2015 at 3:19

answered Oct 21, 2015 at 6:17

Niranjan N Raju

12k4 gold badges24 silver badges41 bronze badges

Comments

Rahul Gavande · Accepted Answer · 2015-10-21 06:15:47Z

0

You should do following :

var bankSource11 = [<?php echo json_encode($bnkArray); ?>];

answered Oct 21, 2015 at 6:15

Rahul Gavande

3242 silver badges11 bronze badges

Comments

Khoi Ngo · Accepted Answer · 2015-10-21 06:32:52Z

0

Note the single quotes, because it's string:

var bankSource = '<?php echo json_encode($bnkArray); ?>';

answered Oct 21, 2015 at 6:32

Khoi Ngo

1,56112 silver badges18 bronze badges

Collectives™ on Stack Overflow

mysql db result convert as a json array

5 Answers 5

7 Comments

2 Comments

Comments

Comments

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

5 Answers 5

7 Comments

2 Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related