StackOverflowNewbie
StackOverflowNewbie

Reputation: 40633

jQuery tools: tooltip makes title disappear?

I'm trying to make tooltips appear using jQuery Tools' tooltip feature. When the mark up looks like this, it's fine:

<input type="submit" title="Submit your foo" value="foo"></input>

But when the input is disabled, the title mysteriously disappears from the DOM:

<input type="submit" disabled="disabled" title="Sorry, you cannot submit your foo" value="foo"></input>

This only happens when I try to use jQuery tools. If I don't use jQuery tools, the title appears just fine (default browser effect). Any ideas what's wrong?

UPDATE:

http://jsfiddle.net/7jCXz/ - this example seems to remove the title attribute in both input tags, not just the disabled one.

Upvotes: 1

Views: 726

Answers (2)

Tony Carbone
Tony Carbone

Reputation: 484

A bit late to help you, but hopefully helps someone else.

Using jQuery Tooltip, if you want to get/set the title attribute after the tooltip has been initialised, you need to use

$(foo).tooltip("option","content")

or

$(foo).tooltip("option","content","some new content")

Ref: http://api.jqueryui.com/tooltip/#option-content

Upvotes: 0

Farahmand
Farahmand

Reputation: 2991

Try to wrap your submit button into an div, then use tooltip on your div:

$(document).ready(function(){
    $('input[disabled="disabled"]').each(function(){
        var $tit = $(this).attr('title');
        $(this).wrap('<div class="submitWrapper" title="' + $tit + '"></div>');
    });
    //$('.submitWrapper').tooltip(); // or something like this
    $('.submitWrapper').on('mouseover', function(){
        alert('submitWrapper clicked!');
    });
});

Demo

Upvotes: 1

Related Questions