1. #1
    Sencha User
    Join Date
    Nov 2007
    Posts
    20
    Vote Rating
    0
    barmat.ali is on a distinguished road

      0  

    Default Extjs autoGrid sort Issue

    Extjs autoGrid sort Issue


    I'm Using Extjs 3.4

    I have created an Extjs grid, that build It self according to some meta data recieved from the server side.

    this 'autoGrid' is build on an 'autoStore' like this :

    grid :
    function autoGrid(response, panel, node) {
    var jsonData = Ext.util.JSON.decode(response[0]);
    var grid = Ext.getCmp('contentGrid_' + panel.title);
    if (grid) {
    grid.destroy();
    }
    var gridStoreFields = [],
    sizeColumnAvailable = false,
    gridPagingToolBar, gridPagerInfo,
    gridItemsInfo,
    gridDropTarget = null,
    readerFields = [],
    gridColumns = [],
    gridFilters;
    try {
    gridColumns.push(new Ext.grid.RowNumberer({ width: 30 }));
    for (var i = 0; i < jsonData.length; i++) {
    var field = { name: jsonData[i].name, type: jsonData[i].type };
    var header = { name: jsonData[i].name, dataIndex: jsonData[i].name, type: jsonData[i].type, header: jsonData[i].header, sortable: jsonData[i].sortable };
    gridStoreFields.push(field);
    gridColumns.push(header);
    readerFields.push(jsonData[i].name);
    }
    } catch (e) {
    ProcessScriptError(e);
    }
    var store = autoGridStore(gridStoreFields, readerFields, selectedNode);
    grid = new Ext.grid.GridPanel({
    defaults: { sortable: true },
    id: 'contentGrid_' + panel.targetEntity,
    store: store,
    columns: gridColumns,
    frame: true,
    loadMask: true,
    remoteSort: true,
    width: 700,
    height: 450,
    bbar: new Ext.PagingToolbar({
    id: 'contentGrid_' + panel.title + '_PagingToolbar',
    pageSize: 20,//commonParameters.User.Preferences.LinesPerPage,
    store: store,
    displayInfo: true,
    totalProperty: "totalCount",
    displayMsg: commonParameters.Labels.Lbl_Element_Afficher + ' {0} - {1}' + ' ' + commonParameters.Labels.Lbl_De + ' ' + '{2}',
    emptyMsg: commonParameters.Labels.Msg_Empty
    }),
    listeners: {
    rowdblclick: function (grid, row, _object) {
    // si l'utilisateur a accès , ouverture au double clic
    // if(getTraitementWebAfficher(1))
    //{
    var record = grid.getStore().getAt(row);
    if (record != null)
    Edit(record.data.Id);
    else
    Ext.MessageBox.alert(commonParameters.Labels.Msg_Error, commonParameters.Labels.Msg_Probleme);
    // }
    },
    rowcontextmenu: initGridContextMenu
    }
    });
    grid.store.load({
    params: {
    start: 0,
    limit: 2,//commonParameters.User.cdus_nb_ligne_par_page,
    sort: grid.store.sortInfo.field,
    dir: grid.store.sortInfo.direction,
    'action': 'search',
    targetEntity:grid.store.targetEntity
    }
    });
    grid.store.on('load', function (store, records, options) {
    // store successufully loaded => hide loading window...
    commonParameters.globalLoadMask.hide();
    });
    panel.add(grid);
    panel.doLayout();
    }
    Store :

    function autoGridStore(gridStoreFields, readerFields) {
    var autoGridStoreReader = new Ext.data.JsonReader({
    totalProperty: "totalCount", // The property which contains the number of returned records (optional)
    root: "records", // The property which contains an Array of record objects
    id: "Id" // The property within the record object that provides an ID for the record (optional)
    }, readerFields);
    var autoGridStore = new Ext.data.Store({fields : gridStoreFields, url: selectedNode.attributes.nodeUrl, targetEntity: selectedNode.attributes.targetEntity });
    autoGridStore.remoteSort = true;
    autoGridStore.idProperty = 'Id';
    autoGridStore.totalProperty = 'totalCount';
    autoGridStore.successProperty = 'success';
    autoGridStore.sortInfo = { field: "Id", direction: "ASC" };
    if (autoGridStore.getSortState()) {
    autoGridStore.sortInfo = { field: autoGridStore.getSortState().field, direction: autoGridStore.getSortState().direction };
    }
    autoGridStore.reader = autoGridStoreReader;
    return autoGridStore;
    }

    Every thing is Ok, My data is well retrieved, well rendered on grid.
    The problem is that when I tried to make a sort ( remoteSort ), There is an error on the sort Direction, I got this Ext error :

    singleSort: function (fieldName, dir) {
    var field = this.fields.get(fieldName);
    if (!field) {
    return false;
    }

    var name = field.name,
    sortInfo = this.sortInfo || null,
    sortToggle = this.sortToggle ? this.sortToggle[name] : null;

    if (!dir) {
    if (sortInfo && sortInfo.field == name) {
    dir = (this.sortToggle[name] || 'ASC').toggle('ASC', 'DESC');
    } else {
    dir = field.sortDir;
    }
    }

    the fieldName is well retrieved, but the sort direction is empty.

    It seems that my store is also considered as an object and not a Ext.Json.Store because when I debug I have this :

    var field = this.fields.get(fieldName); => this.fields doesn't contain a definition for get ...


    Any idea please ?

  2. #2
    Sencha - Senior Forum Manager mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    37,330
    Vote Rating
    846
    mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute mitchellsimoens has a reputation beyond repute

      0  

    Default


    I'm little lost if everything you are speaking. Did you inspect the store to make sure it got the fields on it? Also, a class is just an object really, typeof reports object.
    Mitchell Simoens @SenchaMitch
    Sencha Inc, Senior Forum Manager
    ________________
    Check out my GitHub, lots of nice things for Ext JS 4 and Sencha Touch 2
    https://github.com/mitchellsimoens

    Think my support is good? Get more personalized support via a support subscription. https://www.sencha.com/store/

    Need more help with your app? Hire Sencha Services services@sencha.com

    Want to learn Sencha Touch 2? Check out Sencha Touch in Action that is in print!

    When posting code, please use BBCode's CODE tags.

Thread Participants: 1

Tags for this Thread