jQWidgets Forums

jQuery UI Widgets Forums Lists DropDownList Option label different from the value

This topic contains 1 reply, has 2 voices, and was last updated by  Vladimir 9 years, 10 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
  • Option label different from the value #75672

    nimli
    Participant

    Hello,

    In my php codes, I have a dropdown like this:

    <select>
        <option value="0">Cat A</option>
        <option value="1">Cat B</option>
        <option value="2">Cat C</option>
        <option value="3">Cat D</option>
    </select>

    I am hoping to replace it with jqxDropDownList.

    I hope we can create some sort of array in PHP, pass it to the jqxDropDownList through the “source” to create such dropdown. But so far, I have no luck.

    If the “value” and the “option label” are the same, it will work with something like this:

    // php
    $data['opt_list'] = array('','Cat A','Cat B','Cat C','Cat D');  
    
    // javascript
    <div id='my_dropdown'></div>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#my_dropdown").jqxDropDownList(
               { source: <?=json_encode($opt_list)?>, 
                 selectedIndex: 2, 
                 width: '200px', 
                 height: '25px', 
                 theme: 'darkblue' });
    </script>

    However, if the “value” and “option labels” are different, I can’t figure out what to pass to “source” to get it to work.

    Any suggestion? Or other jqwidget components I should look into?

    Thank you.

    Option label different from the value #75684

    Vladimir
    Participant

    Hello nimli,

    You can do this in a couple of different ways.
    1. If you already have the structure for the html <select> code, you can directly create the jqxDropDownList from that. Here is the demo for it.
    2. If you want to only pass array data from php, you can use a dataAdapter, and load it from a JSON array. You can check the binding to json demo for it (note demo is using remote json, but you should be able to change it easily).

    Best Regards,
    Vladimir

    jQWidgets team
    http://www.jqwidgets.com/

Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.