Pass data to a jqueryUI Dialog

Question

For a web-app I'm developing, I need to pass the current user to a jqueryUI dialog box. Right now, I'm trying out simple examples to get to this point. I'm trying to pass the contents of "p" tag from parent page, to be displayed in the jqueryUI dialog.

$(document).ready(function(){
    $('#test').each(function() {
        var $link = $(this);
        var $dialog = $('<div></div>')
            .data('test',$("test_p"))
            .load($link.attr('href') + ' #content')
            .dialog({
                modal: true,
                autoOpen: false,
                title: $link.attr('title'),
                width: 500,
                height: 300
            });
        $link.click(function() {
            $dialog.dialog('open');
            return false;
        });
    });

Here, test_p is the p tag I want to send to my dialog box. I am displaying the "content" div from a HTML file -

<html>
<head>
<title>Add link</title>
<body>
    <div id="content">
                    <!-- CONTENT OF <P> FROM THE CALLER PAGE -->
        <form id="info" method="POST" action="/">
            Link : <input type=text name="thelink"/><br>
            tag : <input type=text name="thetags"/><br>
            <input type=submit name='submit' value="submit"/>
        </form>

    </div>
</body>

I want it such that, the content of the p tag is displayed in the dialog.

Is .data() the way to do this? Or is there a better way to do this?

And, sorry if I've got some terminology wrong... I'm rather new to jquery.

Manuel Leuenberger · Accepted Answer · 2011-06-27 09:59:52Z

1

The dialog widget allows you to set the content via $dialog.html('<p>hello world</p>'). This works because the dialog is built around the element and not in the element, so the content of the dialog element is exactly the content of the actual dialog.

answered Jun 27, 2011 at 9:59

Manuel Leuenberger

2,3673 gold badges21 silver badges28 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

ChrisP · Accepted Answer · 2013-06-13 18:29:43Z

0

The .data() method attached to the dialog element would be a good solution to pass the data. You might also look at the "open" method of the jQueryUI dialog widget which would allow you to use the value and insert it or perform some other action when the dialog window is displayed.

answered Jun 13, 2013 at 18:29

ChrisP

10.1k22 gold badges82 silver badges124 bronze badges

Collectives™ on Stack Overflow

Pass data to a jqueryUI Dialog

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related