CODEWITHSUNDEEP
phpjqueryjquery-ui-dialog
Muhammad Umar
Muhammad Umar

Reputation: 11782

Opening a dialog box in jquery with php content

I am trying to open a chat portal in a dialog using jquery.

Here is my code

<img class="chatBtn" id="chat_btn" style="margin-top: 10px; margin-left: 10px" src="images/colored_livecha.png" alt="" width="80" height="33" />

jQuery('.chatBtn').click(function() {
  var dlg = jQuery('#chat_btn').dialog({
    autoOpen: 'false',
    modal: 'true',
    minHeight:'300px',
    minWidth: '300px'
  });

  dlg.load('chat.php', function(){
    dlg.dialog('open');
  });
});

However on click nothing happens. What amendments are required?

Upvotes: 0

Views: 1123

Answers (3)

user3764415
user3764415

Reputation: 91

I think you need to reference jquery library :

  1. href="//code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css.
  2. src="//code.jquery.com/jquery-1.10.2.js".
  3. src="//code.jquery.com/ui/1.10.4/jquery-ui.js".
  4. rel="stylesheet" href="/resources/demos/style.css".

Upvotes: 0

segfault
segfault

Reputation: 504

The simplest way would be to get the information in the database using PHP, and populate the UI tables like that. The major downside would be loading time. If you find that the page is taking too long to load, then you may want to look into jQuery's .ajax()

Upvotes: 1

Jamie Hutber
Jamie Hutber

Reputation: 28076

You'll need to wrap that in a script tag.

 <script>
jQuery('.chatBtn').click(function() 
{

  var dlg = jQuery('#chat_btn').dialog(
    {
 autoOpen: 'false',
  modal: 'true',
  minHeight:'300px',
  minWidth: '300px'
  });

dlg.load('chat.php', function(){
         dlg.dialog('open');
     });
});
 </script>

Another question, is jQuery included in the head or somewhere in the page?

Upvotes: 2

Related Questions