leora
leora

Reputation: 196539

jquery - pass text on the page into a dialog

I want to create a link that calls a javascript function, and I want to pass the text of the link into the function.

I am trying to create a dialog that displays the name on the original link. Would jquery be helpful here?

Upvotes: 1

Views: 3257

Answers (4)

Jim Schubert
Jim Schubert

Reputation: 20357

jQuery UI has a dialog function which would make it easy.

I'd create a hidden div:

<!-- Temporary elements --> 
<!-- ui-dialog --> 
<div id="dialog" title=" "> 
</div> 

And in $(document).ready add:

jQuery('#dialog').dialog({
     autoOpen: false,
     modal: true,
     width: 625, 
     position: 'center'
}); /* end #dialog */

Then, in the click event of the link, set the title and text as:

jQuery('.ui-dialog-title').text(/* yourtext */);
jQuery('.ui-dialog-content').html(/* link name or whatever */);

jQuery('#dialog').dialog('open');
return false;

Those classes are automatically added by the dialog.

edit: forgot to mention, you'll want to open the dialog in the same click event and return false so the original link href doesn't execute.

Upvotes: 4

Logan
Logan

Reputation: 267

A non jQuery way of doing this is to just assign a simple onclick handler to the link

<html>
<head>

    <script>
         function foo(link)
            {
                alert(link.innerHTML);
                return false;
            }
    </script>
</head>
<body>
    <a href="#" onclick="foo(this);">blah</a>
</body>
</html>  

Upvotes: 1

Robert Swisher
Robert Swisher

Reputation: 1300

Expanding on the previous answer, if you just want a dialog box it should be (jquery required):

<a href="#" id="mylink">Some Text here</a>

$('#mylink').click(function(){ alert($(this).text()); return false; });

Upvotes: 0

Mark
Mark

Reputation: 6254

Not sure exactly if this is what you are looking for but:

<a href="#" id="mylink">Some Text here</a>

$('#mylink').click(function(){ myfunc($(this).text()); return false; });

Upvotes: 1

Related Questions