CODEWITHSUNDEEP
jquery
user2124167
user2124167

Reputation: 205

Jquery .position() not working

This is my javascript method

function showToolTip(message, controlId) {
            var webControl = controlId;
            var position = webControl.position();
            $("#ShowInfo").show();
            $("#ShowInfo").html(message);
            $("#ShowInfo").css({ top: position.top, left: position.left });
        }

And this is my asp.net textbox

<asp:TextBox ID="txtLoadCode" runat="server"onMouseOver="showToolTip('This indicates the load code',this)"></asp:TextBox>

But this gives me an error that object not supported.

Can anyone please help?

Upvotes: 0

Views: 146

Answers (3)

The Dark Knight
The Dark Knight

Reputation: 5585

This is due to the reason , that just because you have named the this object in your function as controlID , it does not actually become an id. It still is the this object. So you need to extract this object and work with that .

So, here goes :

JS :

function showToolTip(message, controlObject) {

    var webControl = $(controlObject);
    var position = webControl.position();
console.log("position::"+position.top)
    $("#ShowInfo").show();
    $("#ShowInfo").html(message);
    $("#ShowInfo").css({ top: position.top, left: position.left });
}

Working Fiddle : http://jsfiddle.net/Tf9gm/

Upvotes: 0

vaibhav silar
vaibhav silar

Reputation: 3085

One problem possibly I can see is that attributes are not separated by space

runat="server"onMouseOver="showToolTip('This indicates the load code',this)"

It should be like this

runat="server" onMouseOver="showToolTip('This indicates the load code',this)"

Upvotes: 0

adeneo
adeneo

Reputation: 318342

It's not a jQuery object as you're passing this, which is the native DOM node.

You have to wrap it first to make it work with jQuery methods 

function showToolTip(message, controlId) {
        var webControl = $(controlId); // wrapped
        var position = webControl.position();
        $("#ShowInfo").show();
        $("#ShowInfo").html(message);
        $("#ShowInfo").css({ top: position.top, left: position.left });
}

Upvotes: 1

Related Questions