确保json发布数据的Angularjs已经传输

问题描述 投票:0回答:1

我试图将数据从Angularjs应用程序发送到php,以便将其插入到mysql数据库中。我有index.html包含脚本,getUser_api.php页面和insert.php页面

我在控制台中没有错误,但我插入到mysql db中失败了。

那么有没有办法确保是否传输了json数据

var app =   angular.module("app",['ui.router']);    

app.controller("insertCtrl", function($scope,$rootScope, $http) {

$scope.insert = function() {

$http.post(

"getUser_api.php", {

'Customer_Name': $scope.Customer_Name,

'Cust_mail': $scope.Cust_mail,

'Cust_Address': $scope.Cust_Address

 }) ;
 }

 });

我的insert.php页面

<div class="well col-xs-8 col-xs-offset-2" style="margin-top: 10%" ng-controller="insertCtrl"> 

<form>
    <div class="form-group">

        <label>Name</label>
        <input type="text" class="form-control" ng-model="Customer_Name">

    </div>

    <div class="form-group">
        <label> mail</label>
        <input type="text" class="form-control" ng-model="Cust_mail">
    </div>

    <div class="form-group">
        <label>Address</label>
        <input type="text" class="form-control" ng-model="Cust_Address">
    </div>
</form>

    <button class="btn-block btn-info" ng-click="insert()">Insert</button>
</div>

getUser_api

<?php

include('config.php');

$result=mysql_query('select * from customers');

$data['results']=array();

while($row=mysql_fetch_assoc($result)){
array_push($data['results'],$row);
}

if(count($data['results'])>0)
$data['status']='OK';

 else
$data['status']='Z-Result';
echo json_encode($data);

?>
javascript php angularjs json ajax
1个回答
2
投票

如果要手动检查,可以在浏览器中查看它 - XHR选项卡中的开发人员工具。

如果你想在js端捕获错误,你可以这样做:

var dataToSend = {
    'Customer_Name': $scope.Customer_Name,
    'Cust_mail': $scope.Cust_mail,
    'Cust_Address': $scope.Cust_Address
};
var req = {
    method: 'POST',
    url: 'getUser_api.php',
    data: JSON.parse(JSON.stringify(dataToSend))
};
$http(req).then(function (response) {
    //handle success
}, function (error) {
    //handle error
});

如何在浏览器中手动检查:

  1. 打开Chrome并按F12以获取开发人员选项
  2. 单击“网络”
  3. 点击XHR
  4. 现在在你的html页面中点击按钮,它将调用你的inser方法。
  5. 您的请求将显示如下
  6. 单击发送的请求
  7. 点击标题
  8. 您将能够在请求有效负载中看到您的Json

example rquest header

© www.soinside.com 2019 - 2024. All rights reserved.