Загрузите текущую страницу через Ajax в php

Question

У меня проблема с моим сценарием ajax, и мне нужно загрузить страницу без обновления страницы. Основы на этом коде.

index.php

<div class="header-page" class="clearfix" role="banner"> 
     <div class="container"> 
      <img src="images/logo.png" /> 
     </div>    
    </div> 
    <!-- end of HEADER --> 
    <form> 
    <div id="contents"> 
    <div class="main-container"> 
     <div class="container"> 
      <table id="tableID"> 
       <tr class="data-head"> 
        <td>Name</td> 
        <td>Phase</td> 
        <td>Money 1</td> 
        <td>Money 2</td> 
        <td>Money 3</td> 
       </tr> 
      <?php 
       while ($row = mysql_fetch_row($result, MYSQL_BOTH)) { 
        $id = $row[0]; 
        $companyname = $row[1]; 
        $client = $row[2]; 
        $package = $row[3]; 
        $payment1 = $row[4]; 
        $payment2 = $row[5]; 
        $payment3 = $row[6]; 


        echo '<tr id="'.$id.'">'; 
        echo '<td><b>'.$client.'</b></td>'; 
        echo '<td>'; 
        echo '<select class="phase" onchange="trackPhases(this.value)">';   
          if($phase_status=='Design'){ 
          echo '<option value="'.$phase_status.''.$id.'" selected>'.$phase_status.'</option>'; 
          echo '<option value="Build-Out'.$id.'">Build-Out</option>'; 
          echo '<option value="Launch'.$id.'">Launch</option>'; 
          } 
          if($phase_status=='Build-Out'){ 
          echo '<option value="Design'.$id.'">Design</option>'; 
          echo '<option value="'.$phase_status.''.$id.'" selected>'.$phase_status.'</option>'; 
          echo '<option value="Launch'.$id.'">Launch</option>'; 
          } 
          if($phase_status=='Launch'){ 
          echo '<option value="Design'.$id.'">Design</option>'; 
          echo '<option value="Build-Out'.$id.'">Build-Out</option>'; 
          echo '<option value="'.$phase_status.''.$id.'" selected>'.$phase_status.'</option>'; 
          } 
        echo '</select>'; 
        echo '</td>'; 
        echo '</tr>'; 
       } 
      ?> 
      </table> 

     </div> 
    </div> 
    </div> 
    </form> 
    <div id="txtHint"></div> 

И это мой Ajax скрипт. Я создал выпадающий элемент управления (только образец) в коде таблицы html. Когда я выбираю значение в выпадающем списке - select class="phase" onchange="trackPhases(this.value), он должен автоматически загружать страницу через Ajax, не обновляясь.

<script type="text/javascript"> 
function trackPhases(str) 
    { 
     if (str=="") 
    { 
     document.getElementById("txtHint").innerHTML=""; 
     return; 
    } 
    if (window.XMLHttpRequest) 
     {// code for IE7+, Firefox, Chrome, Opera, Safari 
      xmlhttp=new XMLHttpRequest(); 
     } 
    else 
     {// code for IE6, IE5 
     xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); 
     } 
     xmlhttp.onreadystatechange=function() 
     { 
     if (xmlhttp.readyState==4 && xmlhttp.status==200) 
      { 
       document.getElementById("txtHint").innerHTML=xmlhttp.responseText; 
      } 
     } 


    xmlhttp.open("GET","update.php?q="+str,true); 
    xmlhttp.send(); 

} 

Мой index.php прекрасно, хотя. Но что-то не так с моим сценарием Ajax. Пожалуйста, помогите мне.

РЕДАКТИРОВАТЬ:

<?php 
    mysql_connect("localhost", "xx", "password"); 
    mysql_select_db('database'); 

    $query = "SELECT * FROM project"; 
    $result = mysql_query($query); 

    ?> 

РЕДАКТИРОВАТЬ

РЕДАКТИРОВАТЬ update.php

<?php 
mysql_connect("localhost", "xx", "password"); 
mysql_select_db('database'); 

$query = "SELECT * FROM project"; 
$result = mysql_query($query); 

$q = $_GET['q']; 

$id = ereg_replace("[^0-9]", "",$q); 
$phase_status = preg_replace('/[0-9]+/', '', $q); 

$sql = 'UPDATE project SET phase_status="'.$phase_status.'" WHERE id = '.$id; 

$retval = mysql_query($sql); 
if(! $retval){ 
    die('Could not update data: ' . mysql_error()); 
} 

?> 

Answer 1

Я говорю только об этом.

* Пожалуйста, используйте PDO или mysqli *

моего использование mysql_query() только, чтобы соответствовать вашему коду

---

Если код update.php вы даете нам, как мы можем видеть.

Вы не можете получить ответ, который вы можете заменить, когда вы отправляете выходные данные!

index.php

<script type="text/javascript"> 
function trackPhases(str) 
{ 
.... 
    if (xmlhttp.readyState==4 && xmlhttp.status==200) 
     { 
     document.getElementById("txtHint").innerHTML=xmlhttp.responseText; 
     } 
    } 
.... 

xmlhttp.open("GET","update.php?q="+str,true); 
xmlhttp.send(); 

update.php

.... 
$sql = 'UPDATE project SET phase_status="'.$phase_status.'" WHERE id = '.$id; 

$retval = mysql_query($sql); 
if(! $retval){ 
    die('Could not update data: ' . mysql_error()); 
} 

Единственный вывод, который вы получите, когда есть ошибка:

выход:

'Could not update data: ' . mysql_error()); 

и немедленно прекратить e ваш скрипт ..

Так что ваш вопрос Load the current page via Ajax in php не имеет ничего общего с тем, что вы хотите получить.

вы хотите заменить весь

<table id="tableID"> 
.... 
<?php 
    while ($row = mysql_fetch_row($result, MYSQL_BOTH)) { 
.... 
</table> 

с нового контента вашего table: project.

---

Только Совет:

Вы можете поставить выше

<table id="tableID"> 
.... 
<?php 
    while ($row = mysql_fetch_row($result, MYSQL_BOTH)) { 
.... 
</table> 

кода в дополнительный включают setSelect.php с функцией

<?php 
function getSelect($result) { 
?> 
    <table id="tableID"> 
    .... 
<?php 
    while ($row = mysql_fetch_row($result, MYSQL_BOTH)) { 
?> 
    </table> 
} 

в index.php код становится

<?php 
include "setSelect.php"; 
.... 
?> 
<div class="main-container"> 
    <div id="newCont" class="container"> 
     <?php getSelect($result); ?> 
    </div> 
</div> 

.... 
?> 

update.php

<?php 
include "setSelect.php"; 
.... 
$sql = 'UPDATE project SET phase_status="'.$phase_status.'" WHERE id = '.$id; 

$retval = mysql_query($sql); 
if(! $retval){ 
    die('Could not update data: ' . mysql_error()); 
} 
$query = "SELECT * FROM project"; 
$result = mysql_query($query); 
if ($result) { 
    getSelect($result); 
} 
?> 

Теперь вы должны изменить ваш getElementById() к

document.getElementById("newCont").innerHTML=xmlhttp.responseText; 

, чтобы соответствовать новый созданный контейнер id.

Я уверен, что вы знаете, что я имею в виду.