Author Topic: Populate select input  (Read 1879 times)

eastofthesun882

  • Guest
Populate select input
« on: January 29, 2016, 03:22:31 am »
Hello

How do I populate a select input with the column source data when using local data?:

    <script>

   $(function(){
    var data = [
          ['Exxon Mobil','Exxon Mobil','36,130.0'],
            ['Wal-Mart Stores','Wal-Mart Stores','11,231.0'],
            ['Royal Dutch Shell','Royal Dutch Shell','25,311.0'],
            ['BP','BP','22,341.0'],
            ['General Motors','General Motors','-10,567.0'],
            ['Chevron','Chevron','14,099.0'],
            ['DaimlerChrysler','DaimlerChrysler','3,536.3'],
            ['Toyota Motor','Toyota Motor','12,119.6'],
            ['Ford Motor','Ford Motor','2,024.0'],
            ['ConocoPhillips','ConocoPhillips','13,529.0'],
            ['General Electric','General Electric','16,353.0'],         
            ['Total','Total','15,250.0'],               
            ['ING Group','ING Group','8,958.9'],
            ['Citigroup','Citigroup','24,589.0'],
            ['AXA','AXA','5,186.5'],
            ['Allianz','Allianz','5,442.4'],
            ['Volkswagen','Volkswagen','1,391.7'],
            ['Fortis','Fortis','4,896.3'],
            ['Crédit Agricole','Crédit Agricole','7,434.3'],
            ['American Intl. Group','American Intl. Group','10,477.0']
            ];
             
    var obj = {
    numberCell: false,
    filterModel: { on: true, header: true },
    width: 700,
    height: 400,
    colModel: [
        {title:"TEST1", width:200, dataType:"string", align: "left", filter: { type: 'textbox', condition: 'contain', listeners: ['keyup'] }},
        {title:"TEST2", width:150, dataType: "string", align: "left",
           filter: { type: 'select',
                 condition: 'equal',
                 prepend: { '': '--Select--' },
                 listeners: ['change'] }
              },
       
        {title:"TEST3", width:150, dataType:"string", align: "left", filter: { type: 'textbox', condition: 'contain', listeners: ['keyup'] }}
        ],

    dataModel: {data:data}
      }
   
   
    var $grid = $("#grid_array").pqGrid( obj );                                 

});       
</script>

<div id="grid_array"></div>


paramvir

  • Administrator
  • Hero Member
  • *****
  • Posts: 6263
    • View Profile
Re: Populate select input
« Reply #1 on: February 01, 2016, 11:45:44 am »
Please follow this example where dropdown options in Shipping Region are filled from the data in column.

http://paramquery.com/demos/filter_header_local

Code: [Select]
//load shipregion and shipvia dropdowns.
                var column = $grid.pqGrid("getColumn", { dataIndx: "ShipRegion" });
                var filter = column.filter;
                filter.cache = null;
                filter.options = $grid.pqGrid("getData", { dataIndx: ["ShipCountry", "ShipRegion"] });

                var column = $grid.pqGrid("getColumn", { dataIndx: "ShipVia" });
                var filter = column.filter;
                filter.cache = null;
                filter.options = $grid.pqGrid("getData", { dataIndx: ["ShipVia"] });

                $grid.pqGrid("refreshDataAndView");