欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

AngularJS表单编辑提交功能实例

程序员文章站 2022-04-26 15:45:22
研究了下高大上的angularjs决定试试它的表单编辑提交功能,据说比jquery强的不是一星半点。 好奇呀,试试吧。。。。。搞了好久,尼玛。。。靠。。靠。。靠。。尼玛...

研究了下高大上的angularjs决定试试它的表单编辑提交功能,据说比jquery强的不是一星半点。
好奇呀,试试吧。。。。。搞了好久,尼玛。。。靠。。靠。。靠。。尼玛 。。靠。。靠。。。。好吧,谁让我手欠呢。

搜索到了很多关于angularjs form的案例
如:

http://www.angularjs.cn/a08j

模仿着我要搞了个angularjs form,但是问题来了。。。。
发现初始化时候ng-model 跟 input 标签里的 value 不默契,冲突。。
后来想再angularjs controller 里预先赋值 $scope.formdata = {‘name':'张三'};
可以通过php程序把值赋到这个angularjs controller里

复制代码 代码如下:

<!-- angularjs controller -->
<script>
    var formapp = angular.module('formapp', []);
    function formcontroller($scope, $http) {
        $scope.formdata = {'name':'张三','remark':'备注'};
        $scope.myform = function() {
            $http({
                method  : 'post',
                url     : '/role/edit',
                data    : $.param($scope.formdata),  // pass in data as strings
                headers : { 'content-type': 'application/x-www-form-urlencoded' }  // set the headers so angular passing info as form data (not request payload)
            })
                .success(function(data) {
                    console.log(data);
                    if (!data.success) {
                    } else {
                    }
                });
        };
    }
</script>
<!--对应form里的input调整-->
<input type="text" name="name" ng-model="formdata.name" class="form-control" placeholder="role name">

后来又搜啊搜 发现还有其他办法,这么个东东 ng-init=”formdata.name='张三'”

复制代码 代码如下:

<input type="text" name="name" ng-model="formdata.name" ng-init="formdata.name='张三'" value="">