Results 1 to 5 of 5

Thread: Error Msg doesnt Display in right Place :-(

  1. #1
    Sencha User
    Join Date
    Sep 2010
    Location
    Langenfeld, Germany
    Posts
    36

    Default Error Msg doesnt Display in right Place :-(

    Hi there,

    i have some Textfields with min-max length etc...

    Now i will show the Error Msg under the textbox ...

    But when i try it with msgTarget: 'under' the Error Msg is an normal windows popup ... without msgTarget: 'under' it works as popup ...
    what do i wrong ?

    Code:
    Ext.onReady(function(){
        Ext.QuickTips.init();
    
        // Create a variable to hold our EXT Form Panel.
    
        // Assign various config options as seen.
        var login = new Ext.FormPanel({
            url:'testemich',
    
            defaultType:'textfield',
            monitorValid:true,
            // Specific attributes for the text fields for username / password.
            // The "name" attribute defines the name of variables sent to the server.
    
            items:[{
                name:'loginname',
                allowBlank: false,
                minLength: 6,
                maxLength: 30,
                minLengthText: 'Login Name muss mindestens 6 Zeichen beinhalten.',
                maxLengthText: 'Login Name darf nicht lnger als 30 Zeichen sein.',
                msgTarget : 'under',
                renderTo:'field1',
                width: 200
            },{
                name:'email1',
                allowBlank:false,
                renderTo:'field3',
                width: 200
            },{
                name:'email2',
                allowBlank:false,
                renderTo:'field4',
                width: 200
    
            },{
                name:'password',
                inputType:'password',
                allowBlank:false,
                renderTo: 'field2',
                width: 200
            }],
    
            // All the magic happens after the user clicks the button
            buttons:[{
    
                text:'Register',
                formBind: true,
                renderTo: 'submitBtn',
                // Function that fires when user clicks the button
                handler:function(){
                login.getForm().submit({
    
                    method:'POST',
    
                    // Functions that fire (success or failure) when the server responds.
                    // The server would actually respond with valid JSON,
                    // something like: response.write "{ success: true}" or
    
                    // response.write "{ success: false, errors: { reason: 'Login failed. Try again.' }}"
                    // depending on the logic contained within your server script.
                    // If a success occurs, the user is notified with an alert messagebox,
    
                    // and when they click "OK", they are redirected to whatever page
                    // you define as redirect.
    
                    success:function(){
                    Ext.Msg.alert('Status', 'Login Successful!', function(btn, text){
    
                        if (btn == 'ok'){
                            window.location = 'main.action';
                        }
                    });
    
                },
    
                // Failure function, see comment above re: success and failure.
                // You can see here, if login fails, it throws a messagebox
                // at the user telling him / her as much.
    
                failure:function(form, action){
                    if(action.failureType == 'server'){
                        obj = Ext.util.JSON.decode(action.response.responseText);
    
                        Ext.Msg.alert('Login Failed!', obj.errors.reason);
                    }else{
                        Ext.Msg.alert('Warning!', 'Authentication server is unreachable : ' + action.response.responseText);
    
                    }
                    login.getForm().reset();
                }
    
                });
            }
            }]
        });
    
    });
    HTML Code

    HTML Code:
    <label id="field1-label" class="qo-abs-position" accesskey="f" for="field1"><span class="key">L</span>ogin Name</label>
        <div class="qo-abs-position" type="text" name="field1" id="field1"></div>
    
        <label id="field3-label" class="qo-abs-position" accesskey="e" for="field3"><span class="key">E</span>mail Address</label>
        <div class="qo-abs-position" type="text" name="field3" id="field3"></div>
    
        <label id="field2-label" class="qo-abs-position" accesskey="l" for="field2"><span class="key">P</span>assword</label>
        <div class="qo-abs-position" type="text" name="field2" id="field2"></div>
    
        <label id="field4-label" class="qo-abs-position" accesskey="v" for="field4"><span class="key">V</span>erify Email</label>
        <div class="qo-abs-position" type="text" name="field4" id="field4"></div>
    
        <div id="submitBtn" class="qo-submit qo-abs-position" type="image" src="resources/images/s.gif"></div>

  2. #2
    Sencha User
    Join Date
    Sep 2010
    Location
    Langenfeld, Germany
    Posts
    36

    Default

    No one an answer ? :-(

  3. #3
    Sencha User vishalnnsingh's Avatar
    Join Date
    Sep 2010
    Location
    Kolkata, India
    Posts
    115

    Default

    Why are you rendering all your items (textfields) individually, instead just render your formpanel.
    I hope it will solve your problem
    I Meet Challenge with Excitement & My Only Gossip is Love

  4. #4
    Sencha User
    Join Date
    Sep 2010
    Location
    Langenfeld, Germany
    Posts
    36

    Default

    Hi,

    because didnt want the formpanel design from extjs ...

    i would choose the Position for the textfields by myself ...

  5. #5
    Sencha User Condor's Avatar
    Join Date
    Mar 2007
    Location
    The Netherlands
    Posts
    24,246

    Default

    The error message can only display correctly if the container is position:'relative', which a FormLayout would add automatically.

    ps. There is really no need to render to existing markup. You can specify 'x' and 'y' for every field if you want a different layout!

Similar Threads

  1. "loading"-indicator doesnt show at the right place.
    By alaafu in forum Sencha Touch 1.x: Discussion
    Replies: 2
    Last Post: 17 Feb 2011, 1:28 PM
  2. doesnt display masking panel in IE8
    By psetiya in forum Ext 2.x: Help & Discussion
    Replies: 1
    Last Post: 15 Jan 2010, 12:05 AM
  3. How to do in-place change of display field in combobox
    By ESarge in forum Ext 3.x: Help & Discussion
    Replies: 1
    Last Post: 4 Jan 2010, 6:56 PM
  4. Selected value doesnt display when extending combobox
    By fshort in forum Ext 2.x: Help & Discussion
    Replies: 3
    Last Post: 30 Apr 2009, 5:41 AM

Posting Permissions

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