jQWidgets Forums

jQuery UI Widgets Forums General Discussions Lists DropDownList Binding grid with Dropdown

This topic contains 2 replies, has 2 voices, and was last updated by  udhayan 10 years, 9 months ago.

Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
  • Binding grid with Dropdown #61084

    udhayan
    Participant

    hi, my scenario is to select a value from a drop down and based on my selection it should display the grid.

    in my dropdown listing out – industries on selecting the industries it should display the product associated to that industry.

    is it possible. Any help?

    $(document).ready(function () {
    // prepare the data
    var source =
    {
    datatype: “json”,
    datafields: [
    { name: ‘productname’, type: ‘string’},
    { name: ‘industry’, type: ‘string’},
    { name: ‘category’, type: ‘string’},
    { name: ‘status’, type: ‘string’},
    { name: ‘submitted’, type: ‘date’}

    ],
    url:’ind.php’,
    async: false
    };

    var dataAdapter = new $.jqx.dataAdapter(source);
    $(“#jqxDropDown”).jqxDropDownList(
    {
    width: 350,
    height: 25,
    source: dataAdapter,
    promptText: ‘Select a Program:’,
    selectedIndex: -1,
    displayMember: ‘industry’,
    valueMember: ‘industry’
    });

    $(“#jqxListBox”).bind(‘select’, function(event)
    {
    var industry = event.args.item.value;

    var gridSource =
    {
    datatype: “json”,
    datafields: [
    { name: ‘p_id’, type: ‘int’},
    { name: ‘productname’, type: ‘int’},
    { name: ‘industry’, type: ‘int’},
    { name: ‘category’, type: ‘int’},
    { name: ‘status’, type: ‘string’},
    { name: ‘submitted’, type: ‘date’}
    ],
    type: ‘POST’,
    data: {industry:industry},
    url: ‘data1.php’,

    };

    var dataAdapter = new $.jqx.dataAdapter(gridSource);
    $(“#Grid”).jqxGrid({
    source: dataAdapter,
    width: ’100%’,
    autoheight: true,
    editable: true,
    columns:
    [
    {datafield: “p_id”, text: “#”, width: ’10px’},
    {datafield: “productname”, text: “Sets”, width: ’50px’},
    {datafield: “industry”, text: “Reps”, width: ’50px’},
    {datafield: “category”, text: “Weight”, width: ’80px’},
    {datafield: “status”, text: “Activity”, width: ‘395px’}
    ]
    });
    });
    });
    </script>

    Binding grid with Dropdown #61087

    Dimitar
    Participant

    Hello udhayan,

    I suppose you are looking for something similar to the PHP demo ComboBox and Grid.

    Best Regards,
    Dimitar

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

    Binding grid with Dropdown #61146

    udhayan
    Participant

    Dimitar, Thanks for your help.

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

You must be logged in to reply to this topic.