Announcement

Collapse
No announcement yet.
X
  • Filter
  • Time
Clear All
new posts

    Drag/Drop from Tilegrid to Tilegrid with different datasource gives JS-error

    Hello,

    I am using (SC_SNAPSHOT-2011-03-15/PowerEdition Deployment 2011-03-15), with FireFox 3.6.16.

    I want to do the following, as described in the code below. Two tile grids, one with a Datasource "Pattern", and one with DataSource "Flavour_hasPatterns_Pattern", which look like below:

    Pattern.ds.xml
    Code:
    <?xml version="1.0" encoding="UTF-8"?>
    <DataSource ID="Pattern" serverType="sql" tableName="Pattern" requiresAuthentication="true"> 
      <fields> 
        <field name="Pattern_id" type="sequence" primaryKey="true"/>  
        <field name="patternName" title="patternName" type="text" required="false" length="128"> 
          <validators></validators> 
        </field>  
        <field name="fileName" title="fileName" type="image" required="false"> 
          <validators></validators> 
        </field>  
      </fields>  
      <operationBindings> 
        <operationBinding operationType="add" requiresAuthentication="true" requiresRole="CAN_CREATE_PATTERN"> 
        </operationBinding>  
        <operationBinding operationType="fetch" requiresAuthentication="true" requiresRole="CAN_READ_PATTERN"> 
        </operationBinding>  
        <operationBinding operationType="update" requiresAuthentication="true" requiresRole="CAN_UPDATE_PATTERN"> 
        </operationBinding>  
        <operationBinding operationType="remove" requiresAuthentication="true" requiresRole="CAN_DELETE_PATTERN"> 
        </operationBinding> 
      </operationBindings> 
    </DataSource>
    Flavour_hasPatterns_Pattern.ds.xml
    Code:
    <?xml version="1.0" encoding="UTF-8"?>
    <DataSource ID="Flavour_hasPatterns_Pattern" serverType="sql" tableName="Flavour_hasPatterns_Pattern" requiresRole="ROLE_USER" requiresAuthentication="true"> 
      <fields> 
        <field name="hasPatterns_id" type="sequence" primaryKey="true"/>  
        <field name="Flavour_id" type="integer" foreignKey="Flavour.Flavour_id"/>  
        <field name="Pattern_id" type="integer" foreignKey="Pattern.Pattern_id"/>  
        <field name="patternName" type="text" tableName="Pattern" customSQL="true"/> 
        <field name="fileName" type="image" tableName="Pattern" customSQL="true"/>
      </fields>  
      <operationBindings> 
        <operationBinding operationType="fetch" customValueFields="patternName" customCriteriaFields="patternName"> 
          <tableClause>Flavour_hasPatterns_Pattern, Pattern</tableClause>  
          <whereClause>Flavour_hasPatterns_Pattern.Pattern_id = Pattern.Pattern_id AND ($defaultWhereClause)</whereClause> 
        </operationBinding> 
      </operationBindings> 
    </DataSource>
    I want to drag from a tilegrid with DataSource Pattern to the tile grid with DataSource Flavour_hasPatterns_Pattern. Since there is a foreign key between the two, I assume this is possible (yet i'm not sure, is it?)

    My widget that does this looks as follows:
    Code:
    public class PatternEditorWidget extends VLayout {
    	
    	private Record record;
    	
    	private DataSource patternDs = DataSource.get("Pattern");
    	private DataSource flavourToPatternDs = DataSource.get("Flavour_hasPatterns_Pattern");
    	private PatternTileGrid tiles = new PatternTileGrid();
    	private TargetTileGrid target = new TargetTileGrid();
    	private static final int TILE_HEIGHT = 150;
    	private static final int TILE_WIDTH  = 100;
    	
    	public PatternEditorWidget(Record rec){
    		this.record=rec;
    		init();
    		addMember(tiles);
    		addMember(target);
    	}
    	
    	public void init(){
    		setWidth100();
    		setHeight100();
    		setOverflow(Overflow.SCROLL);
    	}
    	
    	protected class PatternTileGrid extends TileGrid{
    		public PatternTileGrid(){
    			setWidth100();
    		    setTileWidth(TILE_WIDTH);
    		    setTileHeight(TILE_HEIGHT);
    
    		    setOverflow(Overflow.SCROLL);
    			setShowAllRecords(true);
    			setDataSource(patternDs);
    		    setAutoFetchData(true);
    		    DetailViewerField pictureField = new DetailViewerField("fileName");
    		    pictureField.setImageURLPrefix("../uploads/Pattern/");  
    		    pictureField.setImageWidth(87);  
    		    pictureField.setImageHeight(133);  
    		    setCanDrag(true); 
    		    setCanDrop(true);
    		    setCanDragReposition(true);
    		    setDragDataAction(DragDataAction.COPY);
    		    setFields( pictureField, new DetailViewerField("patternName"));
    		}
    
    	
    	}
    	
    	/**
    	 * Window where patterns can be dragged in, and dragged out. In goes via COPY, out goes via CUT. 
    	 * This way, the user can easily select two patterns it wants to use.
    	 *
    	 */
    	protected class TargetTileGrid extends TileGrid {
    		public TargetTileGrid(){
    			setWidth100();
    			setDataSource(flavourToPatternDs);
    			setCanAcceptDrop(true);
    			setCanDrag(true);
    			setCanDrop(true);
    			setCanDragReposition(true);
    		    DetailViewerField pictureField = new DetailViewerField("fileName");
     
    		    pictureField.setImageWidth(TILE_WIDTH);  
    		    pictureField.setImageHeight(TILE_HEIGHT); 
    			setFields(pictureField, new DetailViewerField("patternName"));
    		}
    
    	}
    }
    When I drop something from the source to the target, the following error is thrown:

    Code:
    14:22:31.743 [ERROR] [generatedcode] 14:22:31.742:MUP4:WARN:Log:TypeError: this.data is undefined
        TileGrid.drop(event=&gt;{Obj}, eventInfo=&gt;undef) @ generatedcode/sc/modules/ISC_Grids.js:3439
        Canvas.handleDrop(_1=&gt;{Obj},  _2=&gt;undef) @ generatedcode/sc/modules/ISC_Core.js:3128
        [c]EventHandler.bubbleEvent(_1=&gt;{Obj},  _2=&gt;&quot;drop&quot;,  _3=&gt;undef) @ generatedcode/sc/modules/ISC_Core.js:1571
        [c]EventHandler.handleEvent(_1=&gt;{Obj},  _2=&gt;&quot;drop&quot;) @ generatedcode/sc/modules/ISC_Core.js:1300
        [c]EventHandler.handleDragStop() @ generatedcode/sc/modules/ISC_Core.js:1505
        EventHandler._handleMouseUp([object MouseEvent], undef) @ generatedcode/sc/modules/ISC_Core.js:1401
        [c]EventHandler.handleMouseUp(_1=&gt;[object MouseEvent]) @ generatedcode/sc/modules/ISC_Core.js:1397
        [c]EventHandler.dispatch(_1=&gt;isc_c_EventHandler_handleMouseUp,  _2=&gt;[object MouseEvent]) @ generatedcode/sc/modules/ISC_Core.js:1634
        anonymous([object MouseEvent]) @ generatedcode/sc/modules/ISC_Core.js:61
        unnamed() @ 
    
    
    com.smartgwt.client.core.JsObject$SGWT_WARN: 14:22:31.742:MUP4:WARN:Log:TypeError: this.data is undefined
        TileGrid.drop(event=&gt;{Obj}, eventInfo=&gt;undef) @ generatedcode/sc/modules/ISC_Grids.js:3439
        Canvas.handleDrop(_1=&gt;{Obj},  _2=&gt;undef) @ generatedcode/sc/modules/ISC_Core.js:3128
        [c]EventHandler.bubbleEvent(_1=&gt;{Obj},  _2=&gt;&quot;drop&quot;,  _3=&gt;undef) @ generatedcode/sc/modules/ISC_Core.js:1571
        [c]EventHandler.handleEvent(_1=&gt;{Obj},  _2=&gt;&quot;drop&quot;) @ generatedcode/sc/modules/ISC_Core.js:1300
        [c]EventHandler.handleDragStop() @ generatedcode/sc/modules/ISC_Core.js:1505
        EventHandler._handleMouseUp([object MouseEvent], undef) @ generatedcode/sc/modules/ISC_Core.js:1401
        [c]EventHandler.handleMouseUp(_1=&gt;[object MouseEvent]) @ generatedcode/sc/modules/ISC_Core.js:1397
        [c]EventHandler.dispatch(_1=&gt;isc_c_EventHandler_handleMouseUp,  _2=&gt;[object MouseEvent]) @ generatedcode/sc/modules/ISC_Core.js:1634
        anonymous([object MouseEvent]) @ generatedcode/sc/modules/ISC_Core.js:61
        unnamed() @ 
    
        at sun.reflect.NativeConstructorAccessorImpl.newInstance0(Native Method)
        at sun.reflect.NativeConstructorAccessorImpl.newInstance(NativeConstructorAccessorImpl.java:39)
        at sun.reflect.DelegatingConstructorAccessorImpl.newInstance(DelegatingConstructorAccessorImpl.java:27)
        at java.lang.reflect.Constructor.newInstance(Constructor.java:513)
        at com.google.gwt.dev.shell.MethodAdaptor.invoke(MethodAdaptor.java:105)
        at com.google.gwt.dev.shell.MethodDispatch.invoke(MethodDispatch.java:71)
        at com.google.gwt.dev.shell.OophmSessionHandler.invoke(OophmSessionHandler.java:157)
        at com.google.gwt.dev.shell.BrowserChannelServer.reactToMessages(BrowserChannelServer.java:281)
        at com.google.gwt.dev.shell.BrowserChannelServer.processConnection(BrowserChannelServer.java:531)
        at com.google.gwt.dev.shell.BrowserChannelServer.run(BrowserChannelServer.java:352)
        at java.lang.Thread.run(Thread.java:680)
    The question is: am I doing something wrong, or am I too ambitious? Any pointer to a solution would be greatly appreciated!

    #2
    This should be fine - the error you're getting suggests that the TileGrid does not have a dataset. You set autoFetchData - did you see a request for data, and did it succeed and return valid data?

    Comment


      #3
      Actually no, this is what the console says when I do the drag/drop:

      Code:
      Uncaught JavaScript exception [this.data is undefined] in http://127.0.0.1:8888/generatedcode/sc/modules/ISC_Grids.js, line 3439
      So I don't see the typical DSRequest being made...

      Comment


        #4
        The question is about the dsRequest when the TileGrid is first created and does its initial fetch (via autoFetchData).

        Comment


          #5
          Aha, i know what causes this. The target grid didn't have setAutoFetchData(true). Adding this solved the error.

          EDIT
          Sorry, a second too late. Thanks for pointing this out.

          Comment

          Working...
          X