title: How I pop-up a jquery dialog with mysql data?
body: <p>I have a question about jQuery UI Dialog box and showing dynamic content from a database. </p>
  
  <p>Here I have a table which is generating blog post using php and mysql and in that table, there is a column to view contents which are belong to each blog post.</p>
  
  <p>That link is something like this - </p>
  
  <pre><code>    $html .= "  &lt;td align='center'&gt;\n";
      $html .= "      &lt;a href='#' id='blog-$blog_id' class='view' &gt;\n";
      $html .= "          &lt;span class='icon-small ico-view-blog' title='View This Blog Post'&gt;&lt;/span&gt;\n";
      $html .= "      &lt;/a&gt;\n";
      $html .= "  &lt;/td&gt;\n";
  </code></pre>
  
  <p>Clicking on above link I need to pop-up a jQuery dialog to display all blog content. Eg: blog-title, author, image, blog etc. </p>
  
  <p>I tried it with jQuery and using separate php script to fetch blog contents like this. But it is not pop-up the dialog as I expect. </p>
  
  <p>This is jQuery I have used for the dialog - </p>
  
  <pre><code>$( "#dialog-view-blog" ).dialog({
          autoOpen: false,
          height: 450,
          width: 650,
          modal: true,
          buttons: {
              Cancel: function() {
              $( this ).dialog( "close" );
              }
          }, 
          position: { 
              my: "center top", 
              at: "center top",
              of: "#content"
          }
      });
  </code></pre>
  
  <p>This is how I send a ajax request for the data from the php file to update the content in the dialog - </p>
  
  <pre><code>$( "a.view" ).click(function(e) {
      e.preventDefault();     
      var clickblogID = this.id.split('-'); //Split string 
      var DbNumberID = clickedID[1]; //and get number from array
      var blogId = 'blog_id='+ DbNumberID; //build a post data structure  
      $.ajax({
          url: 'update_blog.php',
          type: 'POST',
          data: blogId,
          success: function(data){
  
              //alert(data);
  
              //construct the data however, update the HTML of the popup div 
              //$('#dialog-view-blog').html(data);
              $('#dialog-view-blog').dialog('open');
          }
      });             
  }); 
  </code></pre>
  
  <p>FROM MY PHP page - </p>
  
  <pre><code>&lt;?php
  // define constant for upload folder
  define('UPLOAD_DIR', '../upload_images/blog/'); 
  
  
  echo '&lt;pre&gt;', print_r($_GET).'&lt;/pre&gt;';
  
  if (isset($_GET['blog_id'])) { 
      //blog_id 
      $blogId = $_GET['blog_id'];
  
      //echo $blogID;
  
      // If there is no any blog to this user display a string. 
      $q = "SELECT * FROM userblogs WHERE blog_id = ? LIMIT 1";
      // Prepare the statement:
      $stmt = mysqli_prepare($dbc, $q);
      // Bind the variables:
      mysqli_stmt_bind_param($stmt, 'i', $blogId);                            
      // Execute the query:
      mysqli_stmt_execute($stmt);
      //store result  
      mysqli_stmt_store_result($stmt); 
      // Get the number of rows returned: 
      $rows = mysqli_stmt_num_rows ($stmt);
  
      if ( $rows == 1 ) { 
  
          // bind variables to prepared statement
          mysqli_stmt_bind_result($stmt, $blog_id, $user_id, $blog_title, $blog_author, $blog, $blog_image, $blog_added_date, $blog_date_modified);
  
          $viewBlog  = "&lt;div id='dialog-view-blog' title='View Blogs'&gt;\n";
          $viewBlog .= "      &lt;h2&gt;$blog_title&lt;/h2&gt;\n";
          $viewBlog .= "  &lt;p&gt;$blog_author | $blog_added_date&lt;/p&gt;\n";
          $viewBlog .= "  &lt;p&gt;";
          $viewBlog .= "          &lt;img src='".UPLOAD_DIR.$userName."/".$blog_image."' alt='Image for Blog Title' /&gt;";
          $viewBlog .= "      $blog&lt;/p&gt;";
          $viewBlog .= "&lt;/div&gt;\n";        
  
          echo $viewBlog;
      } 
  }
  ?&gt;
  </code></pre>
  
  <p>Any comments are greatly appreciated. </p>