编辑:形式将触发PHP代码,并导致其空数据写信给我的JSON文件。我怎样才能让我的角度形式发送正确的数据到我的PHP代码?Angular.js,PHP,JSON形式不工作
我是angular.js的新手,我一直没有在php工作过一段时间,但我正在尝试构建一个非常简单的角度表单,并将数据发送到一个php文件,然后写入信息到JSON文件。角度表单位于不同于php和JSON文件的服务器上。下面是我到目前为止有:
索引页:
<!DOCTYPE html>
<html lang="en" data-ng-app="myApp">
<head>
<title>AngularJS Form</title>
<script type="text/javascript" src="http://code.angularjs.org/1.2.25/angular.min.js"></script>
<script type="text/javascript" src="js/modules/promise-tracker.js"></script>
<script type="text/javascript" src="js/app.js"></script>
<link rel="stylesheet" href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css">
</head>
<body class="container">
<h2>AngularJs form</h2>
<p>This is an AngularJs based form. It uses a controller to handle form validation and submission.</p>
<p>Find a step by step tutorial on this form at <a href="https://www.lullabot.com/blog/article/processing-forms-angularjs">the Lullabot Blog</a>.</p>
<a href="https://github.com/juampy72/angularjs_form"><img style="position: absolute; top: 0; right: 0; border: 0;" src="https://s3.amazonaws.com/github/ribbons/forkme_right_red_aa0000.png" alt="Fork me on GitHub"></a>
<div data-ng-controller="help">
<div id="messages" class="alert alert-success" data-ng-show="messages" data-ng-bind="messages"></div>
<div data-ng-show="progress.active()" style="color: red; font-size: 50px;">Sending…</div>
<form name="helpForm" novalidate role="form">
<div class="form-group">
<label for="name">Your Name </label>
<span class="label label-danger" data-ng-show="submitted && helpForm.name.$error.required">Required!</span>
<input type="text" name="name" data-ng-model="name" class="form-control" required />
</div>
<div class="form-group">
<label for="comments">Description</label>
<span class="label label-danger" data-ng-show="submitted && helpForm.comments.$error.required">Required!</span>
<textarea name="comments" data-ng-model="comments" class="form-control" required></textarea>
</div>
<button data-ng-disabled="progress.active()" data-ng-click="submit(helpForm)" class="btn btn-default">Submit</button>
</form>
</div>
</body>
</html>
角代码:
/**
* AngularJS module to process a form.
*/
angular.module('myApp', ['ajoslin.promise-tracker'])
.controller('help', function ($scope, $http, $log, promiseTracker, $timeout) {
$scope.subjectListOptions = {
'bug': 'Report a Bug',
'account': 'Account Problems',
'mobile': 'Mobile',
'user': 'Report a Malicious User',
'other': 'Other'
};
// Inititate the promise tracker to track form submissions.
$scope.progress = promiseTracker();
// Form submit handler.
$scope.submit = function(form) {
// Trigger validation flag.
$scope.submitted = true;
// If form is invalid, return and let AngularJS show validation errors.
if (form.$invalid) {
return;
}
// Default values for the request.
var config = {
params : {
'callback' : 'JSON_CALLBACK',
'name' : $scope.name,
'comments' : $scope.comments
},
};
// Perform JSONP request.
var $promise = $http.jsonp('process.php', config)
.success(function(data, status, headers, config) {
if (data.status == 'OK') {
$scope.name = null;
$scope.comments = null;
$scope.messages = 'Your form has been sent!';
$scope.submitted = false;
} else {
$scope.messages = 'Oops, we received your request, but there was an error processing it.';
$log.error(data);
console.log($scope.name);
}
})
.error(function(data, status, headers, config) {
$scope.progress = data;
$scope.messages = 'There was a network error. Try again later.';
$log.error(data);
console.log('name:', $scope.name);
})
.finally(function() {
// Hide status messages after three seconds.
$timeout(function() {
$scope.messages = null;
}, 3000);
});
// Track the request and show its progress to the user.
$scope.progress.addPromise($promise);
};
});
PHP代码:
<?php
$myFile = "data.json";
$arr_data = array(); // create empty array
try
{
//Get form data
$formdata = array(
'name'=> $_POST['name'],
'comments'=> $_POST['comments'],
);
//Get data from existing json file
$jsondata = file_get_contents($myFile);
// converts json data into array
$arr_data = json_decode($jsondata, true);
// Push user data to array
array_push($arr_data,$formdata);
//Convert updated array to JSON
$jsondata = json_encode($arr_data, JSON_PRETTY_PRINT);
//write json data into data.json file
if(file_put_contents($myFile, $jsondata)) {
//echo 'Data successfully saved';
}
else
echo "error";
}
catch (Exception $e) {
echo 'Caught exception: ', $e->getMessage(), "\n";
}
?>
欢迎来到Stack Overflow!你的问题是什么?你已经发布了一堆代码,但没有说明你面临的问题,如果你没有说出什么问题,我们根本无法提供帮助。考虑[参考]并检查[帮助]以获取更多信息,尤其是[问]页面以及如何编写[mcve]。如果可以,我期待着提供帮助,但这里没有任何事情可以采取行动。 – Delioth
对不起。我想我真的不知道如何词组这个问题,但我的角形式触发我的PHP代码运行,但PHP代码不写相应的数据TOT他JSON文件,角码返回错误。我想知道如何解决这个问题? – kyofanatic1
你的头衔应该是什么意思? Angularjs比php更好,php比json更好?还是你给他们数值?是某种有条件的吗?或者它只是无稽之谈。 –