CODEWITHSUNDEEP
javascriptjqueryjquery-uidialogmodal-dialog
ionfish
ionfish

Reputation: 165

Jquery UI dialog box.. dialog box content loading on main page

I am activating a dialog box like so:

   $('a#addNew').click(function(){
   $('#popup').dialog({
       minWidth:  700,
       title:     'Select a product item'
   });
});

<div id="popup" style="color:#fff; background:#000; width:650px;">
    blah blah blah blah
</div>

thats all well and good.. but the dialog box (#popup) is actually showing up on my page until i click #addNew, in which case it disappears and transfers to the actual dialog box. I only want the user to see that information when they click on #addNew. I dont want it to be sitting on the page. What am i doing wrong here?

Upvotes: 1

Views: 457

Answers (3)

Alnitak
Alnitak

Reputation: 339816

It's on the main page because that's where you put it!

You need to hide the div (css - display: none) when its first created.

Upvotes: 0

tsilik_
tsilik_

Reputation: 94

using css add
display:none;

or using JQuery add
$('#popup').hide();

Upvotes: 0

Keith.Abramo
Keith.Abramo

Reputation: 6955

<div id="popup" style="color:#fff; background:#000; width:650px; display:none;">
    blah blah blah blah
</div>

You need to hide this div while it is on the page. The dialog will then unhide it and display it for you.

Upvotes: 3

Related Questions