AJAX не перезагружает страницу

#javascript #php #ajax #datetime

#javascript #php #ajax #дата и время

Вопрос:

Мне поручено использовать JavaScript и JSON для возврата и отображения данных в браузере. Я очень новичок в AJAX, и у меня возникли проблемы с запуском AJAX нажатием кнопки.Основная проблема заключается в запуске AJAX.

Я пытаюсь загружать данные на один и тот же экран каждый раз, когда пользователь вводит новые данные.

PHP-код:

 <h2>Submit Recipes</h2>
<form id="addRecipes" name="addRecipes" action="Welcome.php"method="POST">
    <fieldset>
        <legend>Submit Recipes</legend>
        <textarea id="recipesId" name="recipes" rows="6" cols="70"></textarea>
        <br/>
        <input type="button" value="Submit" name="submit" onclick="submitRecipes()"/>
    </fieldset>
</form>
<br/>
<table id="recipesTbl" border="1" >
    <tr>
        <th class="row-datetime" name="datetime">DateTime </th>
        <th class ="row-recipes" name="recipes">  Recipes </th>
    </tr>
</table>

Код Ajax:

 function submitRecipes() {

    var recipes = document.getElementById("recipesId").value;   
    if (recipes == null || recipes == "") {
        alert("Please enter the recipes");
        return false;
    }

    var request = new XMLHttpRequest();

    request.onreadystatechange = function() {

        if (request.readyState == 4 amp;amp; request.status == 200) {

             var text = request.responseText;
             var json = JSON.parse(text);

            var table = document.getElementById("recipesTbl");

            var newRow = table.insertRow(1);

            var newCell = newRow.insertCell(0);
            newCell.innerHTML = json.datetime;

            newCell = newRow.insertCell(1);
            newCell.innerHTML = json.recipes;

        }
    }
    request.open("POST", "SubmitRecipes.php", true);
    request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");    
    request.send("recipes="   recipes);

    document.getElementById("recipesId").value = "";
}

Фрагмент PHP-файла:

 <?php
$recipes= $_POST["recipes"];
date_default_timezone_get('UTC');
$datetime = date("Y-m-d H:i:s");

storeRecipes($recipes, $datetime);

echo ('{ "datetime" : "'. $datetime. '",'.
        '"recipes": "'.recipes .'"}');
?>

1. Что говорит ваша консоль браузера, вы можете увидеть запрос ..? также ваш json открыт для атаки..

2. @JaromandaX '"recipes": "'.recipes .'"} , хотя в нем отсутствует $ потенциал {"recipes":"</script><script>alert('XSS')</script>"}

3. ах, я глупый: p

4. привет, я получаю неперехваченную синтаксическую ошибку: неожиданный токен < в JSON в позиции 0.

5. поскольку вы не отправляете JSON на PHP, проверьте вкладку developer tools networks, чтобы узнать, что возвращается из вашего запроса

Ответ №1:

Функция storeRecipes не существует. Чтобы JSON.parse работать, одинарная кавычка (‘) должна быть снаружи, а двойная кавычка («) должна быть внутри.

Например :

 var string = '{"a": "1", "b": "2"}';
var res = JSON.parse(string);
console.log(res);

Развернуть фрагмент

 <?php

$recipes = $_POST["recipes"];
date_default_timezone_get('UTC');
$datetime = date("Y-m-d H:i:s");

// storeRecipes($recipes, $datetime);

$data = '{"datetime": ' . '"' . $datetime . '",';
$data .= '"recipes": ' . '"' . $recipes . '"}';

echo $data;
?>

(и с файлом сценария в <head> разделе) это должно сработать!