edotom

Forum Replies Created

Viewing 3 replies - 1 through 3 (of 3 total)
  • Author
    Replies
  • in reply to: Pager not displaying pages and totals #92233
    edotom
    Participant

    I had a similar problem recently, my pager showed all buttons but navigation ones.  My jqgrid had only three fields.  After going nuts for a couple of days and changing everything several times, I found that jqgrid needs to have at least a minimum width to show all buttons.  Apparently a number between 600 and 800 is good. It worked for me but I couldn´t find on documentation if there is a minimum width for grid or if pager can have a width on it.  I would like to have a word of advice from trirand support.

     

    regards

     

    edgar

    in reply to: Problem with jqgrid subgrid #95402
    edotom
    Participant

    never mind … I figured out how to do it.. as height equals 100% didn’t work I just set ‘auto’ and it worked like a charm.  

    regards

    in reply to: Problem with jqgrid subgrid #95400
    edotom
    Participant

    Hi 

    I got it thanks to your help and other forum topics I found on your valuable site. But there is a problem.  My design includes a pager on subgrid that should also allow edit and add rows. The basics work ok, but when I expand a row on main grid then the pager of main row does not move to what its new position should be, for example, the main grid has ten rows and the pager appears after tenth row.  When I click on any row to see correspondant subgrid, all rows in main grid move but main pager does not staying in the middle of the page. In any case I’m pasting the code as it’s working now:

     

    $(document).ready(function () {
    jQuery(“#grdParam”).jqGrid
    (
    {
    url: ‘JqGridTest2.aspx/GetDataTableGroup’,
    datatype: ‘json’,
    //inicio
    ajaxGridOptions:
    {
    contentType: “application/json”,
    success: function (data, textStatus) {
    if (textStatus == “success”) {
    var thegrid = $(“#grdParam”)[0];
    thegrid.addJSONData(data.d);
    thegrid.grid.hDiv.loading = false;
    switch (thegrid.p.loadui) {
    case “disable”:
    break;
    case “enable”:
    $(“#load_” + thegrid.p.id).hide();
    break;
    case “block”:
    $(“#lui_” + thegrid.p.id).hide();
    $(“#load_” + thegrid.p.id).hide();
    break;
    }
    }
    }
    },

    //fin
    mtype: ‘POST’,
    height: 250,
    colNames: ,
    colModel: [
    {
    name: ‘GroupID’,
    index: ‘GroupID’,
    width: 40,
    editable: true,
    editoptions:
    {
    readonly: true,
    size: 10
    },
    editrules:
    {
    edithidden: true
    }
    },
    {
    name: ‘SubGroup’,
    index: ‘SubGroup’,
    width: 40,
    editable: true,
    editoptions: {
    readonly: true,
    size: 10
    },
    align: “left”,
    size: 100,
    editrules: { edithidden: true }
    },
    {
    name: ‘ParameterName’,
    index: ‘ParameterName’,
    width: 100,
    align: “left”,
    editable: true,
    size: 100
    },
    {
    name: ‘Value’,
    index: ‘Value’,
    width: 100,
    align: “left”,
    editable: true,
    size: 100
    },
    {
    name: ‘Value2’,
    index: ‘Value2’,
    width: 100,
    align: “left”,
    editable: true,
    size: 100
    },
    {
    name: ‘UserInsert’,
    index: ‘UserInsert’,
    width: 100,
    align: “left”,
    editable: false,
    size: 100
    },
    {
    name: ‘InsertDate’,
    index: ‘InsertDate’,
    width: 100,
    align: “left”,
    editable: false,
    size: 100,
    sorttype: ‘date’,
    datefmt: ‘Y-m-d’
    },
    {
    name: ‘UserUpdate’,
    index: ‘UserUpdate’,
    width: 100,
    align: “left”,
    editable: false,
    size: 100
    },
    {
    name: ‘UpdateDate’,
    index: ‘UpdateDate’,
    width: 100,
    align: “left”,
    editable: false,
    size: 100,
    sorttype: ‘date’,
    datefmt: ‘yyyy-mm-dd’
    },
    {
    name: ‘Active’,
    index: ‘Active’,
    width: 100,
    align: “left”,
    edittype: “checkbox”,
    editable: true,
    size: 100
    }
    ],
    pager: ‘#pager’,
    rowNum: 10,
    rowList: [10, 20, 30],
    sortname: ‘GroupID’,
    sortorder: ‘asc’,
    subGrid: true,
    subGridRowExpanded: function (subgrid_id, row_id) {
    var subgrid_table_id;
    subgrid_table_id = subgrid_id + “_t”;
    var pager_id;
    pager_id = “p_” + subgrid_table_id;
    jQuery(“#” + subgrid_id).html(“

    “);
    jQuery(“#” + subgrid_table_id).jqGrid(
    {
    url: ‘JqGridTest2.aspx/GetDataTableSubGroup’,
    data: “{‘pPageSize’:'” + $(“#” + subgrid_table_id).getGridParam(“rowNum”) +
    “‘,’pCurrentPage’:'” + $(“#” + subgrid_table_id).getGridParam(“page”) +
    “‘,’pSortColumn’:'” + $(“#” + subgrid_table_id).getGridParam(“sortname”) +
    “‘,’pSortOrder’:'” + $(“#” + subgrid_table_id).getGridParam(“sortorder”) + “‘}”, //PageMethod Parametros de entrada
    postData:
    {
    GroupID: row_id
    },
    datatype: ‘json’,
    mtype: ‘POST’,
    ajaxGridOptions:
    {
    contentType: “application/json”,
    success: function (data, textStatus) {
    if (textStatus == “success”) {
    var thegrid = $(“#” + subgrid_table_id)[0];
    thegrid.addJSONData(data.d);
    thegrid.grid.hDiv.loading = false;
    switch (thegrid.p.loadui) {
    case “disable”:
    break;
    case “enable”:
    $(“#load_” + thegrid.p.id).hide();
    break;
    case “block”:
    $(“#lui_” + thegrid.p.id).hide();
    $(“#load_” + thegrid.p.id).hide();
    break;
    }
    }
    }
    },
    height: 150,
    colNames:
    [
    ‘Grupo’,
    ‘Sub Grupo’,
    ‘Nombre’,
    ‘Valor 1’,
    ‘Valor 2’,
    ‘Usuario Insercion’,
    ‘Fecha Insercion’,
    ‘Usuario Actualizacion’,
    ‘Fecha Actualizacion’,
    ‘Active’
    ],
    colModel:
    [
    {
    name: ‘GroupID’,
    index: ‘GroupID’,
    width: 40,
    editable: true,
    editoptions:
    {
    readonly: true,
    size: 10
    },
    editrules: { edithidden: true }
    },
    {
    name: ‘SubGroup’,
    index: ‘SubGroup’,
    width: 40,
    editable: true,
    editoptions:
    {
    readonly: true,
    size: 10
    },
    align: “left”,
    size: 100,
    editrules: { edithidden: true }
    },
    {
    name: ‘ParameterName’,
    index: ‘ParameterName’,
    width: 100,
    align: “left”,
    editable: true,
    size: 100
    },
    {
    name: ‘Value’,
    index: ‘Value’,
    width: 100,
    align: “left”,
    editable: true,
    size: 100
    },
    {
    name: ‘Value2’,
    index: ‘Value2’,
    width: 100,
    align: “left”,
    editable: true,
    size: 100
    },
    {
    name: ‘UserInsert’,
    index: ‘UserInsert’,
    width: 100,
    align: “left”,
    editable: false,
    size: 100
    },
    {
    name: ‘InsertDate’,
    index: ‘InsertDate’,
    width: 100,
    align: “left”,
    editable: false,
    size: 100,
    sorttype: ‘date’,
    datefmt: ‘Y-m-d’
    },
    {
    name: ‘UserUpdate’,
    index: ‘UserUpdate’,
    width: 100,
    align: “left”,
    editable: false,
    size: 100
    },
    {
    name: ‘UpdateDate’,
    index: ‘UpdateDate’,
    width: 100,
    align: “left”,
    editable: false,
    size: 100,
    sorttype: ‘date’,
    datefmt: ‘yyyy-mm-dd’
    },
    {
    name: ‘Active’,
    index: ‘Active’,
    width: 100,
    align: “left”,
    edittype: “checkbox”,
    editable: true,
    size: 100
    }
    ],
    pager: pager_id,
    sortname: ‘GroupID’,
    sortorder: ‘asc’,
    multiboxonly: false,
    viewrecords: true,
    imgpath: ‘JQGridReq/images’,
    contentType: “application/json; charset=utf-8”,
    serializeGridData: function (data) {
    return $.toJSON(data);
    }
    }).navGrid(“#” + pager_id,
    {
    edit: true,
    add: true,
    del: true
    },
    {
    url: “JqGridTest2.aspx/EditData”,
    closeAfterEdit: true
    },
    {
    url: “JqGridTest2.aspx/EditData”,
    closeAfterAdd: true,
    beforeShowForm: function (formid) {
    //jQuery(“#ParameterName”).focus();
    //$(“#ParameterName”).focus();
    jQuery(“#GroupID”).val(“AUTOMATIC VALUE”);
    jQuery(“#SubGroup”).val(“0”);
    },
    afterShowForm: function (formid) {
    $(“#ParameterName”).focus();
    }
    },
    {
    url: “JqGridTest2.aspx/DeleteData”
    })
    },
    multiboxonly: false,
    viewrecords: true,
    imgpath: ‘JQGridReq/images’,
    serializeGridData: function (data) {
    return $.toJSON(data);
    }
    }
    ).navGrid(“#pager”,
    {
    edit: true,
    add: true,
    search: true,
    del: true
    },
    {
    url: “JqGridTest2.aspx/EditData”,
    closeAfterEdit: true
    },
    {
    url: “JqGridTest2.aspx/EditData”,
    closeAfterAdd: true,
    beforeShowForm: function (formid) {
    jQuery(“#GroupID”).val(“AUTOMATIC VALUE”);
    jQuery(“#SubGroup”).val(“0”);
    },
    afterShowForm: function (formid) {
    $(“#ParameterName”).focus();
    }
    },
    {
    url: “JqGridTest2.aspx/DeleteData”
    }
    );
    });
    jQuery.extend(jQuery.jgrid.edit, {
    ajaxEditOptions: { contentType: “application/json” },
    recreateForm: true,
    serializeEditData: function (postData) {
    return JSON.stringify(postData);
    }
    });

     

     

    Could you please give me a hint?

     

    regards

Viewing 3 replies - 1 through 3 (of 3 total)

Stay connected with us in your favorite flavor!