jquery jtable.org options not working with dependsOn value

Question

I'm currently trying to implement table on my website using jtable.org jquery. So far, I have managed to show the states options but the cities options appear with blank result. (city_id options dependsOn state_id). I have been trying few hours to discover what is wrong.

Below is my javascript:

$(document).ready(function () {

    //Prepare jTable
    $('#practice_loc').jtable({
        paging: false,
        pageSize: 1,
        sorting: false,
        defaultSorting: 'Name ASC',
        actions: {
            listAction: 'blah.php?action=list',
            createAction: 'blah.php?action=create',
            updateAction: 'blah.php?action=update',
            deleteAction: 'blah.php?action=delete'
        },
        fields: {
            id: {
                key: true,
                create: false,
                edit: false,
                list: false
            },
            name: {
                title: 'Nama',
                width: '20%'
            },
            address: {
                title: 'Alamat',
                width: '40%'
            },
            phone: {
                title: 'Telepon',
                width: '20%'
            },
            type: {
                title: 'Jenis',
                width: '20%'
            },
            state_id: {
                title: 'Provinsi',                  
                options: 'query/get_common_list.php?action=list_state',
                list: false                 
            },
            city_id: {
                title: 'Kota',
                dependsOn: 'stateId', //Cities depends on state (province).
                list: false,
                options: function(data) {                       
                    return 'query/get_common_list.php?action=list_city&state_id=' + data.dependedValues.state_id;
                }
            }           
        }
    });

Answer 1

Please ensure, field referred at dependsOn is correct. I see the field name wrong without underscore, change dependsOn: 'stateId', from to dependsOn: 'state_id',. And in addition, return state_id value at fields as below:

state_id: {
    title: 'Provinsi',                  
    options: 'query/get_common_list.php?action=list_state',
    list: false,
    display: function (data) { return data.record.state_id;},             
},