json,jgrid,jquery,django example

$(document).ready(function(){
        $("#orgGrid").jqGrid({
            url:"{% url 'search_organizations' %}",
            datatype: "json",
            colNames:['', 'ID', 'Organization Name', 'Description', 'Address 1', 'Address 2', 'City', 'Country', 'Zip Code', 'URL', 'Contact Person Name', 'Contact Number', 'Email', 'Status', 'Actions'],
            colModel:[
                {
                    name:'id',key:true, index:'id', jsonmap: 'id', sortable:true, width:110,hidden:true //, sorttype: 'integer' //integer / number
                },
                {
                    name:'organization_id', index:'organization_id', jsonmap: 'organization_id', sortable:true, width:110 //, sorttype: 'integer' //integer / number
                     ,searchoptions: {
                         sopt: ["cn","nc","eq","ne","bw","ew","nu","nn"]
                     }
                }, //hidden: true,
                {name:'organization_name', index:'organization_name', jsonmap: 'organization_name', sortable:true
                    ,searchoptions: {
                         sopt: ["cn","nc","eq","ne","bw","ew","nu","nn"]
                     }
                },
                {name:'description', index:"description", jsonmap: 'description', sortable:true,
                    cellattr: function (rowId, cellValue, rowObject) { return  ' title="' + rowObject.description_full + '"'; }
                    ,searchoptions: {
                         sopt: ["cn","nc","eq","ne","bw","ew","nu","nn"]
                     }
                },
                {name:'address1', index:"address1", jsonmap: 'address1', sortable:true,
                    cellattr: function (rowId, cellValue, rowObject) { return  ' title="' + rowObject.address1_full + '"'; }
                    ,searchoptions: {
                         sopt: ["cn","nc","eq","ne","bw","ew","nu","nn"]
                     }
                },
                {name:'address2', index:"address2", jsonmap: 'address2', sortable:true,
                    cellattr: function (rowId, cellValue, rowObject) { return  ' title="' + rowObject.address2_full + '"'; }
                    ,searchoptions: {
                         sopt: ["cn","nc","eq","ne","bw","ew","nu","nn"]
                     }
                },
                {name:'city', index:"city", jsonmap: 'city', sortable:true
                    ,searchoptions: {
                         sopt: ["cn","nc","eq","ne","bw","ew","nu","nn"]
                     }
                },
                {name:'country', index:"country", jsonmap: 'country', sortable:true
                    ,searchoptions: {
                         sopt: ["cn","nc","eq","ne","bw","ew","nu","nn"]
                     }
                },
                {name:'zipcode', index:"zipcode", jsonmap: 'zipcode', sortable:true
                    ,searchoptions: {
                         sopt: ["cn","nc","eq","ne","bw","ew","nu","nn"]
                     }
                },
                {name:'url', index:"url", jsonmap: 'url', sortable:true
                    ,searchoptions: {
                         sopt: ["cn","nc","eq","ne","bw","ew","nu","nn"]
                     }
                },
                {name:'contact_person_name', index:"contact_person_name", jsonmap: 'contact_person_name', sortable:true
                    ,searchoptions: {
                         sopt: ["cn","nc","eq","ne","bw","ew","nu","nn"]
                     }
                },
                {name:'contact_number', index:"contact_number", jsonmap: 'contact_number', sortable:true
                    ,searchoptions: {
                         sopt: ["cn","nc","eq","ne","bw","ew","nu","nn"]
                     }
                },
                {name:'email', index:"email", jsonmap: 'email', sortable:true
                    ,searchoptions: {
                         sopt: ["cn","nc","eq","ne","bw","ew","nu","nn"]
                     }
                },
                {name:'is_live', index:"is_live", jsonmap: 'is_live', sortable:true, width:120
                     ,stype: "select"
                    ,searchoptions: {
                         sopt: ["eq","ne"],
                         value: ":[All];Activated:Activated;Deactivated:Deactivated"
                    }
                },
                {name:'actions', index:"actions", jsonmap: 'actions', sortable:false, width:80, search:false, hidden:false},
            ],
            pager: '#pager',
            viewrecords: true,
            //loadonce: true,
            rowNum:parseInt("{{ max_no_rows }}"),
            autowidth: true,
            shrinkToFit: true,
            sortname: 'created_dt',
            sortorder: "desc",
            height: '100%',
            search : {
                 caption: "Search...",
                 Find: "Find",
                 Reset: "Reset"
               },
            onSelectRow: function(id){
               
            },