Threaded View

  1. #1
    Ext JS Premium Member
    Join Date
    Nov 2007
    Location
    Munich
    Posts
    30
    Vote Rating
    0
    sigaref is on a distinguished road

      0  

    Question [SOLVED] Extended form in window => Shadow problem

    [SOLVED] Extended form in window => Shadow problem


    I have taken the form field extension code from someone on this forum for showing a small questionmark image with tooltip near the field label, the code is:

    Code:
    Ext.override(Ext.form.Field, {
      afterRender : function() {            
            if(this.helpText){
    
                var label = findLabel(this);
    
                if(label)
                {            	
                 	var helpImage = label.createChild({
                 			tag: 'img', 
                 			src: '/images/global/questionmark.gif',
                 			style: 'margin-bottom: 0px; margin-left: 5px; padding: 0px;'
                 		});            	
    	                	
                    Ext.QuickTips.register({
                        target:  helpImage,
                        title: '',
                        text: this.helpText,
                        enabled: true
                    });
                }
              }
              Ext.form.Field.superclass.afterRender.call(this);
              this.initEvents(); 
      }
    });
    
    var findLabel = function(field) {
        
        var wrapDiv = null;
        var label = null
    
        //find form-item and label
        wrapDiv = field.getEl().up('div.x-form-item');
        if(wrapDiv) 
        {
            label = wrapDiv.child('label');        
        }
        if(label) {
            return label;
        }    
    }
    Now I build a form with fields with helpText config set, then I put the form into a window with:

    Code:
    FormMessageBox = function(element, options)
    {
    	                dlg = new Ext.Window({
    	                    autoCreate : true,
    	                    title: options.title,
    	                    draggable: true,
    	                    resizable: options.resizable ? options.resizable : false,
    	                    constrain:true,
    	                    constrainHeader:true,
    	                    minimizable : false,
    	                    maximizable : false,
    	                    modal: true,
    	                    shim:true,
    	                    buttonAlign:"center",
    	                    width:element.width || 400,
    	                    plain:true,
    	                    maskDisabled: false,
    	                    footer:true,
    	                    closable:true
    	                });
    	     
    	    this.window = dlg;
    		this.element = element;            
    	                
    	    this.window.add(element); 
    	 
    	    if (options.createButton)
    	    {
    	    	this.window.addButton("Create", function(){ FormMessageBox.thisCallbackFunction(element, dlg, 0)});
    	    }
    	    
    	    if (options.updateButton)
    	    {
    	    	this.window.addButton("Update", function(){ FormMessageBox.thisCallbackFunction(element, dlg, 1)});
    	    }
    
    	    
    	    if (options.okButton)
    	    {
    	    	this.window.addButton("OK", function(){ FormMessageBox.thisCallbackFunction(element, dlg, 0)});
    	    }
    	    
    	    if (options.cancelButton)
    	    {
    	    	this.window.addButton("Cancel", function(){ dlg.hide() } );
    	    }
    		    
    
    	    this.window.show();    	
    }
    
    FormMessageBox.thisCallbackFunction = function(element, window, isUpdate)
        {  
        	if (element && element.callback)
        	{
        		element.callback(element, window, isUpdate);
        	}   	
        }
    The window appears, but now the shadow is to high for the window. I have tried using syncShadow, syncSize, doLayout on the window on "render", but nothing works.

    But: when I drag the window, the shadow gets recalculated and is correct "afterDrag".

    Any ideas?

    Thank you in advance for any help!
    Attached Images
    Last edited by sigaref; 28 Nov 2007 at 2:44 AM. Reason: Problem solved