Results 1 to 3 of 3

Thread: Cannot Read property 'Data' of undefined...

  1. #1

    Default Cannot Read property 'Data' of undefined...

    Team,

    Please help me out..
    I am getting Cannot Read property 'Data' of undefined.

    I have 3 grids in my Page.

    First Grid: I will list all the requirements based on Selected Phase in 3rd Grid.
    Second Grid: I would like to drag and drop from First grid to Second grid..
    Third Grid: I will list all the phases available in My Database..

    Step1: When I click on a phase1, It will list all the req's in Grid1.
    I will drag one req and keep it in Grid2.

    Step 2: Now I will click on Phase2 in 3rd Grid. It will list all the req's of Phase2 in Grid1.
    I would like to drag the req in Grid2 to Grid1 now. While dragging I am getting that error in console


    Here is my code:

    Ext.onReady(function() {
    var id='{!$CurrentPage.parameters.Id}';
    var selectedMember;
    var selectedPhase='';
    sforce.connection.sessionId = '{!$Api.Session_ID}';
    var myData = {
    records : [
    ]
    };
    var secondData = {
    records : [
    <apex:repeat value="{!backlogs}" var="b" >
    {name:"{!b.name}",effort:"{!b.Effort_Estimate__c} days", priority:"{!b.Priority__c}"},
    </apex:repeat>
    ]
    };

    // Generic fields array to use in both store defs.
    var fields = [
    {name: 'name', mapping : 'name'},
    {name: 'effort', mapping : 'effort'},
    {name: 'priority', mapping : 'priority'}
    ];

    // create the data store
    var firstGridStore = new Ext.data.JsonStore({
    fields : fields,
    data : myData,
    root : 'records',
    });

    // Column Model shortcut array
    var cols = [
    {id : 'name', header: "Requirement Name", width: 150, sortable: true, dataIndex: 'name',flex:true},
    {header: "Effort Estimated", width: 150, sortable: true, dataIndex: 'effort'},
    {header: "Priority", width: 150, sortable: true, dataIndex: 'priority'}
    ];

    // declare the source Grid
    var firstGrid = new Ext.grid.GridPanel({
    ddGroup : 'secondGridDDGroup',
    store : firstGridStore,
    columns : cols,
    enableDragDrop : true,
    collapsible : true,
    stripeRows : true,
    autoExpandColumn : 'name',
    width : 500,
    region : 'west',
    title : 'Phase',


    });

    var secondGridStore = new Ext.data.JsonStore({
    fields : fields,
    root : 'records',
    data : secondData
    });

    // create the destination Grid
    var secondGrid = new Ext.grid.GridPanel({
    ddGroup : 'firstGridDDGroup',
    store : secondGridStore,
    columns : cols,
    enableDragDrop : true,
    collapsible : true,
    stripeRows : true,
    autoExpandColumn : 'name',
    width : 500,
    region : 'center',
    title : 'Backlog',

    });

    //Simple 'border layout' panel to house both grids
    var displayPanel = new Ext.Panel({
    width : 1000,
    height : 300,
    layout : 'border',
    renderTo : 'panel1',
    items : [
    firstGrid,
    secondGrid
    ]
    });


    var blankRecord = Ext.data.Record.create(fields);
    // used to add records to the destination stores
    var blankRecord = Ext.data.Record.create(fields);
    var firstGridDropTargetEl = firstGrid.getView().el.dom.childNodes[0].childNodes[1];
    var firstGridDropTarget = new Ext.dd.DropTarget(firstGridDropTargetEl, {
    ddGroup : 'firstGridDDGroup',
    copy : true,
    notifyDrop : function(ddSource, e, data){
    // Generic function to add records.
    function addRow(record, index, allItems) {
    // Search for duplicates
    var foundItem = firstGridStore.findExact('name', record.data.name);
    alert(record.data.name);
    // if not found
    if (foundItem == -1) {
    firstGridStore.add(record);
    // Call a sort dynamically
    firstGridStore.sort('name', 'ASC');
    //Remove Record from the source
    ddSource.grid.store.remove(record);
    }

    }
    // Loop through the selections
    Ext.each(ddSource.dragData.selections ,addRow);
    return(true);
    }

    });


    // This will make sure we only drop to the view container
    var secondGridDropTargetEl = secondGrid.getView().el.dom.childNodes[0].childNodes[1];
    var destGridDropTarget = new Ext.dd.DropTarget(secondGridDropTargetEl, {
    ddGroup : 'secondGridDDGroup',
    copy : false,
    notifyDrop : function(ddSource, e, data){
    // Generic function to add records.
    function addRow(record, index, allItems) {
    var foundItem = secondGridStore.findExact('name', record.data.name);
    if (foundItem == -1) {
    secondGridStore.add(record);
    secondGridStore.sort('name', 'ASC');
    ddSource.grid.store.remove(record);
    }
    }
    // Loop through the selections
    Ext.each(ddSource.dragData.selections ,addRow);
    return(true);
    }
    });

  2. #2
    Sencha Premium User evant's Avatar
    Join Date
    Apr 2007
    Location
    Sydney, Australia
    Posts
    19,258

    Default

    1) Please format your code using the code format tags
    2) Please post in the correct forum in future, see: http://www.sencha.com/forum/showthre...-help-requests
    Twitter - @evantrimboli
    Former Sencha framework engineer, available for consulting.
    As of 2017-09-22 I am not employed by Sencha, all subsequent posts are my own and do not represent Sencha in any way.

  3. #3

    Default

    Thanks for your quick response.

    I am a newbie..

    I dont know the formatting..

Posting Permissions

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