Results 1 to 2 of 2

Thread: Extjs autoGrid sort Issue

  1. #1
    Sencha User
    Join Date
    Nov 2007
    Posts
    20
    Vote Rating
    0
      0  

    Default 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 accs , 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 - Sr Software Engineer mitchellsimoens's Avatar
    Join Date
    Mar 2007
    Location
    Gainesville, FL
    Posts
    39,412
    Vote Rating
    1287
      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 @LikelyMitch
    Sencha Inc, Senior Software Engineer
    ________________
    Learn BBCode and use it!

    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.

Tags for this Thread

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •