jQuery Grid Plugin - jqGrid - Topic: filter dropdown from another dropdown http://www.trirand.com/blog/?page_id=393/help/filter-dropdown-from-another-dropdown Simple:Press Version 5.7.5.3 tony on filter dropdown from another dropdown http://www.trirand.com/blog/?page_id=393/help/filter-dropdown-from-another-dropdown#p31182 Help http://www.trirand.com/blog/?page_id=393/help/filter-dropdown-from-another-dropdown#p31182 Hello,

 

As far as I understand you try to make depened dropdown in search toolbar.

Using dataUrl is way to build the selects only once when the search toolbar is created.

I think you will need to bind a change event to the first dropdown on which when the values is changed to will the second with the needed values.

You can use dataEvents option to do this - see the docs.

To grab the second select element you should know that the id of this element is a combination of gs_ plus  the column name.

 

Kind Regards

]]> Fri, 03 Oct 2014 12:50:39 +0300 wexwell on filter dropdown from another dropdown http://www.trirand.com/blog/?page_id=393/help/filter-dropdown-from-another-dropdown#p31149 Help http://www.trirand.com/blog/?page_id=393/help/filter-dropdown-from-another-dropdown#p31149 bump - I still have not been able to find a working example if anybody has any suggestions.

]]> Sat, 20 Sep 2014 00:03:59 +0300 wexwell on filter dropdown from another dropdown http://www.trirand.com/blog/?page_id=393/help/filter-dropdown-from-another-dropdown#p31101 Help http://www.trirand.com/blog/?page_id=393/help/filter-dropdown-from-another-dropdown#p31101 I am using the search toolbar and I have all of the features working except I cannot figure out how to pass the values from one dropdown box to the server page to narrow the returned items in the dropdown list.  When something has been selected for field I want it to narrow down the list of well names in the other dropdown box to only those available in that field.

I was hoping the post option would be active and pass the field automatically, but of course it could not be that simple. I'm guessing this needs tied to an event but have not been be able to find any examples.

 

      
// <![CDATA[

        jQuery(document).ready(function()
        { jQuery("#grid").jqGrid({
                url: "getinfo.php",
                datatype: "json",
                mtype: 'POST',
                autowidth: true,
                height: 330,
                colNames: ["Name", "Num", "Field", "Pad", "API", "Legal", "County, State",
                    "Lease", "Unit CA PA", "Status", "Updated", "Wildlife Stips", "Notes"],
                colModel: [
                    { name: "well_name", width: 48,sortable: true, search:true, stype:'select', searchoptions: {dataUrl:'selectwell.php'}},
                    { name: "well_num", width: 18,sortable: true, search:true, stype:'text'},
                    { name: "field", width: 48,sortable: true, search:true, stype:'select', stype: 'select', searchoptions: {dataUrl:'selectfield.php'}},
                    { name: "pad", width: 36,sortable: true, stype:'text'},
                    ...
                ],
                rowNum:10,
                rowList:[10,25,50,10000],
                pager : '#pager',
                sortname: 'field',
                viewrecords: true,
                rownumbers: true,
                gridview: true,
                sortorder: "asc",
                caption:"Master Well List Maintenance"
             });
            jQuery("#grid").jqGrid('navGrid','#pager',
            { 
                view: true, 
                del: false, 
                add: true, 
                edit: true, 
                search: false,
                refresh: true
            },
            { /*prmEdit*/ }, 
            { /*prmAdd*/ }, 
            { /*prmDel*/ } , 
            { 
                /*prmSearch*/ 
                multipleSearch:true
            }, 
            { /*prmView*/ }
            );
            $('#grid').jqGrid('filterToolbar', { searchOnEnter: true, enableClear: true });
            $('#grid').jqGrid('navButtonAdd', '#pager', {
                caption: "",
                title: "Toggle Search Toolbar",
                buttonicon: 'ui-icon-search',
                onClickButton: function () {
                    this.toggleToolbar();
                    if ($.isFunction(this.p._complete)) {
                        if ($('.ui-search-toolbar', this.grid.hDiv).is(':visible')) 
                        {
                            
                            $('.ui-search-toolbar', this.grid.fhDiv).show();
                        } else {
                            $('.ui-search-toolbar', this.grid.fhDiv).hide();
                        }
                        this.p._complete.call(this);
                        fixPositionsOfFrozenDivs.call(this);
                    }
                }
            });
            $('.ui-search-toolbar').hide();
        });
        
// ]]>

 

Server code...

<!--?php 
include("../Includes/aedclass.php"); 
$nconn = new WorkData();
$conn = new PDO ($nconn->DB_DSN,$nconn->DB_USER,$nconn->DB_PASSWORD);

$field = $_POST['field'];

if (strlen($field)>0)
{ $sql = "SELECT field FROM master_well_list WHERE field='$field' GROUP BY field ORDER BY field asc;"; }
else
{ $sql = "SELECT field FROM master_well_list GROUP BY field ORDER BY field asc;"; }

$stmt = $conn->prepare($sql);
$stmt->execute();

$response ='';
$response .= '

';
while($row = $stmt->fetch(PDO::FETCH_NUM)) {
     $response .= '
'.$row[0].'
';
}
$response .= '';

echo $response;

?>
]]> Tue, 09 Sep 2014 00:13:59 +0300