Bootstrap tooltip on exceeding textbox maxlength -


i have textbox allows maximum of 40 characters entered.when user tries enter 41th character ,i need display bootstrap tooltip (not on focus or hover).i struggling , not able it.please help. have created jsfiddle that

http://jsfiddle.net/vijay4225/gjlusomk/

$(document).ready(function(){  $('#textbox').keyup(function() {   var text_length = $('#textbox').val().length;     if(text_length ==40) {     $('#textbox').attr('title','you cannot enter more 40 characters');     $('input[rel="txttooltip"]').tooltip();     }     });     }); 

you need set tooltip trigger manual, i.e data-trigger="manual" , show tooltip manually tooltip('show'). besides that, think keydown better event task - tooltip should appear user hits keybord, not when user has stopped typing. suggest implement logic prevent tooltip blinking or reappear if shown.

$('#textbox').keydown(function() {    if ($(this).val().length>=40) {      if ($(this).data('warning')) return;      $(this).attr('title','you cannot enter more 40 characters');      $(this).tooltip('show');      $(this).data('warning', true);    } else {        if ($(this).data('warning')) {           $(this).tooltip('hide');                  $(this).data('warning', false);                          }        } }); 

forked fiddle -> http://jsfiddle.net/hb3bmo50/


Comments

Popular posts from this blog

PHP DOM loadHTML() method unusual warning -

python - How to create jsonb index using GIN on SQLAlchemy? -

c# - TransactionScope not rolling back although no complete() is called -