Angularjs - 簡單表格提交
2022-08-30 09:22:02
我正在与AngularJs一起学习曲线,我发现几乎没有任何示例可用于现实世界。
我试图清楚地了解如何提交具有最标准组件的表单并将其传递到PHP文件。
我的小提琴。
有没有人在提交简单,无污染的表格方面有任何好的例子,可以帮助我和许多其他Angularjs初学者。
当我说一个干净的形式时,我指的是这样的东西。
<div ng-app="myApp">
<form name="saveTemplateData" action="#" ng-controller="FormCtrl" ng-submit="submitForm()">
First name: <br/><input type="text" ng-model="form.firstname"> <br/><br/>
Email Address: <br/><input type="text" ng-model="form.emailaddress"> <br/><br/>
<textarea rows="3" cols="25" ng-model="form.textareacontent"></textarea>
<br/><br/>
<input type="radio" ng-model="form.gender" value="female" />Female ...
<input type="radio" ng-model="form.gender" value="male" />Male <br/>
<br/><br/>
<input type="checkbox" ng-model="form.member" value="5"/> Already a member
<br/><br/>
<input type="file" ng-model="form.file_profile" id="file_profile"><br/>
<input type="file" ng-model="form.file_avatar" id="file_avatar">
<br/><br/>
<!-- <button ng-click="save()" >Save</button> -->
<input type="submit" ngClick="Submit" >
</form>
</div>
我的 ng 应用代码...
var app = angular.module('myApp', []);
app.controller('FormCtrl', function ($scope, $http) {
var formData = {
firstname: "default",
emailaddress: "default",
textareacontent: "default",
gender: "default",
member: false,
file_profile: "default",
file_avatar: "default"
};
$scope.save = function() {
formData = $scope.form;
};
$scope.submitForm = function() {
console.log("posting data....");
formData = $scope.form;
console.log(formData);
//$http.post('form.php', JSON.stringify(data)).success(function(){/*success callback*/});
};
});
我想从现在开始我有三个问题是...
- 我的php文件应该如何与此交互(如何将json字符串获取到php文件中的数组)?
- 当复选框为真时,如何提交复选框的值?
- 我发现很多关于使用jQuery和Angular提交图像的信息,我看到这个提交中已经有一个图像对象,,我该如何检索该数据?图像应包含哪些注意事项?
我愿意采取任何清晰简洁的信息,为大家汇集一个好的学习范例......
我的小提琴