2014-09-14 2 views
1

ok Я отредактировал это еще на пару вопросов, которые я задал по аналогичной проблеме, но я действительно спешу, поэтому подумал, что я начну новый, извините, если это беспокоит кто угодно.Проблема с переменными php и ajax javascript

первый у меня есть PHP скрипт на test.php на сервер Apache

<?php 
//create connection 
$con = mysqli_connect("localhost", "user", "password", "dbname"); 

//check connection 
if (mysqli_connect_errno()){ 
    echo "failed to connect to MySQL: " . mysqli_connect_error(); 
    } 
$grab = mysqli_query($con, "SELECT * FROM table"); 
$row = mysqli_fetch_array($grab); 
$name = $row["name"]; 
$color = $row["color"]; 
$price = $row["price"]; 
$n1 = $name[0]; 
$c1 = $color[0]; 
$p1 = $price[0]; 

?> 

Тогда я получил этот АЯКС скрипт настроен на запуск OnLoad страницы с веб-страницы написаны на HTML. поэтому функция load() - это загрузка страницы в теге body. Этот скрипт находится в голове.

function load(){ 
    var xmlhttp = new XMLHttpRequest(); 
    xmlhttp.open("GET", "test.php", true); 
    xmlhttp.send(); 
    xmlhttp.onreadystatecahnge = function(){ 
     if(xmlhttp.readyState == 4 && xmlhttp.status == 200){ 
     document.getElementById("itemNameLink1").innerHTML = "<?php echo $n1;?>; 
     } 
     } 
    } 

ИТАК, что я хочу это n1 переменная $ в сценарии PHP для использования в яваскрипта коде Ajax. Где сценарий, но я не уверен, где и как использовать переменную, я пробовал несколько вещей. Все, что происходит прямо сейчас, это innerHTML элемента itemNameLink1 просто исчезает.

Я совершенно новый, поэтому любые советы будут оценены, спасибо.

+0

Поскольку вы используете (или утверждаете, что используете) jQuery, держите все ручное 'XMLHttpRequest' дерьмо. Если вы не используете jQuery, тогда исправьте теги. – user2864740

ответ

1

Ответ (это то, что вы эхо в PHP) возвращается из запроса вы можете получить responseText атрибут XMLHttpRequest объекта. Так первый код JS должен быть:

function load(){ 
    var xmlhttp = new XMLHttpRequest(); 
    xmlhttp.open("GET", "test.php", true); 
    xmlhttp.send(); 
    xmlhttp.onreadystatecahnge = function(){ 
     if(xmlhttp.readyState == 4 && xmlhttp.status == 200){ 
     document.getElementById("itemNameLink1").innerHTML = xmlhttp.responseText; 
     } 
     } 
    } 

сейчас в PHP эхо $n1 переменной:

.... 
$grab = mysqli_query($con, "SELECT * FROM table"); 
$row = mysqli_fetch_array($grab); 
$name = $row["name"]; 
$color = $row["color"]; 
$price = $row["price"]; 
$n1 = $name[0]; 
$c1 = $color[0]; 
$p1 = $price[0]; 

// echo it to be returned to the request 
echo $n1; 

Update использовать JSON для нескольких переменных

так, если мы делаем это:

$name = $row["name"]; 
$color = $row["color"]; 
$price = $row["price"]; 

$response = array 
(
    'name' => $name, 
    'color' => $color, 
    'price' => $price 
); 

echo json_encode($response); 

в javascript мы можем снова проанализировать его, чтобы иметь объект данных, содержащий 3 переменные.

var data = JSON.parse(xmlhttp.responseText); 
//for debugging you can log it to console to see the result 
console.log(data); 
document.getElementById("itemNameLink1").innerHTML = data.name; // or xmlhttp.responseText to see the response as text 

Fetching всех строкам:

$row = mysqli_fetch_array($grab); // this will fetch the data only once 

вам нужно цикл через множество результатов получили из базы данных: также лучше для производительности использовать доц вместо массива

$names = $color = $price = array(); 

while($row = mysqli_fetch_assoc($grab)) 
{ 
    $names[] = $row['name']; 
    $color[] = $row['color']; 
    $price[] = $row['price']; 
} 

$response = array 
(
    'names' => $names, 
    'color' => $color, 
    'price' => $price 
); 
+0

Это действительно сработало, мне нужно найти другой способ, поскольку я хочу работать с несколькими переменными. однако есть одна проблема. по какой-то причине я получаю только первую букву переменной string, а не всю строку. есть ли какая-то проблема с моим php-кодированием. – Tom

+0

yes problem is: '$ name = $ row [" name "];' is name и '$ n1 = $ name [0];' является первым символом этого имени, поэтому вы можете просто эхо '$ name' –

+0

Кроме того, я обновил ответ на использование нескольких переменных –

1

Вы должны определить переменную PHP. И использовать эту переменную в вашем JavaScript:

<?php 
    $n1 = "asd"; 
?> 
<html> 
<head></head> 
<body> 

    <div id="itemNameLink1"></div> 

    <script> 
     function load() 
     { 
      var xmlhttp = new XMLHttpRequest();      
      xmlhttp.open('GET', '/test.php', true); 
      xmlhttp.send(null); 
      //Note you used `onreadystatecahnge` instead of `onreadystatechange` 
      xmlhttp.onreadystatechange = function() { 
       if (xmlhttp.readyState == 4 && xmlhttp.status == 200) { 
        document.getElementById("itemNameLink1").innerHTML = '<?=$n1?>'; 
       } 
      } 
     } 

     load(); 
    </script> 
</body> 
</html> 
+0

хорошо спасибо. – Tom

+0

Как я могу убедиться, что php загружен до функции загрузки. – Tom

+0

Просто напишите ранее в файле, затем javascript. Поэтому в этом примере переменная определена до запуска javascript. –

1

Вы можете динамически генерировать javascript документ с php, который содержит переменные на стороне сервера, объявленные как переменные javascript, а затем связать это в заголовке вашего документ, а затем включить его в заголовок документа, когда необходимы переменные на стороне сервера. Это также позволит вам динамически обновлять значения переменных при генерации страниц, поэтому, например, если у вас было nonce или что-то, что необходимо изменить при каждой загрузке страницы, правильное значение может быть передано при каждой загрузке страницы. для этого вам нужно сделать несколько вещей. Сначала создайте сценарий php и объявите правильные заголовки для его интерпретации как скрипта:

jsVars.PHP:

<?php 
//declare javascript doc type 
header("Content-type: text/javascript; charset=utf-8"); 
//tell the request not to cache this file so updated variables will not be incorrect if they change 
header('Cache-Control: no-cache, no-store, must-revalidate'); // HTTP 1.1. 
header('Pragma: no-cache'); // HTTP 1.0. 
header('Expires: 0'); // Proxies. 

//create the javascript object 
?> 

var account = { 
    email: <?= $n1; ?>, 
    //if you need other account information, you can also add those into the object here 
    username: <?= /*some username variable here for example */ ?> 
} 

Вы можете повторить это для любой другой информации, которую нужно передать в JavaScript при загрузке страницы, а затем ссылаться на данные, используя пространство имен объектов JavaScript (с помощью объекта пространствами имен позволит предотвратить столкновения с другими переменными сценария, которые могут не было предвидеть) везде, где это необходимо следующим образом:.

<script type="text/javascript> 
//put this wherever you need to reference the email in your javascript, or reference it directly with account.email 
var email = account.email; 
</script> 

Вы также можете поставить условный оператор в голова вашего документа, поэтому она будет загружать только на страницах, где это необходимо (или если какой-либо проверка прав доступа или другие критерии). Если вы загрузите это до других файлов сценариев, оно будет доступно во всех случаях, если вы используете его в более высокой области, чем ваш запрос.

<head> 

<?php 
    //set the $require_user_info to true before page render when you require this info in your javascript so it only loads on pages where it is needed. 
    if($require_user_info == TRUE): ?> 

    <script type="text/javascript" href="http://example.com/path-to-your-script/jsVars.php" /> 

    <?php endif; ?> 

<script type="text/javascript" href="your-other-script-files-that-normally-load" /> 

</head> 

Вы также можете сделать это для любых других скриптов, которые должны загружаться по определенным критериям с сервера.

+0

. Вы можете использовать аналогичный подход для возврата объекта из вызова ajax, если вы не хотите, чтобы данные были доступны до тех пор, пока документ не загрузится, хотя вы бы хотели, чтобы JSON_ENCODE ответ в этом случае. Это позволит вам получать дополнительные скрипты, переменные и т. Д. С сервера через ajax, которые могут быть динамически генерированы на сервере на основе критериев, прошедших через исходный вызов ajax. – mopsyd

Смежные вопросы