title: Failed to load resource: the server responded with a status of 404 Not Found
body: <p>I'm new to Wordpress and Ajax and dont really know how to solve this problem, so any help would be appreciated.</p>
  
  <p>I am working on a Wordpress Theme, where all students from a database are displayed in a table: </p>
  
  <pre><code>    &lt;?php
  
  get_header();
  
  if(have_posts()):
      while(have_posts()) : the_post(); ?&gt;
  
  &lt;article class="post page"&gt;
  &lt;a href="&lt;?php the_permalink(); ?&gt;"&gt;&lt;?php the_content(); ?&gt;
  
  &lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt; 
  
  
  
          &lt;script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.0/jquery.min.js"&gt;&lt;/script&gt;  
          &lt;link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" /&gt;  
          &lt;script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"&gt;&lt;/script&gt;  
  
  &lt;style&gt;
  
  }
      img {
      vertical-align: middle; 
  
  }
      table {
      border-collapse: collapse;
      width: 100%;
      border-spacing: 50px 0;
      text-align: center;
  }
  
  
      .hover:hover{
          background-color: antiquewhite;
  
      }
      td{
          padding: 10px;
      }
      .aligncenter{
          text-align: center;
      }
  
  
      div.scroll {
      position: static;
      width: 700px;
      height: 400px;
      overflow: scroll;
      overflow-x: hidden;
      }
      a {
      text-decoration: none;
      }
  
  
  &lt;/style&gt;
  &lt;/head&gt;
  
  &lt;body&gt;
      &lt;div class="scroll"&gt;&lt;a href="&lt;?php the_permalink(); ?&gt;"&gt;&lt;?php the_content(); ?&gt; &lt;/a&gt;
  &lt;?php
  $mysqli = NEW MySQLi('localhost','root','','wp_db');
  
          if(isset($_GET['order'])){
              $order = $_GET['order'];
          }else{
              $order = 'name';
          }
  
          if(isset($_GET['sort'])){
              $sort = $_GET['sort'];
          }else{
              $sort ='ASC';
          }
  
          $result = $mysqli-&gt;query("SELECT * FROM wp_absolventen ORDER BY $order $sort");
  
          $image = $row['bild'];
  
          if($result-&gt;num_rows &gt; 0){
  
              $sort == 'DESC' ? $sort = 'ASC' : $sort ='DESC'; // short IF statements 
                   ?&gt;
                   &lt;div class="table-responsive" style=overflow-x:auto;&gt;  
              &lt;table class="table table-bordered"&gt;
              &lt;?php
              echo "
              &lt;th&gt;&lt;/th&gt;
              &lt;th class='aligncenter'&gt;
              &lt;a href='?order=name&amp;&amp;sort=$sort'&gt;Name&lt;/a&gt;&lt;/th&gt;
              &lt;th class='aligncenter'&gt;&lt;a href='?order=geburtsdatum&amp;&amp;sort=$sort'&gt;Geburtsdatum&lt;/a&gt;&lt;/a&gt;&lt;/th&gt;
              &lt;th class='aligncenter'&gt;&lt;a href='?order=stadt&amp;&amp;sort=$sort'&gt;Wohnort&lt;/a&gt;&lt;/th&gt;
              ";
              ?&gt;
              &lt;?php
              while($rows = $result-&gt;fetch_assoc())
              {
                  $name = $rows['name'];
                  $geburtsdatum= $rows['geburtsdatum'];
                  $stadt = $rows['stadt'];
                  $p='&lt;img src="data:image/jpg;base64,' . base64_encode( $rows['bild'] ) . '"/&gt;';
                  $id = $rows['id'];
  
                  ?&gt;
  
                  &lt;tr class='hover'&gt;
  
  
                  &lt;td&gt; &lt;?php echo $p; ?&gt;&lt;/td&gt;
  
  
  
                  &lt;td&gt;&lt;input type="button" name="view" value="&lt;?php echo $name; ?&gt;" id="&lt;?php echo $row["id"]; ?&gt;" class="btn btn-info btn-xs view_data" /&gt;&lt;/td&gt; 
  
  
  
                  &lt;td&gt;&lt;?php echo $geburtsdatum; ?&gt;&lt;/td&gt;
  
  
  
                  &lt;td&gt;&lt;?php echo $stadt; ?&gt;&lt;/td&gt;
                  &lt;/tr&gt;
  
                 &lt;?php
  
              }
  
          }else{
              echo "No records returned.";
          }
          ?&gt; 
          &lt;/table&gt;
           &lt;/div&gt;
  
  
  &lt;/body&gt;
  &lt;/html&gt;
  &lt;/article&gt;
    &lt;div id="dataModal" class="modal fade"&gt;  
        &lt;div class="modal-dialog"&gt;  
             &lt;div class="modal-content"&gt;  
                  &lt;div class="modal-header"&gt;  
                       &lt;button type="button" class="close" data-dismiss="modal"&gt;&amp;times;&lt;/button&gt;  
                       &lt;h4 class="modal-title"&gt;Employee Details&lt;/h4&gt;  
                  &lt;/div&gt;  
                  &lt;div class="modal-body" id="employee_detail"&gt;  
                  &lt;/div&gt;  
                  &lt;div class="modal-footer"&gt;  
                       &lt;button type="button" class="btn btn-default" data-dismiss="modal"&gt;Close&lt;/button&gt;  
                  &lt;/div&gt;  
             &lt;/div&gt;  
        &lt;/div&gt;  
   &lt;/div&gt;  
      &lt;script&gt;  
   $(document).ready(function(){  
        $('.view_data').click(function(){  
             var employee_id = $(this).attr("id");  
             $.ajax({  
                  url:"select.php",  
                  method:"post",  
                  data:{employee_id:employee_id},
                  succes:function(data){  
                      $('#employee_detail').html(data);  
                       $('#dataModal').modal("show");  
                  }  
             });  
        });  
   });  
  
   &lt;/script&gt;
  
  
  
  
  
  
  
  
  
  
  &lt;?php 
      endwhile;
  
      else :
          echo '&lt;p&gt;No contect found&lt;/p&gt;';
      endif;
  
  get_footer();
  ?&gt;
  </code></pre>
  
  <p>So far so good, but when you click on a students name, it should open a bootstrap modal, where the information about the student are displayed (fetched from Database).</p>
  
  <pre><code>     &lt;script&gt;  
   $(document).ready(function(){  
        $('.view_data').click(function(){  
             var employee_id = $(this).attr("id");  
             $.ajax({  
                  url:"select.php",  
                  method:"post",  
                  data:{employee_id:employee_id},
                  succes:function(data){  
                      $('#employee_detail').html(data);  
                       $('#dataModal').modal("show");  
                  }  
             });  
        });  
   });  
  
   &lt;/script&gt;
  </code></pre>
  
  <p>This is the function that calls another php file (select.php),opens the modal and gets the information from the database. The select.php file:</p>
  
  <pre><code>&lt;?php  
   if(isset($_POST["employee_id"]))  
   {  
        $output = '';  
        $connect = mysqli_connect("localhost", "root", "", "wp_db");  
        $query = "SELECT * FROM wp_absolventen WHERE id = '".$_POST["employee_id"]."'";  
        $result = mysqli_query($connect, $query);  
        $output .= '  
        &lt;div class="table-responsive"&gt;  
             &lt;table class="table table-bordered"&gt;';  
        while($row = mysqli_fetch_array($result))  
        {  
             $output .= '  
                  &lt;tr&gt;  
                       &lt;td width="30%"&gt;&lt;label&gt;Name&lt;/label&gt;&lt;/td&gt;  
                       &lt;td width="70%"&gt;'.$row["name"].'&lt;/td&gt;  
                  &lt;/tr&gt;  
  
                  ';  
        }  
        $output .= "&lt;/table&gt;&lt;/div&gt;";  
        echo $output;  
   }  
   ?&gt;
  </code></pre>
  
  <p>But when I try to click on the students name, the modal doesnt open, instead I get this 404 error: <strong>Failed to load resource: the server responded with a status <a href="http://localhost/wordpress/sample-page/select.php" rel="nofollow noreferrer">http://localhost/wordpress/sample-page/select.php</a> of 404 (Not Found). Both files are in the same folder.</strong> </p>
  
  <p>The code works when its not in a wordpress folder.</p>
  
  <p>M.M.</p>