Forum

November 2nd, 2014
A A A
Avatar

Lost password?
Advanced Search

— Forum Scope —




— Match —





— Forum Options —





Minimum search word length is 3 characters - maximum search word length is 84 characters

The forums are currently locked and only available for read only access
sp_Feed Topic RSS sp_TopicIcon
JQGrid Inline Editing : Filter subcategory dropdown list based on category selection
07/07/2010
17:48
Avatar
bilalashraf
New Member
Members
Forum Posts: 1
Member Since:
07/07/2010
sp_UserOfflineSmall Offline

hi,

I have a category and a subcategory column in a Jqgrid. I have enabled inline editing, both category and subcategory are dropdownlists columns (edittype:'select'). I need to filter the subcategory list based on the selected category. I wonder how can I acheive this functionlity?

Thanks,

22/07/2010
01:34
Avatar
EricT
New Member
Members
Forum Posts: 2
Member Since:
22/07/2010
sp_UserOfflineSmall Offline

This is actually fairly difficult to achieve my soloution below:

The PHP to respond to your handler is here:

<?php

if($action == "buildKVP")
{
    $table = $_REQUEST['table'];
    $keyField = $_REQUEST['keyField'];
    $valueField = $_REQUEST['valueField'];
    $where = $_REQUEST['where'];
    
    if($where != "") $where = " WHERE " . $where;
    
    $SQL = "SELECT ($keyField) AS keyField, ($valueField) AS value FROM $table $where ORDER BY value";
    $result = mysql_query( $SQL ) or die("Could not execute query.".mysql_error());
    
    $i=0;
    while($row = mysql_fetch_array($result,MYSQL_ASSOC))
    {
        $response->table = $table;
        $response->data[$i]['key']=$row[keyField];
        $response->data[$i]['value']=$row[value];
        $i++;
    }

    echo json_encode($response);
}

?>

This is the function that builds a nice variable for us to use the response from the server:

[note]: this can be used to populate a select field's initial values, eg:

var objMyList = buildKVP({table:"myTableName", keyField:"id", valueField:"name"});

colModel:[{name:'myField', ..., formatter:'select', edittype:'select', editoptions:{value: objMyList.string}}]

<script>

function buildKVP(params) // params: {table:"tableName", keyField:"keyName", valueField:"valueName"}
{
    if(typeof params.where === "undefined") params.where = "";
    
    var myVar;
    myVar = jQuery.ajax(
    {
        type: "POST",
        async: false,
        url: "myDataHandler.php",
        data:
        {
            action: "buildKVP",
            table: params.table,
            keyField: params.keyField,
            valueField: params.valueField,
            where: params.where
        },
        success: function(data)
        {
            // Do Something
        }
    });
    var myData = {};
    
    myData.object = eval("(" + myVar.responseText + ")");
    
    var strAssembly = "";
    for(x in myData.object.data)
    {
        if(typeof myData.object.data[x].key !== "undefined")
        {
            if(strAssembly != "" ) strAssembly += ";"
            strAssembly += myData.object.data[x].key + ":" + myData.object.data[x].value;
        }
    }
    
    myData.string = strAssembly;
    
    return myData;
}

</script>

You call this function when you trigger a dialog or an inline edit and feed it the parent key value and the element (drop down list) that you wish to populate with your dependant list

<script>

function loadSubService(parentKey, elmID)
{
    var dsSubService = buildKVP({table:"my_table_name", keyField:"id", valueField:"name/desc_field", where: "parentID = " + parentKey}).object;
   
    var curServiceList = "";
   
    for(key in dsSubService.data)
    {
        // if(curServiceList === "") curServiceList += '<option value=""></option>';
        if(typeof dsSubService.data[key].key !== "undefined")
            curServiceList += '<option value="'+ dsSubService.data[key].key +'">'+ dsSubService.data[key].value +'</option>\n';
    }
   
    jQuery(elmID).empty();
   
    if(curServiceList !== "")
        jQuery(elmID).append(curServiceList);
    else
        jQuery(elmID).append('<option value="0">No Dependant Fields Assigned</option>');
}

</script>

This entire soloution depends on the premise that you have your SQL set up in such a way that the child element contains a coloumn that identifies the parent key that it should be loaded for.

Hope this was helpful

- Eric

Forum Timezone: Europe/Sofia

Most Users Ever Online: 715

Currently Online:
36 Guest(s)

Currently Browsing this Page:
1 Guest(s)

Top Posters:

OlegK: 1255

markw65: 179

kobruleht: 144

phicarre: 132

YamilBracho: 124

Renso: 118

Member Stats:

Guest Posters: 447

Members: 11373

Moderators: 2

Admins: 1

Forum Stats:

Groups: 1

Forums: 8

Topics: 10592

Posts: 31289

Newest Members:

, razia, Prankie, psky, praveen neelam, greg.valainis@pa-tech.com

Moderators: tony: 7721, Rumen[Trirand]: 81

Administrators: admin: 66

Comments are closed.
Privacy Policy   Terms and Conditions   Contact Information