How to load the DropDown in Jqgrid


I have tried different ways to load dropdown from my DB to jqgrid but I really do not get it, the idea is to show the dropwdown and set the selected that I bring it from my DB . Attachment captures:

In charge should load my dropdown , but does not do it if you bring the data from my DB to fill this dropdown :

To fill in the grid, bring the following data :

My code is as follows:

 var combobox_personal = $.ajax({
        success:function(data, result){
            if(!result){alert('erro ar cargar');}

   var sac_id=1;
   var csrftoken = getCookie('csrftoken');

        postData: {
            csrfmiddlewaretoken : csrftoken, 
            id_sac: sac_id,
        datatype: 'json',
        colNames: ['DETALLE<', 'PLAZO', 'RESPONSABLE', '<span class="badge bg-green">ACCIONES</span>'],
        colModel: [
                { label: 'detalle_plan_accion', name: 'detalle_plan_accion', width: 170, sorttype: "string", editable: true, edittype:"text"},
                { label: 'plazo_plan_accion ', name: 'plazo_plan_accion', width: 40, sorttype: "string", editable: true, edittype: 'text' },
                {name:'responsable_plan_accion_id',index:'responsable_plan_accion_id', width:100, editable:true, edittype: "select", formatter:'select',editoptions: { value: combobox_personal} }, 
                { name: "Acciones", formatter: buttonEliminarFormatter, width: 90, align:'center', search: false, 
                    sortable: false, hidedlg: true, resizable: false, editable: false, viewable: false
        rowNum: 10,
        height: 200,
        caption:'PLAN DE ACCION',
        shrinkToFit: true,
        pager: '#pager_plan_accion',
        cellEdit: false,
        cellsubmit: 'clientArray',
        editurl: "clientArray",

I do not know what the error is maybe a suggestion ...

asked by Diego Avila 06.07.2018 в 22:21

2 answers


I will base my answer on when I used jqgrid some time ago, and for that time they had specific formats for the creation of select option:

Your variable combobox_personal should have the following format:

Chain type:

combobox_personal = "1:Diego Avila; 2:Julia Pazmino; 3:Vinicio Coello"


Type json:

combobox_personal = { 1:'Diego Avila', 2:'Julia Pazmino', 3:'Vinicio Coello' }

Also verify that when you do editoptions: { value: combobox_personal } and combobox_personal is filled with the   information.

When you make the call to '/listadoPersonal' you can format the value that the query brings or return it with some of those formats in the query.

For example (assuming that combobox_personal is a json, if not, parse it):

var combobox_personal = [{ nombre:'Diego Avila', id:1}, {nombre:'Julia Pazmino', id:2}, {nombre:'Vinicio Coello', id:3 }];

var arr_personal = [];

for(var i in combobox_personal) {
    arr_personal.push(combobox_personal[i].id + ":" + combobox_personal[i].nombre);

combobox_personal = arr_personal.join("; ");

answered by 23.11.2018 / 14:30

you just have to change:

editoptions: {value: combobox_personal}
editoptions: {value:JSON.parse(combobox_personal)}
answered by 23.11.2018 в 15:50