Difference between #2 and #3 of
Client-side form validation using Twitter Bootstrap's Popovers

Revision #3 has been created by Trejder Trejder on Apr 26, 2013, 7:54:53 AM with the memo:

Updated Javascript code to avoid conflicts with possible tooltips used in the same time as popovers.
« previous (#2)

Changes

Title unchanged

Client-side form validation using Twitter Bootstrap's Popovers

Category unchanged

How-tos

Yii version unchanged

Tags unchanged

client-side, validation, bootstrap, Twitter Bootstrap

Content changed

[...]
## The code

### Javascript code

We need a quite simple Javascript function to power our popovers. For example something like this:
[...]
if(hasError && (text !== ''))
{
            var
 
                tTemp = '',
 
                dotTemp = '';
 
 
            /**
 
             * We use a trick with temporary disabling title, if user is also 
 
             * using tooltip for this field. Our popover would share title used 
 
             * in that tooltip, which is rather unwanted effect, right?
 
             */
 
            if($(field).attr('rel') == 'tooltip')
 
            {
 
                tTemp = $(field).attr('title');
 
                dotTemp = $(field).attr('data-original-title');
 
                
 
                $(field).attr('title', '');
 
                $(field).attr('data-original-title', '');
 
            }
 
            
 
 /** * 'destroy' is neccessary here, if your field can have more than one * validation error text, for example, if e-mail field can't be empty * and entered value must be a valid e-mail; in such cases, not using * .popover('destroy') here would result in incorrect validation errors * being displayed for such field. */    
$(field)
.popover('destroy')
[...]
})
.popover('show');
                
 
            if($(field).attr('rel') == 'tooltip')
 
            {
 
                $(field).attr('title', tTemp);
 
                $(field).attr('data-original-title', dotTemp);
 
            }
 
 }
else $(field).popover('destroy');
}
}
```
[...]
4 0
9 followers
Viewed: 46 772 times
Version: 1.1
Category: How-tos
Tags: bootstrap, client-side, Twitter Bootstrap, validation
Written by: Trejder Trejder
Last updated by: Trejder Trejder
Created on: Apr 24, 2013
Last updated: 12 years ago
Update Article
Revert to #2 | Revert to #3

Revisions

View all history