1. #1
    Sencha User
    Join Date
    Sep 2011
    Posts
    64
    Answers
    2
    Vote Rating
    0
    punith.mailme is on a distinguished road

      0  

    Default Answered: Error Tooltip for Gridpanel

    Answered: Error Tooltip for Gridpanel


    Hi Guys,

    I have a gridpanel and want to show a errortooltip on mouse hover as we see for textfields and combobox.
    Is there any inbuilt component to show this error styled tooltip for grid panel.

    errorTooltip.GIF

  2. Code:
    renderer: function(value, metaData, record){
        if(/* record has error */){
            metaData.tdCls += " x-form-invalid-field";  // Squiggly red lines
            metaData.tdAttr = "data-errorqtip='This is my error message!'";
        }
        return value;
    }
    this worked.

  3. #2
    Touch Premium Member
    Join Date
    Jun 2011
    Posts
    1,099
    Answers
    113
    Vote Rating
    96
    Farish is a glorious beacon of light Farish is a glorious beacon of light Farish is a glorious beacon of light Farish is a glorious beacon of light Farish is a glorious beacon of light

      0  

    Default


    If you are asking for showing an error tooltip when a validation fails, you can use vtype config in grid column editor:

    Code:
    columns: 
            [
                {header: 'Phonenumber',  dataIndex: 'phonenumber', flex:1,  
                    editor: {
                        xtype:'textfield',
                        allowBlank:false,
                        vtype: 'integer'  // custom validation type which you can create using regular expressions
                    }
                }
            ]
    Add the following custom validation type 'integer' in the beginning of your code (onReady function)
    Code:
    var integerTest = /^\d+$/;
    Ext.apply(Ext.form.field.VTypes, {
        integer: function(val, field) {
            return integerTest.test(val);
        },
        integerText: 'Must be an integer.' // vtype Text property: The error text to display when the validation function returns false
    });

  4. #3
    Sencha User
    Join Date
    Sep 2011
    Posts
    64
    Answers
    2
    Vote Rating
    0
    punith.mailme is on a distinguished road

      0  

    Default


    I was not more presize in my previous mail.. appolosies for that.

    Now i have to validate the count of gridpanel to be between 1-15, ie.., 0 and count above 15 is not allowed.
    all this i am doing is on click of a button.

  5. #4
    Sencha User
    Join Date
    Sep 2011
    Posts
    64
    Answers
    2
    Vote Rating
    0
    punith.mailme is on a distinguished road

      0  

    Default


    any help please....

  6. #5
    Touch Premium Member
    Join Date
    Jun 2011
    Posts
    1,099
    Answers
    113
    Vote Rating
    96
    Farish is a glorious beacon of light Farish is a glorious beacon of light Farish is a glorious beacon of light Farish is a glorious beacon of light Farish is a glorious beacon of light

      0  

    Default


    its not clear what you are trying to do. What is to be limited to 15? Entry in one of the grid cells using cell/row editing or the number of records in the store? when do you want the error tooltip to be displayed? will the tooltip be shown for each record separately or just one tooltip to appear on whole grid?

  7. #6
    Sencha User
    Join Date
    Sep 2011
    Posts
    64
    Answers
    2
    Vote Rating
    0
    punith.mailme is on a distinguished road

      0  

    Default


    yes, its a pretty simple validation.

    If the count of records in the grid panel is more then 15, and user clicks on the Go button. I have to show this grid panel with the red border. on mouse hover on this entire gird panel( not to any particular record ) i have to show a tool tip.
    currently i have implemented a simple qtip (Ext.tip.tooltip) but client is unhappy as he wants to see the tooltip along with red border and icon within it.

    So as we have textfields and combobox component with vtypes showing error tool tip, i am expecting to override my message for the same tooltip component and get same look and feel.


    sorry if any bad verbiage.


    regards
    punith

  8. #7
    Sencha User
    Join Date
    Sep 2011
    Posts
    64
    Answers
    2
    Vote Rating
    0
    punith.mailme is on a distinguished road

      0  

    Default


    Code:
    renderer: function(value, metaData, record){
        if(/* record has error */){
            metaData.tdCls += " x-form-invalid-field";  // Squiggly red lines
            metaData.tdAttr = "data-errorqtip='This is my error message!'";
        }
        return value;
    }
    this worked.

Thread Participants: 1

Tags for this Thread