javascript - Ajax成功返回

标签 javascript php jquery html ajax

有人可以帮我解决这个问题吗 我有这个 php 文件,用于将数据插入到我的数据库中,所有内容均由 ajax 函数发送

<?php
header('Content-type: application/json');
ini_set('max_execution_time', 300);
error_reporting(E_ALL | E_NOTICE);
ini_set('display_errors', '1');
$mysqli = new mysqli('localhost', 'root', '', 'ebspma');

// Works as of PHP 5.2.9 and 5.3.0.
if ($mysqli->connect_error) {
    die('Connect Error: ' . $mysqli->connect_error);
}
$num= $_POST['num'];
$dia = $_POST['dia'];
$sala = $_POST['sala'];
$hora = explode(",", $_POST['hora']);
$a = [1,2,3,4,5,6,7,8,9,10,11,12,13,14,15,16,17];
$c = array_fill_keys(array_keys(array_diff($a,$hora)),null) + $a;
ksort($c);
for ($i=0; $i<17; $i++){
$horas = $c[$i];
$stmt = $mysqli->prepare("INSERT INTO `ebspma`.`sala_ocupacao` (id_dia, id_sala, id_tempo) VALUES (?, ?, ?);")or die(mysql_error($mysqli));
$stmt->bind_param('ssi', $dia, $sala, $horas);
if(!$stmt->execute()){
    echo json_encode(array('status' => 'error','message'=> 'Opppss...Os Registo(s) não foram gravado(s)'));
}
else{
   echo json_encode(array('status' => 'success','message'=> 'Registo(s) gravado(s) com sucesso'));
}
$stmt->close();
}
$mysqli->close();
?>

这是我的 ajax 函数

function postData(){
var dia = document.getElementById('dia').value;
var sala = document.getElementById('sala').value;
var tempos = [];
var s = document.getElementById('hora');
for (var i = 0; i < s.options.length; i++) {
if (s.options[i].selected == true) {
var valores = s.options[i].value;
tempos.push(valores);
}
}
console.log(tempos);
var num = document.getElementById('num').value;
var data = 'dia='+ dia + '&sala='+ sala + '&hora='+ tempos + '&num='+ num;
$.ajax({ 
type: "POST",
dataType: "html",
url: "registerBd.php",
data: data, 
success: function (response) {
console.log(response);
$('#ajaxDivOk').css("display", "block");
$('#ajaxDivOk').html("Registo(s) gravado(s) com sucesso");
alert(response);
},
error:function(response){
console.log("Aqui 2");
alert("something went wrong");
}});
return false;
}

通过我的表单这样调用

 <form method="post" id="salas" name="salas" onsubmit="postData()" >

但是即使我的数据插入数据库,我的函数总是出错

新更新

新插入名为registerBd.php的php

<?php
header('Content-type: application/json');
error_reporting(E_ALL | E_NOTICE);
ini_set('display_errors', '1');
$mysqli = new mysqli('localhost', 'root', '', 'ebspma');
if ($mysqli->connect_error) {
    die('Connect Error: ' . $mysqli->connect_error);
}
$num = $_POST['num'];
$dia = $_POST['dia'];
$sala = $_POST['sala'];
$hora = $_POST['hora'];
$a = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17];
$c = array_fill_keys(array_keys(array_diff($a, $hora)), null) + $a;
ksort($c);
for ($i = 0; $i < 17; $i++) {
    $horas = $c[$i];
    $stmt = $mysqli->prepare("INSERT INTO `ebspma`.`sala_ocupacao` (id_dia, id_sala, id_tempo) VALUES (?, ?, ?);")or die(json_encode(mysqli_error($mysqli)));
    $stmt->bind_param('ssi', $dia, $sala, $horas);
    if (!$stmt->execute()) {
        echo json_encode(array('status' => 'error', 'message' => 'Opppss...Os Registo(s) não foram gravado(s)'));
    }
}
echo json_encode(array('status' => 'success', 'message' => 'Registo(s) gravado(s) com sucesso'));
$stmt->close();
unset($stmt);
?> 

以及对ajax的修改

 <script>
             function postData(){
                var dia = document.getElementById('dia').value;
                var sala = document.getElementById('sala').value;
                var tempos = [];
                var s = document.getElementById('hora');
                for (var i = 0; i < s.options.length; i++) {
                    if (s.options[i].selected == true) {
                        var valores = s.options[i].value;
                        tempos.push(valores);
                    }
                }
                console.log(tempos);
                var num = document.getElementById('num').value;
                    $.ajax({ 
                            type: "POST",
                            dataType: "json",
                            url: "registerBd.php",
                            data : {'dia': dia, 'sala': sala, 'hora': tempos, 'num': num},
                            success: function (response) {
                            console.log(response);
                            $('#ajaxDivOk').css("display", "block");
                            $('#ajaxDivOk').html("Registo(s) gravado(s) com sucesso");
                            alert(response);
                         },
                            error: function(jq,status,message) {
                            console.log( message );
                            alert('A jQuery error has occurred. Status: ' + status + ' - Message: ' + message);
                            }
                       });
                       return false;
                }
        </script>

但是仍然有同样的问题,并且在chrome控制台中,插入后registerBd.php是红色的,所以我认为即使所有内容都记录到数据库中,问题也应该在这里

新更新...这真的很奇怪 删除了 registerDb.php 中的 2 行

unset($smtp);
?>

带调试和不带调试 我明白了 检查图像 http://postimg.org/image/8wtwxod3r/

没有调试器 http://postimg.org/image/5nctzrjkv/

检查底部似乎registerBd.php被取消了...为什么?

所以现在我迷路了

更新3

我在哪里调用我的ajax函数

<form method="post" id="salas" name="salas" onsubmit="postData()" > 

我的ajax函数

<script>
             function postData(){
                var dia = document.getElementById('dia').value;
                var sala = document.getElementById('sala').value;
                var tempos = [];
                var s = document.getElementById('hora');
                for (var i = 0; i < s.options.length; i++) {
                    if (s.options[i].selected == true) {
                        var valores = s.options[i].value;
                        tempos.push(valores);
                    }
                }
                console.log(tempos);
                var num = document.getElementById('num').value;
                    $.ajax({ 
                            type: "POST",
                            dataType: "json",
                            url: "registerBd.php",
                            data : {'dia': dia, 'sala': sala, 'hora': tempos, 'num': num},
                            success: function (response) {
                            console.log(response);
                            $('#ajaxDivOk').css("display", "block");
                            $('#ajaxDivOk').html("Registo(s) gravado(s) com sucesso");
                            alert(response);
                         },
                            error: function(jq,status,message) {
                            console.log( message );
                            alert('A jQuery error has occurred. Status: ' + status + ' - Message: ' + message);
                            }
                       });
                       return false;
                }
        </script>

和我的registerBd.php

<?php
error_reporting(E_ALL | E_NOTICE);
ini_set('display_errors', '1');
$mysqli = new mysqli('localhost', 'root', '', 'ebspma');
if ($mysqli->connect_error) {
    die('Connect Error: ' . $mysqli->connect_error);
}
$num = $_POST['num'];
$dia = $_POST['dia'];
$sala = $_POST['sala'];
$hora = $_POST['hora'];
$a = [1, 2, 3, 4, 5, 6, 7, 8, 9, 10, 11, 12, 13, 14, 15, 16, 17];
$c = array_fill_keys(array_keys(array_diff($a, $hora)), null) + $a;
ksort($c);
for ($i = 0; $i < 17; $i++) {
    $horas = $c[$i];
    $stmt = $mysqli->prepare("INSERT INTO `ebspma`.`sala_ocupacao` (id_dia, id_sala, id_tempo) VALUES (?, ?, ?);")or die(json_encode(mysqli_error($mysqli)));
    $stmt->bind_param('ssi', $dia, $sala, $horas);
    if (!$stmt->execute()) {
        echo json_encode(array('status' => 'error', 'message' => 'Opppss...Os Registo(s) não foram gravado(s)'));
    }
}
$response = "Registo(s) gravado(s) com sucesso";
echo json_encode($response);
$stmt->close();

在实模式下我有这个

Request URL: http://localhost/multiple/registerBd.php
Method: POST
Status: Request was cancelled.

Request Headers
Accept: application/json, text/javascript, */*; q=0.01
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
Origin: http://localhost
Referer: http://localhost/multiple/registo_salas.php
User-Agent: Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.44 (KHTML, like Gecko) JavaFX/8.0 Safari/537.44
X-Requested-With: XMLHttpRequest

Request data

dia=2&sala=5&hora%5B%5D=1&hora%5B%5D=2&hora%5B%5D=3&num=3

CallStack
send ([native code]:0:0)
send (https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js:4:25552)
ajax (https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js:4:21305)
postData (registo_salas.php:104:26)
onsubmit (registo_salas.php:116:27)

更新4

我不知道这是否是你的意思...但我不认为这是(我的错...)

<script>
            $('#salas').on('submit', function(event) {
                event.preventDefault();
                function postData(){
                var dia = document.getElementById('dia').value;
                var sala = document.getElementById('sala').value;
                var tempos = [];
                var s = document.getElementById('hora');
                for (var i = 0; i < s.options.length; i++) {
                    if (s.options[i].selected == true) {
                        var valores = s.options[i].value;
                        tempos.push(valores);
                    }
                }
                console.log(tempos);
                var num = document.getElementById('num').value;
                event.preventDefault();
                    $.ajax({ 
                            type: "POST",
                            dataType: "json",
                            url: "registerBd.php",
                            data : {'dia': dia, 'sala': sala, 'hora': tempos, 'num': num},
                            success: function (response) {
                            console.log(response);
                            $('#ajaxDivOk').css("display", "block");
                            $('#ajaxDivOk').html("Registo(s) gravado(s) com sucesso");
                            alert(response);
                         },
                            error: function(jq,status,message) {
                            console.log( message );
                            alert('A jQuery error has occurred. Status: ' + status + ' - Message: ' + message);
                            }
                       });
                       return false;
                }
              });

我明白

Uncaught ReferenceError :提交数据时未定义@ registo_salas.php:120

最佳答案

我在这里看到一些问题:

  1. 您正在发送回 json,但您在 ajax 调用中指定了 dataType: "html",。您应该将其更改为 dataType: "json",
  2. 您正在混合 mysql api:
    或 die(mysql_error($mysqli));
    您不能使用任何 mysql_* 函数正在使用mysqli_*。你需要类似的东西:
    or die(mysqli_error($mysqli));
  3. 如果您确实返回 json,则需要确保错误消息也是有效的 json,因此第二个确实应该是(也适用于其他实例):
    或者死(json_encode(mysqli_error($mysqli)));
  4. 一个潜在的问题是您在 ajax 调用中没有正确编码查询字符串。您可以使用对象让 jQuery 来处理这个问题:
    var data = {'dia': dia, 'sala': sala, etc.};

编辑:根据您的上次更新,您似乎没有取消默认提交事件。您确实从函数中返回了 false,但您没有对该值执行任何操作。

你应该改变:

<form method="post" id="salas" name="salas" onsubmit="postData()" >

至:

<form method="post" id="salas" name="salas" onsubmit="return postData();" >

虽然,当您使用 jQuery 时,更好的解决方案是删除内联 JavaScript 并将其移动到脚本部分:

$('form').on('submit', function(event) {
  event.preventDefault();

  // the rest of your javascript that is now in your `postData()` function
});

关于javascript - Ajax成功返回,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/29917249/

相关文章:

jquery - 如何在 Highcharts 中超链接条形图

javascript - 元素的高度为 0px

javascript - 如何在Javascript对象中实现多个新功能?

php 301 redirects 实际上做的是 302 redirect

javascript - 加载模板 dom 时 angular2 模板/ Hook 中的脚本标记

javascript - ESXi Web 客户端自动填充凭据

javascript - 为什么 Firefox 从 CSS 填充值的 parseInt 返回 NaN?

javascript - 如何判断粘贴的数据是否是从我的页面复制的?

php - 我可以计算 session 以确定在线人数吗?

php - MySql 中的 REPLACE、INSERT、UPDATE 有什么区别?