обновить страницу html с помощью AJAX и mysql

Question

У меня есть 3 divs на моей странице html, которая имеет отображение: по умолчанию нет, я хочу регулярно проверять с помощью DB и обновлять атрибут отображения divs соответственно.

<div class="gunnybag" style="float:right"> 
     <div id="p1" style="display:none;"><img id="drag1" draggable="true" src="coconut.png"></div> 
     <div id="p2" style="display:none;"><img id="drag2" draggable="true" src="coconut.png"></div> 
     <div id="p3" style="display:none;"><img id="drag3" draggable="true" src="coconut.png"></div> 
    </div> 

Для этого я написал этот JS файл,

$(document).ready(function() { 
    doAjax(); 
    }); 

function doAjax(){ 
$.ajax({ 
    url: "db_fetch.php", 
    dataType: "json", 
    success: function(json){ 
     var dataArray = JSON.decode(json); 
     dataArray.each(function(entry){ 
      var i=1; 
      if(entry.valueName==true){  //checking if `state`= true/false. 
       $q('#p'+i).css("display","block"); 
      } 
      else{ 
       $q('#p'+i).css("display","none"); 
      } 
      i=i++; 
     }) 
    } 

}).complete(function(){ 
     setTimeout(function(){doAjax();}, 1000); // check with DB every sec 
    }); 
} 

Здесь представлен db_fetch.php

<?php 
try{ 
    $con=mysql_connect("sqlservername","uname", "pass") or die(mysql_error()); 
} 
catch(Exception $e){ 
    echo $e; 
} 
mysql_select_db("db_name", $con) or die(mysql_error()); 

$q = mysql_query("SELECT `state` FROM `table` "); //selecting all `state` from table 
var_dump($q); 
$query = mysql_query($q, $con); 
$results = mysql_fetch_assoc($query); 
echo json_encode($results); //returns json obj to above JS 

?> 

мой DB имеет 2 колонки идентификатор и состояние, идентификатор имеет p1, p2 , p3 как значения, а состояние - либо true, либо false.

Просьба указать, что это такое, что я делаю неправильно.

Ваш отзыв очень ценится. Заранее спасибо.

Answer 1

Используйте функцию window.onload следующим образом.

<script language="javascript"> 
window.onload = function() { 

    doAjax(); 

} 
</script> 

Answer 2

Вот окончательный рабочий код. Проблема в том, что я разбирал json, ПРИМЕЧАНИЕ: если вы используете dataType: «json», в $ .ajax(), тогда ВАМ НЕОБХОДИМО ПОВТОРИТЬ JSON, УЖЕ ПАРСИЮ!

ajx.js:

$(document).ready(function() { 
doAjax(); 
}); 

function doAjax(){ 
var i=0; 
$.ajax({ 
    url: "db_fetch.php", 
    dataType: "json", 
    success: function(json){ 

     jQuery.each(json, function(i){ 

      if(json[i].data.state=='true'){ 
       $('#p'+(i+1)).css("display","block"); 
      } 
      else{ 
       $('#p'+(i+1)).css("display","none"); 
      } 
      i=i++; 
     }); 
    } 

}).complete(function(){ 
     setTimeout(function(){doAjax();}, 2000); 
    }); 
}