Код отправляет две переменные в таблицу MySQL. Кажется, что код работает идеально - единственное, что не работает, - это операторы эха. Что могло бы вызвать это?
Я тестирую файл локально с помощью MAMP, и версия PHP актуальна. Я не могу думать ни о чем другом, что могло бы вызвать проблему. Операторы SQL «insert» работают отлично, и все остальные аспекты кода, кажется, работают без сбоев.
<body>
<div>
First Name: <input type = "text" id = "fname" name = "fname" />
<button id = "submitMe" onclick = "postData()">Click Here</button>
</div>
</body>
function postData(){
//HTML variable
var fname = document.getElementById("fname").value;
//Javascript Variable
var sname = "Second Name";
var http = new XMLHttpRequest();
var url = "index.php";
var params = "fname = "+fname+"&sname = "+sname;
http.open("POST", url, true);
http.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
http.onreadystatechange = function() {
if (http.readyState == 4 && http.status == 200){
//alert(http.responseText);
alert("Request recieved");
}
}
http.send(params);
}
<?php
if (!empty($_POST)){
$fname = $_POST['fname'];
$sname = $_POST['sname'];
$servername = "localhost";
$username = "root";
$password = "root";
$dbname = "tutorials";
$conn = new mysqli($servername, $username, $password, $dbname);
if ($conn->connect_error){
die("Connection failed".$conn->connect_error);
}
$sql = "insert into tutorials_tbl(firstname, lastname) values('".$fname."', '".$sname."')";
if ($conn->query($sql) === TRUE){
echo "New Record created successfully";
}else{
echo "Error: ".$sql."<br/>".$conn->error;
}
$conn->close();
}
?>
Где вы ожидаете увидеть струны в формате echo? Они являются телом ответа, но вы отправляете запрос на сервер с помощью AJAX и ничего не делаете с ответом.
Я ожидал, что они будут отображаться в браузере через html, как если бы я добавлял оператор Echo над оператором IF. Имеет ли это смысл?
Код PHP подвергается SQL-инъекции. Лучше используйте [подготовленные инструкции (stackoverflow.com/a/60496/4265352).
Вы можете проверить ответ на запрос AJAX в консоли инструментов веб-разработчика.
Спасибо Axiac за то, что обратил на это мое внимание! Очень признателен






Да, Запрос на вставку не идеален. Пожалуйста, удалите двойные кавычки и используйте только одинарные.
В чем разница?
Чтобы отобразить операторы PHP в основном документе, вам необходимо получить их через сценарий AJAX.
HTML
Добавьте это туда, где вы хотите, чтобы результат был.
<span id = "output"></span>
JS
if (http.readyState == 4 && http.status == 200){
alert("Request recieved");
document.getElementById("output").innerHTML = this.responseText;
}
this.ResponseText получает вывод вашего PHP-документа.
InnerHTML не является свойством DOM Element. Он не делает того, что вы думаете. Тот, который вы ищете, - innerHTML.
Спасибо, XantiuM и Axiac. Это сработало ... но, как ни странно, весь html теперь выполняется повторно. Я получаю новую форму «отправить» под старой. Есть идеи, почему?
What would cause this? (...) I can't think of anything else that might be causing the problem.
При веб-программировании важно понимать разницу между выполнением на стороне сервера и на стороне клиента.
Обратитесь к этому отличному вопросу (и ответам): В чем разница между программированием на стороне клиента и на стороне сервера?.
И HTML, и javascript являются клиентскими языками *. Они запускаются в браузере, который является клиентом.
PHP, однако, является серверным (он работает на «сервере»).
В вашем случае, даже если у вас все работает локально с MAMP, по-прежнему есть и клиент, и сервер. Просто они оказались на одной машине. Сервер - это Apache, и он запускает код PHP через исполняемый файл php.
Википедия говорит (выделено мной):
MAMP is an acronym of macOS, the operating system; Apache, the web server; MySQL, the database management system; and PHP, Perl, or Python, all programming languages used for web development.
Теперь в вашем примере у вас есть простой HTML-документ с полем ввода типа «text» и кнопкой отправки. Обычно и поле ввода, и кнопка отправки должны быть частью элемента <form>, но в вашем коде <form> отсутствует. Вместо этого вы используете некоторый javascript для выполнения «отправки» на сервер.
Видишь? У вас есть браузер, запускающий некоторый код javascript, который делает запрос к серверу. Сервер обрабатывает запрос, возвращает некоторый текст, но он никогда не анализируется запрошенным javascript.
Я считаю, что в своем коде вы можете просто раскомментировать эту строку:
//alert(http.responseText);
и он покажет всплывающее окно с сообщением из вашего оператора echo.
(*) могут быть исключения, ни одно из которых здесь не имеет отношения.
где вы ожидаете, что это будет вывод? в ваших инструментах разработчика / сетевой панели?