jQWidgets Forums

Forum Replies Created

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts

  • vudh
    Member

    Hi Peter,

    Thanks for your help ! it works now.

    By the way, the grid doesn’t show the loading image when paging takes a long time to response. How can I show it?

    Thanks once again,
    vudh


    vudh
    Member

    Hi Peter,

    I see that the grid doesn’t scroll in mobile devices when grouping also. Could you please check this case?

    Thanks,
    vudh


    vudh
    Member

    Hi Peter,

    Thanks for your help ! It works great now.

    Best regards,
    vudh


    vudh
    Member

    Hi Peter,

    Thanks for your help ! It works great now.

    Best regards,
    vudh


    vudh
    Member

    Hi Peter,

    Thanks for your support. It works great with your sample code above.
    However, when getting data directly from the service, the grid cannot bind successfully. Now I deployed a test service for debugging, and hereafter is my test page:

    jqxGrid Demo

    $(document).ready(function () {
    var source =
    {
    datatype: ‘jsonp’,
    datafields: [{ name: ‘Navn’ }, { name: ‘Nummer’ }, { name: ‘VF_Adresse1’ }
    ],
    url: ‘http://vaf.vegasmb.com:8101/ServiceDebug/Service.svc/GetWindowGridData?method=?’,
    data: {}
    , root: ‘GetWindowGridDataResult’
    };

    var dataAdapter = new $.jqx.dataAdapter(source, {
    downloadComplete: function (data, status, xhr) { alert(status); },
    loadComplete: function (data) { alert(data.GetWindowGridDataResult); },
    loadError: function (xhr, status, error) { alert(error); }
    });
    $(“#jqxgrid”).jqxGrid(
    {
    width: 670,
    source: dataAdapter,
    columnsresize: true,
    columns: [{ text: ‘Name’, dataField: ‘Navn’, minwidth: 100, classname: ‘header’, cellclassname: ‘textcell’ }
    , { text: ‘Number’, dataField: ‘Nummer’, minwidth: 100, classname: ‘header’, cellclassname: ‘textcell’ }
    , { text: ‘Postal address.Address’, dataField: ‘VF_Adresse1’, minwidth: 100, classname: ‘header’, cellclassname: ‘textcell’ }
    ]
    });
    });

    .header
    {
    font-weight: bold;
    font-size: 14px; /*margin-top:5px;*/
    }

    .textcell
    {
    /*color:Black;*/
    }

    .numbercell
    {
    color: Red;
    }

    Could you please help me debug that case?

    Thanks in advance,
    vudh.


    vudh
    Member

    Hi Peter,

    Thanks for your prompt reply !
    I send you an example that occurs the problem:

    jqxGrid Demo

    $(document).ready(function () {
    var theme = ”;

    var data = generatedata(500);

    var source =
    {
    localdata: data,
    datatype: “array”
    };

    var dataAdapter = new $.jqx.dataAdapter(source);

    $(“#gridUp”).jqxGrid(
    {
    width: $(window).width() – 30,
    height: 400,
    columnsmenu: false,
    columnsheight: 35,
    rowsheight: 30,
    source: dataAdapter,
    theme: theme,
    //groupable: true,
    groups: [‘productname’],
    sortable: true,
    pageable: true,
    pagerheight: 35,
    pagerrenderer: function () {
    var element = $(“

    “);
    var paginginfo = $(“#gridUp”).jqxGrid(‘getpaginginformation’);
    for (i = 1; i <= paginginfo.pagescount; i++) {
    var anchor;
    if (i == 1) {
    anchor = $("”
    + “” + i + “”);
    }
    else {
    anchor = $(“”
    + “” + i + “”);
    }
    anchor.appendTo(element);
    anchor.click(function (event) {
    if ($(this).val() != ”) {
    var pagenum = parseInt($(this).val());

    $(“#gridUp”).jqxGrid(‘gotopage’, pagenum – 1);
    }
    });
    }

    return element.appendTo($(“

    “));
    },
    touchmode: true,
    pagesize: 50,
    pagesizeoptions: [’50’, ’80’, ‘100’],
    columns: [
    { text: ‘First Name’, dataField: ‘firstname’, minwidth: 100, classname: ‘header’, cellclassname: ‘textcell’},
    { text: ‘Last Name’, dataField: ‘lastname’, minwidth: 100, classname: ‘header’, cellclassname: ‘textcell’ },
    { text: ‘Product’, dataField: ‘productname’, minwidth: 100, classname: ‘header’, cellclassname: ‘textcell’}
    ],
    ready: function () {
    $(“#gridUp”).jqxGrid(‘sortby’, ‘firstname’, ‘asc’);
    }
    });

    $(“#gridDown”).jqxGrid(
    {
    width: $(window).width() – 30,
    height: 400,
    columnsmenu: false,
    columnsheight: 35,
    rowsheight: 30,
    source: dataAdapter,
    theme: theme,
    //groupable: true,
    groups: [‘productname’],
    sortable: true,
    pageable: true,
    pagerheight: 35,
    pagerrenderer: function () {
    var element = $(“

    “);
    var paginginfo = $(“#gridDown”).jqxGrid(‘getpaginginformation’);
    for (i = 1; i <= paginginfo.pagescount; i++) {
    var anchor;
    if (i == 1) {
    anchor = $("”
    + “” + i + “”);
    }
    else {
    anchor = $(“”
    + “” + i + “”);
    }
    anchor.appendTo(element);
    anchor.click(function (event) {
    if ($(this).val() != ”) {
    var pagenum = parseInt($(this).val());

    $(“#gridDown”).jqxGrid(‘gotopage’, pagenum – 1);
    }
    });
    }

    return element.appendTo($(“

    “));
    },
    touchmode: true,
    pagesize: 50,
    pagesizeoptions: [’50’, ’80’, ‘100’],
    columns: [
    { text: ‘First Name’, dataField: ‘firstname’, minwidth: 100, classname: ‘header’, cellclassname: ‘textcell’},
    { text: ‘Last Name’, dataField: ‘lastname’, minwidth: 100, classname: ‘header’, cellclassname: ‘textcell’},
    { text: ‘Product’, dataField: ‘productname’, minwidth: 100, classname: ‘header’, cellclassname: ‘textcell’},
    { text: ‘Quantity’, dataField: ‘quantity’, width: 80, cellsalign: ‘right’, classname: ‘header’, cellclassname: ‘numbercell’ }
    ],
    ready: function () {
    $(“#gridDown”).jqxGrid(‘sortby’, ‘firstname’, ‘asc’);
    }
    });
    });

    .header
    {
    font-weight: bold;
    font-size: 14px; /*margin-top:5px;*/
    }

    .textcell
    {
    }

    .numbercell
    {
    color: Red;
    }

    Grid Up

    Grid Down

    Best regards,
    vudh.

Viewing 6 posts - 1 through 6 (of 6 total)