jQWidgets Forums

jQuery UI Widgets › Forums › General Discussions › Lists › DropDownList › Unable to programmatically select list item

Tagged: 

This topic contains 1 reply, has 2 voices, and was last updated by  Peter Stoev 11 years, 4 months ago.

Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Unable to programmatically select list item Posts
  • March 7, 2014 at 4:23 pm Unable to programmatically select list item #50699

    DM
    Participant

    Hi,
    I’ve got a drop down list with 2 list items. The values of which are true and false. The problem I have is that I can’t programmatically select the list item representing false.

    In the sample below if you select “False” from the drop down list you can press the “set to true” button and “true” is selected in the list via a ‘val’ API call. However, if you have “True” selected in the listbox, pressing “set to false” does nothing.

    This may seem a strange scenario but I’m trying to build a property grid like the MS property grids where boolean values can be changed using a drop list rather than a checkbox. I’m also using knockout so setting my view model observable value to false should be reflected in the UI (via a custom binding) but it’s not happening.

    Thanks for your help.

    <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>
    <html xmlns=”http://www.w3.org/1999/xhtml”>
    <head>
    <meta name=”keywords” content=”jQuery DropDownList, List, ListBox, Popup List, jqxDropDownList, jqxListBox, List Widget, ListBox Widget, DropDownList Widget” />
    <meta name=”description” content=”The jqxDropDownList represents a widget that contains a list of
    selectable items displayed in a drop-down.” />
    <title id=’Description’>The jqxDropDownList represents a widget that contains a list
    of selectable items displayed in a drop-down.</title>
    <link rel=”stylesheet” href=”../../jqwidgets/styles/jqx.base.css” type=”text/css” />
    <script type=”text/javascript” src=”../../scripts/gettheme.js”></script>
    <script type=”text/javascript” src=”../../scripts/jquery-1.10.2.min.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxcore.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxbuttons.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxscrollbar.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxlistbox.js”></script>
    <script type=”text/javascript” src=”../../jqwidgets/jqxdropdownlist.js”></script>
    </head>
    <body>
    <div id=’content’>
    <script type=”text/javascript”>
    $(document).ready(function () {
    var source = [
    { value: true, text: “True” },
    { value: false, text: “False” }
    ];

    // Create a jqxDropDownList
    $(“#jqxWidget”).jqxDropDownList({ source: source, displayMember:”text”, valueMember: “value”, width: ‘200’, height: ’25’, theme: “” });
    });
    </script>
    <div id=’jqxWidget’>
    </div>
    <input type=”button” value=”Set to true” onclick=”javascript: $(‘#jqxWidget’).jqxDropDownList( ‘val’, true );” />
    <input type=”button” value=”Set to false” onclick=”javascript: $(‘#jqxWidget’).jqxDropDownList( ‘val’, false );” />
    </div>
    </body>
    </html>

    March 7, 2014 at 9:53 pm Unable to programmatically select list item #50714

    Peter Stoev
    Keymaster

    Hi alanfaux,

    You can use the “selectIndex” method to select either the first or second item by passing 0 or 1 as parameters.

    Best Regards,
    Peter Stoev

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

  • Author
    Posts
Viewing 2 posts - 1 through 2 (of 2 total)

You must be logged in to reply to this topic.