編輯:形式將觸發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更好?還是你給他們數值?是某種有條件的嗎?或者它只是無稽之談。 –