jQuery UI Widgets Forums Grid SortMode – Many – Error when updatebounddate

This topic contains 5 replies, has 2 voices, and was last updated by  Yavor Dashev 2 days, 10 hours ago.

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

  • jparsons_satuit
    Participant

    I have a grid with sortmode: ‘many’.
    After i sort on a column, and run ‘updatebounddata’

    $('#gridBox').jqxGrid('sortby', 'Firstname', 'asc');
    $('#gridBox').jqxGrid('updatebounddata', 'sort');

    , I receive an error in jqxgrid.sort.js (minified so i dont knwo exact line numbers) at the line:
    g.element.setAttribute(“sort”,true);
    the error is “TypeError: Cannot read property ‘setAttribute’ of undefined”

    The line before is var g=this._getcolumnbydatafield(e.dataField);

    e.dataField = ‘Contains’, even though I dont have a column datafield = ‘Contains’
    while debugging I see the line “var d=this.getsortcolumns()”
    this is returning my correct field to be sorted on, but also one called “Contains”, which is where I believe the error is coming from.


    Yavor Dashev
    Participant

    Hi jparsons_satuit,

    Thank you for contacting us!

    I have tested the grid including with sorting and updatebounddata like you do but I was unable to reproduce the issue you encounter.

    I would like to ask you for a code example which reproduces your issue in order to be able to give you a solution for it.

    Please, do not hesitate to contact us if you have any additional questions.

    Best Regards,
    Yavor Dashev
    jQWidgets team
    https://www.jqwidgets.com


    jparsons_satuit
    Participant

    Hi Yavor,
    here is a code snippet:

    source.localdata = datarows;
                var dataAdapter = new $.jqx.dataAdapter(source);
    
                objBrowseList = $('#gridBox').jqxGrid({
                    width: '100%',
                    height: '95%',
                    selectionmode: 'singlerow',
                    source: dataAdapter,
                    theme: 'satuit',
                    sortable: true,
                    sortmode: 'many',
                    columnsresize: true,
                    enabletooltips: true,
                    groupable: true,
                    groupsexpandedbydefault: true,
                    showgroupsheader: false,
                    autoshowloadelement: false,
                    columnsreorder: true,
                    columnsmenu: false,
                    pageable: false,
                    editable: true,
                    columns: gridColumns,
                    filterable: true,
                    filter: function (cellValue, rowData, dataField, filterGroup, defaultFilterResult) {
                        //Always return true - override the Client Side  filtering  because we do server side filtering
                        return true;
                    },
                    sort: function () {
                        //Always return true - override the Client Side  sorting  because we do server side sorting
                        return true;
                    },
                    showfilterrow: false,
                    //showaggregates: true,
                    //showgroupaggregates: true,
                    //showstatusbar: true,
                    //statusbarheight: 50,
                    ready: function () {
                        var sorts = eval(sessionSorts);
                        if (sorts.sort.length > 0) {
                            for (var s = 0; s < sorts.sort.length; s++) {
                                $('#gridBox').jqxGrid('sortby', sorts.sort[s].id, sorts.sort[s].direction);
                            }
                            $('#gridBox').jqxGrid('updatebounddata', 'sort');
                        }
                    }
                });

    Yavor Dashev
    Participant

    Hi jparsons_satuit,

    I have tested the code snippet that you shared but I was unable to fully reproduce the issue you encounter because I don’t know your logic in the
    eval(sessionSorts) function and the returned value from it.

    However I noticed in the $('#grid').jqxGrid('sortby', sorts.sort[s].id, sorts.sort[s].direction); sorting method if you refer to the sorts[s].id as an id it will be normal to get an error because this function accepts the dataField name as an argument instead of id.

    If my suggestion doesn’t suits you maybe you can give us a bit more context and more precisely on the eval(sessionSorts) function.

    Also I would recommend you to take a look at this demo regarding custom sorting:
    https://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/index.htm#demos/jqxgrid/customsorting.htm

    Please, do not hesitate to contact us if you have any additional questions.

    Best Regards,
    Yavor Dashev
    jQWidgets team
    https://www.jqwidgets.com


    jparsons_satuit
    Participant

    Hi Yavor,
    sessionsorts =
    ({"sort":[{"id":"pcontact.clast","order":"1","direction":"asc"}],"group":[],"dategrouptype":null,"locked":[],"filters":[],"total":{"id":"","columnIndex":-1}})
    The id is just what we call it on our end, but we are putting that value in the datafield parameter.
    As you can see there is only one sorted field – “sort”:[{“id”:”pcontact.clast”,”order”:”1″,”direction”:”asc”}]
    This sorts fine with no errors when I dont have the “sortmode:many” set. its only once we have multi sort that it is tryign to also sort on a field called “contains” which doesnt exist.
    Thank you!

    John
    Satuit Technologies


    Yavor Dashev
    Participant

    Hi John,

    Thank you for the additional information!

    Still even with the additional information I was unable to reproduce the issue you have.
    I would suggest you to check if you are using the latest jQWidgets version.

    I will also share the code example of my grid for comparison
    Note that I have used this demo for base:
    https://www.jqwidgets.com/jquery-widgets-demo/demos/jqxgrid/index.htm#demos/jqxgrid/jsarray.htm

    $("#grid").jqxGrid(
                {
                    width: '100%',
                    height: '95%',
                    selectionmode: 'singlerow',
                    source: dataAdapter,
                    sort : customsortfunc,
                    theme: 'satuit',
                    sortable: true,
                    sortmode: 'many',
                    columnsresize: true,
                    enabletooltips: true,
                    groupable: true,
                    groupsexpandedbydefault: true,
                    showgroupsheader: false,
                    autoshowloadelement: false,
                    columnsreorder: true,
                    columnsmenu: false,
                    pageable: false,
                    editable: true,
                    filterable: true,
                    showfilterrow: false,
                    filter: function (cellValue, rowData, dataField, filterGroup, defaultFilterResult) {
                        //Always return true - override the Client Side  filtering  because we do server side filtering
                        return true;
                    },
                    sort: function () {
                        return true;
                    },
                    ready: function () {
                    
                        var sorts = {"sort":[{"id":"CompanyName","order":"1","direction":"asc"}],"group":[],"dategrouptype":null,"locked":[],"filters":[],"total":{"id":"","columnIndex":-1}};
                        if (sorts.sort.length > 0) {
                            for (var s = 0; s < sorts.sort.length; s++) {
                                $('#grid').jqxGrid('sortby', sorts.sort[s].id, sorts.sort[s].direction);
                            }
                            $('#grid').jqxGrid('updatebounddata', 'sort');
                        }
                    },
                    columns: [
                      { text: 'Company Name', datafield: 'CompanyName', width: 200 },
                      { text: 'Contact Name', datafield: 'ContactName', width: 150 },
                      { text: 'Contact Title', datafield: 'Title', width: 100 },
                      { text: 'Address', datafield: 'Address', width: 100 },
                      { text: 'City', datafield: 'City', width: 100 },
                      { text: 'Country', datafield: 'Country' }
                    ]
                });
    

    If the problem still persists maybe it will be best to share a complete code example which reproduces the issue (jsfiddle for example)

    Please, do not hesitate to contact us if you have any additional questions.

    Best Regards,
    Yavor Dashev
    jQWidgets team
    https://www.jqwidgets.com

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

You must be logged in to reply to this topic.