Announcement

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

    Form is Null

    I am creating a FormItem, which is used as a FilterEditor. The first time I click on it, everything works properly. The second time, a JavaScript error pops up stating that form is null, and the popup is empty. Any subsequent times I click on the Filter's icon, the form items have a null JsObject tied to them:
    Code:
    package com.smartgwt.client;
    
    import java.util.Date;
    
    import com.smartgwt.client.data.Criteria;
    import com.smartgwt.client.types.Alignment;
    import com.smartgwt.client.types.VerticalAlignment;
    import com.smartgwt.client.util.SC;
    import com.smartgwt.client.widgets.Window;
    import com.smartgwt.client.widgets.form.DynamicForm;
    import com.smartgwt.client.widgets.form.fields.ButtonItem;
    import com.smartgwt.client.widgets.form.fields.CanvasItem;
    import com.smartgwt.client.widgets.form.fields.DateItem;
    import com.smartgwt.client.widgets.form.fields.FormItem;
    import com.smartgwt.client.widgets.form.fields.FormItemIcon;
    import com.smartgwt.client.widgets.form.fields.events.ClickEvent;
    import com.smartgwt.client.widgets.form.fields.events.ClickHandler;
    import com.smartgwt.client.widgets.form.fields.events.IconClickEvent;
    import com.smartgwt.client.widgets.form.fields.events.IconClickHandler;
    import com.smartgwt.client.widgets.grid.ListGrid;
    
    public class DateRangeItem extends FormItem
    {
    	protected final ListGrid grid;
    	protected final String dateField;	// = "Report";
    	protected final Window popup = new Window();
    	protected final DynamicForm form = new DynamicForm();
    	protected final DateItem startDate;
    	protected final DateItem endDate;
    	protected final ButtonItem thirtyDaysButton = new ButtonItem("last30", "Last 30 Days");
    	protected final ButtonItem sixtyDaysButton = new ButtonItem("last60", "Last 60 Days");
    	protected final ButtonItem ninetyDaysButton = new ButtonItem("last90", "Last 90 Days");
    	protected final ButtonItem filterButton = new ButtonItem("addFilter", "Add Filter");
    
    	public DateRangeItem(ListGrid listGrid, String dateField)
    	{
    		super();
    		this.grid = listGrid;
    		this.dateField = dateField;
    		startDate = new DateItem("start" + dateField + "Date");
    		endDate = new DateItem("end" + dateField + "Date");
    		addIconClickHandler(new IconClickHandler()
    		{
    			public void onIconClick(IconClickEvent event)
    			{
    				selectDate();
    			}
    		});
    		FormItemIcon icon = new FormItemIcon();
    		icon.setPrompt("Select date range");
    		icon.setSrc("date_control.png");
    		setIcons(icon);
    		
            setIconHeight(18);
            setIconWidth(18);
            setIconVAlign(VerticalAlignment.CENTER);
            setShowPickerIcon(false);
    //        setPickerIconWidth(16);
    //        setPickerIconHeight(16);
    //        setPickerIconSrc("date_control.png");
    //        setShowPickerIcon(true);
    
            setTitle("Select Date Range");
    
            startDate.setDefaultValue(new Date(System.currentTimeMillis() - calcDaysInMillis(90)));	// Default to 90 days prior
            endDate.setDefaultValue(new Date());
            
            thirtyDaysButton.setEndRow(false);
            thirtyDaysButton.setAlign(Alignment.CENTER);
            thirtyDaysButton.addClickHandler(new ClickHandler()
            {
            	public void onClick(ClickEvent event)
            	{
            		startDate.setAttribute("value", new Date(System.currentTimeMillis() - calcDaysInMillis(30)));
            		endDate.setAttribute("value", new Date());
            	}
            });
            
            sixtyDaysButton.setStartRow(false);
            sixtyDaysButton.setEndRow(false);
            sixtyDaysButton.addClickHandler(new ClickHandler()
            {
            	public void onClick(ClickEvent event)
            	{
            		startDate.setValue(new Date(System.currentTimeMillis() - calcDaysInMillis(60)));
            		endDate.setValue(new Date());
            	}
            });
            
            ninetyDaysButton.setStartRow(false);
            ninetyDaysButton.addClickHandler(new ClickHandler()
            {
            	public void onClick(ClickEvent event)
            	{
            		startDate.setValue(new Date(System.currentTimeMillis() - calcDaysInMillis(90)));
            		endDate.setValue(new Date());
            	}
            });
            
            filterButton.addClickHandler(new ClickHandler()
            {
            	public void onClick(ClickEvent event)
            	{
            		Criteria criteria = grid.getFilterEditorCriteria();
            		if (criteria == null) criteria = new Criteria();
            		criteria.addCriteria(form.getValuesAsCriteria());
            		grid.invalidateCache();
            		grid.filterData(criteria);
            		popup.hide();
            	}
            });
            
            popup.setTitle("Filter on " + dateField + " Date");
            popup.setWidth(500);
            popup.setHeight(300);
            popup.centerInPage();
            popup.setIsModal(true);
            popup.addItem(form);
            
    	}
    
    	protected void selectDate()
    	{
    		form.setItems(startDate, endDate, thirtyDaysButton, new DoubleButtonItem(sixtyDaysButton, ninetyDaysButton), filterButton);
    		
    		popup.show();
    
    	}
    	
    	private long calcDaysInMillis(int days)
    	{
    		return ((long)1000 * 60 * 60 * 24 * days);
    	}
    	
    	protected class DoubleButtonItem extends CanvasItem
    	{
    		public DoubleButtonItem(ButtonItem button1, ButtonItem button2)
    		{
    			DynamicForm innerForm = new DynamicForm();
    			innerForm.setItems(button1, button2);
    			button1.setAlign(Alignment.CENTER);
    			button2.setAlign(Alignment.CENTER);
    			this.setCanvas(innerForm);
    			this.setWidth(60);
    			this.setAttribute("showTitle", false);
    		}
    	}
    	
    }
    In my main class, I call it like so:
    Code:
    ListGridField reportDateField = new ListGridField("reportDate");
    reportDateField.setFilterEditorType(new DateRangeItem(listGrid, "Report"));
    		
    listGrid.setFields(reportDateField);

    #2
    You may not want to bother troubleshooting this since similar functionality will be built-in as of 2.2. However if you do want to, always post all relevant versions (see the FAQ) and for a JavaScript error, always post the stack trace (see the FAQ).

    Comment


      #3
      Can you please provide the following:

      What will be in 2.2 -- A DateRange FormItem?
      If so, what is the ETA?

      Comment


        #4
        JavaScript stack trace (for SmartGWTEE 2.1), the second time I click on the icon:
        Code:
        14:42:25.484:INFO:Log:isc.Page is loaded
        14:53:59.031:MUP6:WARN:Log:ClassFactory.addGlobalID: ID:'isc_ButtonItem_0' for object '[ButtonItem ID:isc_ButtonItem_0 name:last60]' collides with ID of existing object '[ButtonItem ID:isc_ButtonItem_0 name:last60]'. The global reference to this object will be replaced
        14:53:59.062:MUP6:WARN:Log:ClassFactory.addGlobalID: ID:'isc_ButtonItem_1' for object '[ButtonItem ID:isc_ButtonItem_1 name:last90]' collides with ID of existing object '[ButtonItem ID:isc_ButtonItem_1 name:last90]'. The global reference to this object will be replaced
        14:53:59.203:MUP6:WARN:DynamicForm:isc_OID_3:destroyed FormItem passed to setItems()/addItem(): FormItems cannot be re-used with different DynamicForms
        14:53:59.265:MUP6:WARN:DateItem:isc_DateItem_2:setItems() called for dateItem with itemList:[SelectItem ID:isc_SelectItem_1 name:monthSelector],[SelectItem ID:isc_SelectItem_2 name:daySelector],[SelectItem ID:isc_SelectItem_3 name:yearSelector] - ignoring, and making use of default date fields
        14:53:59.265:MUP6:WARN:DynamicForm:isc_OID_3:destroyed FormItem passed to setItems()/addItem(): FormItems cannot be re-used with different DynamicForms
        14:53:59.296:MUP6:WARN:DateItem:isc_DateItem_3:setItems() called for dateItem with itemList:[SelectItem ID:isc_SelectItem_4 name:monthSelector],[SelectItem ID:isc_SelectItem_5 name:daySelector],[SelectItem ID:isc_SelectItem_6 name:yearSelector] - ignoring, and making use of default date fields
        14:53:59.296:MUP6:WARN:DynamicForm:isc_OID_3:destroyed FormItem passed to setItems()/addItem(): FormItems cannot be re-used with different DynamicForms
        14:53:59.515:MUP6:WARN:Log:Error:
        	''this.form' is null or not an object'
        	in http://localhost:8080/SmartGWTTestCase.html
        	at line 1375
            FormItem.isDisabled()
            ButtonItem.$18y()
            CanvasItem.init([ButtonItem ID:isc_ButtonItem_2 name:last30], undef, undef, undef, undef, undef, undef, undef, undef, undef, undef, undef, undef)
            Class.completeCreation(_1=>[ButtonItem ID:isc_ButtonItem_2 name:last30], _2=>undef, _3=>undef, _4=>undef, _5=>undef, _6=>undef, _7=>undef, _8=>undef, _9=>undef, _10=>undef, _11=>undef, _12=>undef, _13=>undef)
            DynamicForm.createItem(_1=>[ButtonItem ID:isc_ButtonItem_2 name:last30], _2=>"ButtonItem")
            DynamicForm.$10l(_1=>Array[5], _2=>null, _3=>true, _4=>undef)
            DynamicForm.setItems(_1=>Array[5], _2=>undef)
            DynamicForm.setFields(_1=>Array[5])
            Class.setProperties(Obj)
            Class.setProperty(_1=>"fields", _2=>Array[5])
            FormItem.$116(_1=>"_0")
            DynamicForm.handleClick(_1=>Obj, _2=>undef)
            EventHandler.bubbleEvent(_1=>[DynamicForm ID:isc_DynamicForm_0], _2=>"click", _3=>undef, _4=>undef)
            EventHandler.handleClick(_1=>[DynamicForm ID:isc_DynamicForm_0], _2=>undef)
            EventHandler.$k5(_1=>Obj{type:error}, _2=>undef)
            EventHandler.handleMouseUp(_1=>Obj{type:error}, _2=>undef)
            EventHandler.dispatch(_1=>EventHandler.handleMouseUp(), _2=>Obj{type:error})
            anonymous(event=>undef)
                "var returnVal=arguments.callee.$ch.isc.EH.dispatch(arguments.callee.$j2,event);return returnVal;"

        Comment


          #5
          So, note the warnings about destroyed FormItems. This is due to a current limitation in the setEditorType() / setFilterEditorType() API that only allows certain simple classes to be re-used (in SmartGWT).

          Yes, a date range control is what's part of 2.2. Its on by default in the FilterEditor. It has actually already landed in the nightlies if you want to try it out and given feedback.

          Comment


            #6
            I'll do that. Can you tell me the name of the class? I went through the source on the google repository, but didn't see a DateRange class (or anything that looked like one, in Form Widgets). I also went through the repository changelist, and didn't see anything there...

            Thanks.

            Comment


              #7
              It will be added to SVN later today.

              Sanjiv

              Comment


                #8
                Great -- thanks!

                What will its class name be? And will it be in the com.smartgwt.client.widgets.form.fields package?

                Comment


                  #9
                  com.smartgwt.client.widgets.form.fields.DateRangeItem

                  Comment


                    #10
                    Hi, Sanjiv. What classes are related to this, other than DateRangeItem and DateRange? The reason I'm asking is because I don't see a DateRangeItem.js...

                    Thanks.
                    Last edited by KenS; 25 Apr 2010, 16:08.

                    Comment


                      #11
                      This is why I was asking -- it doesn't seem to work for me. I am using the latest nightly build (with your DateRangeItem class, not mine!). Here is my code:
                      Code:
                      final ListGrid listGrid = new ListGrid();
                      listGrid.setWidth100();
                      listGrid.setHeight100();
                      listGrid.setDataSource(dataSource);
                      listGrid.setShowFilterEditor(true);
                      listGrid.setUseAllDataSourceFields(true);
                      
                      ListGridField reportDateField = new ListGridField("reportDate");
                      reportDateField.setFilterEditorType(new DateRangeItem());
                      
                      listGrid.setFields(reportDateField);
                      
                      listGrid.draw();
                      And here is the JS stack trace:
                      Code:
                      20:14:40.767:WARN:Log:Error:
                      	''undefined' is null or not an object'
                      	in http://localhost:8080/SmartGWTTestCase.html
                      	at line 442
                          DynamicForm.setItemValues(_1=>Obj, _2=>false, _3=>true, _4=>Array[4])
                          DynamicForm.$10l(_1=>Array[4], _2=>null, _3=>true, _4=>undef)
                          DynamicForm.setItems(_1=>Array[4], _2=>undef)
                          GridBody.draw(_1=>undef, _2=>undef, _3=>undef, _4=>undef)
                          Canvas.drawChildren()
                          Canvas.draw(_1=>undef, undef, undef, undef, undef, undef, undef, undef)
                          Class.invokeSuper(_1=>[Class ListGrid], _2=>"draw", _3=>undef, _4=>undef, _5=>undef, _6=>undef, _7=>undef, _8=>undef, _9=>undef, _10=>undef)
                          ListGrid.draw(_1=>undef, _2=>undef, _3=>undef, _4=>undef)
                          ** recursed on Class.invokeSuper

                      Comment


                        #12
                        We're looking at this.

                        Comment


                          #13
                          There's a usage error here: in the FilterEditor, which is quite a small space, you want to use the MiniDateRangeItem, which is just a trivial formItem that shows an icon for popping up a dialog to edit a date range.

                          Comment


                            #14
                            I changed it to "new MiniDateRangeItem()" and got the following JS error:
                            Code:
                            14:21:26.015:WARN:DynamicForm:isc_DynamicForm_0:Problem initializing item: {width: 80,
                            record: null,
                            rowNum: 0,
                            colNum: 2,
                            name: "reportDate",
                            valueMap: undef,
                            valueIcons: undef,
                            imageURLPrefix: undef,
                            imageURLSuffix: undef,
                            baseURL: undef,
                            imgDir: undef,
                            textAlign: "right",
                            valueIconLeftPadding: 2,
                            valueIconRightPadding: 2,
                            autoCompleteCandidates: undef,
                            uniqueMatch: undef,
                            containerWidget: [GridBody ID:isc_OID_0filterEditor_body],
                            grid: [RecordEditor ID:isc_OID_0filterEditor],
                            handleChanged: [o]DateItem.handleChanged(),
                            keyDown: anonymous(),
                            inactiveEditorMouseDown: anonymous(),
                            editorType: "MiniDateRangeItem",
                            elementFocus: [o]DateItem.elementFocus(),
                            canTabToIcons: false,
                            focusInItem: [o]DateItem.focusInItem(),
                            height: 22,
                            allowEmptyValue: true,
                            actOnKeypress: undef,
                            changed: [a]DateItem.changed(),
                            } - derived FormItem class is: MiniDateRangeItem.  Please make sure the relevant module is loaded
                            14:21:26.125:WARN:Log:Error:
                            	''undefined' is null or not an object'
                            	in http://localhost:8080/SmartGWTTestCase.html
                            	at line 442
                                DynamicForm.setItemValues(_1=>Obj, _2=>false, _3=>true, _4=>Array[4])
                                DynamicForm.$10l(_1=>Array[4], _2=>null, _3=>true, _4=>undef)
                                DynamicForm.setItems(_1=>Array[4], _2=>undef)
                                GridBody.draw(_1=>undef, _2=>undef, _3=>undef, _4=>undef)
                                Canvas.drawChildren()
                                Canvas.draw(_1=>undef, undef, undef, undef, undef, undef, undef, undef)
                                Class.invokeSuper(_1=>[Class ListGrid], _2=>"draw", _3=>undef, _4=>undef, _5=>undef, _6=>undef, _7=>undef, _8=>undef, _9=>undef, _10=>undef)
                                ListGrid.draw(_1=>undef, _2=>undef, _3=>undef, _4=>undef)
                                ** recursed on Class.invokeSuper

                            Comment


                              #15
                              That indicates that you updated in the midst of us updating SVN. Try out the latest now.

                              Comment

                              Working...
                              X