Using Dojo In PHP File

Question

I am trying to implement the dojo combobox on my website. but I am having no success.

In short, I get an array in PHP, I would like that array to be available in the dropdown, but they should be able to type anything they want, hence the combobox.

I have tried to follow the instructions on the links below. But it left me worse off than when I started. Can anybody provide a simple effective way to implement it?

Links:

https://dojotoolkit.org/reference-guide/1.10/dijit/form/ComboBox.html#examples

How to implement Dojo autocomplete similar to jQuery UI autocomplete?

you need to create data.php which return a json array containing your data, then make an ajax call to data.php and create new Memory({Data:responseServer}) , give the php code to have look inside your code — Spring

mschr mschr · Accepted Answer · 2016-02-24T12:53:24

You have to make sure, that your server returns valid JSON. This would be a flat array (number-indexed) with dictionary-styled arrays as items. Here's a probable sample;

<?php
   //requestServerData.php
   $data = array();
   $item_one = array("name" => "state1", "id" => "s1");
   $item_two = array("name" => "state2", "id" => "s2");
   array_push($item_one);
   array_push($item_two);
   echo json_encode($data);
?>

Putting it together with the fiddle you provided, simulating XHR via requestServerData function, this is how it goes:

// global handles for the store and combobox
var combo = null, store = null;
// simulaition of a call to PHP server, which returns a json encoded array
// e.g. "[{name:'state1', id:'s1'},{name:'state2', id:'s2'}]"
function requestServerData() {
     var responseText = "[{name:'state1', id:'s1'},{name:'state2', id:'s2'}]";
     var data = eval(responseText);
     var newStore = new dojo.store.Memory({"data": data});
     combo.set('store', newStore);
     combo.set('value', data[0].name)
}
// since domReady is in the require, this code block is not run until page loads
require([
    "dojo/store/Memory", "dijit/form/ComboBox", "dojo/domReady!"
], function(Memory, ComboBox){
    store = new Memory({
        data: [
            {name:"Loading", id:"LOAD"}
        ]
    });

    combo = new ComboBox({
        id: "stateSelect",
        name: "state",
        value: "Loading",
        store: store,
        searchAttr: "name"
    }, "stateSelect");
    combo.startup();
    requestServerData()
});

Your fiddle, updated: https://jsfiddle.net/fuanzcps/3/

Using Dojo In PHP File

1 Answers