前端页面是这样:

  1. <form class="form-horizontal" role="form" name="LoginForm" >
  2. <div class="list list-inset">
  3. <label class="item item-input">
  4. <input type="text" placeholder="用户名" ng-model="userInfo.username">
  5. </label>
  6. <label class="item item-input">
  7. <input type="password" placeholder="密码" ng-model="userInfo.password">
  8. </label>
  9. </div>
  10. <button type="submit" ng-disabled="LoginForm.$invalid" class="button button-block button-balanced" ng-click="login()">登录</button>
  11. <p class="text-center"> <a ui-sref="register">注册</a></p>
  12. </form>

 而angular是这样的

  1. var McardController = angular.module('McardController', [ 'angular-flash.service', 'angular-flash.flash-alert-directive' ])
  2. .config(function (flashProvider) {
  3. // Support bootstrap 3.0 "alert-danger" class with error flash types
  4. flashProvider.errorClassnames.push('alert-danger');
  5. });
  6.  
  7. McardController.controller('LoginCtrl', function($scope, $http, $window, $location, flash, LoginService, $ionicPopup, $state) {
  8. $scope.userInfo = {};//这里如果没有初始化,表单提交过来是接收不到数据的。这个地方值得我们注意下
  9.  
  10. /* $http.get('/api/login')
  11. .success(function(data){
  12.  
  13. // $scope.cards = data;
  14. }).error(function(data){
  15.  
  16. console.log('Error:'+data);
  17. });*/
  18. $scope.failed_login = "";
  19. $scope.login = function() {
  20. console.log($scope.userInfo);
  21. $scope.$parent.failed_login = "";
  22. var user = {"username": $scope.userInfo.username, "password": $scope.userInfo.password};
  23. console.log(user);
  24.  
  25. if($scope.userInfo.username!==undefined || $scope.userInfo.password !==undefined){
  26. // $http({method: 'POST', url: '/api/login', user:user}).
  27. $http.post('/api/login', $scope.userInfo).
  28. success(function(data, status, headers, config) {
  29. console.log("login success");
  30. flash.success = "Success";
  31. // $window.location.href="/configure";
  32. $location.path('/configure');
  33. }).
  34. error(function(data, status, headers, config) {
  35. var alertPopup = $ionicPopup.alert({
  36. title: '登录失败!',
  37. template: '请检查你的账号!'
  38. });
  39. });
  40. }
  41. /* LoginService.loginUser($scope.userInfo).success(function(data) {
  42.  
  43. // var user = {"username": $scope.username, "password": $scope.password};
  44.  
  45. $http.post('/api/signup', $scope.userInfo)
  46. .success(function(data){
  47. $location.path('/home');
  48. }).error(function(data){
  49. console.log('Error:'+data);
  50. });
  51. $state.go('tab.dash');
  52. }).error(function(data) {
  53. var alertPopup = $ionicPopup.alert({
  54. title: '登录失败!',
  55. template: '请检查你的账户!'
  56. });
  57. });*/
  58. }
  59.  
  60. })

  

Angular之【form提交问题】的更多相关文章

  1. AngularJS系列:表单全解(表单验证,radio必选,三级联动,check绑定,form提交验证)

    一.查看$scope -->寻找Form控制变量的位置 Form控制变量 格式:form的name属性.input的name属性.$... formName.inputField.$pristi ...

  2. 关于button和form提交的一些问题

    1.form 中type 为submit 和button的区别 submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了. 如果表单在点击提交按钮后需要用JS进行处理( ...

  3. 解析:使用easyui的form提交表单,在IE下出现类似附件下载时提示是否保存的现象

    之前开发时遇到的一个问题,使用easyui的form提交表单,在Chrome下时没问题的,但是在IE下出现类似附件下载时提示是否保存的现象. 这里记录一下如何解决的.其实这个现象不光是easyui的f ...

  4. struts2中form提交到action中的中文参数乱码问题解决办法(包括取中文路径)

    我的前台页是这样的: <body>      <form action="test.action" method="post">     ...

  5. jquery.form.js实现将form提交转为ajax方式提交的使用方法

    本文实例讲述了jquery.form.js实现将form提交转为ajax方式提交的方法.分享给大家供大家参考.具体分析如下: 这个框架集合form提交.验证.上传的功能. 这个框架必须和jquery完 ...

  6. jquery.validate+jquery.form提交的三种方式

    原文:http://www.cnblogs.com/datoubaba/archive/2012/06/06/2538873.html jquery.validate+jquery.form提交的三种 ...

  7. Extjs ajax form 提交

    1.form 提交 form.form.submit({ url: "/HandlerExcelToDB/UploadFile.ashx", params: {}, success ...

  8. 2016 系统设计第一期 (档案一)jQuery ajax serialize()方法form提交数据

    jQuery ajax serialize()方法form提交数据,有个很奇怪的问题,好像不能取到隐藏控件的值. //点击提交按钮保存数据 $('#btn_submitUser').click(fun ...

  9. HttpWebRequest结合HtmlAgilityPack实现网页form提交

    年前一个项目,需要在某个系统实现系统自动操作. 系统页面使用form提交,页面参数较多,也参数设计一系列计算逻辑,改动一个值,其他值自动改变. 传统方法使用正则表达式匹配参数,构建post参数进行请求 ...

  10. spring MVC做form提交Neither BindingResult nor plain target object for bean name 'command' available

    这两天在做spring3.0 MVC+hibernate3.2的练习中,做简单的form提交, 一直报java.lang.IllegalStateException: Neither BindingR ...

随机推荐

  1. Step-by-Step XML Free Spring MVC 3 Configuration--reference

    The release of Spring 2.5 reduce the burden of XML by introduction annotation based configuration, b ...

  2. Scala中的构造器

    Scala中的构造器 Scala中的构造器分为两类,主构造器和辅助构造器 主构造器是通过类名后面跟的括号里加参数列表来定义 辅助构造器是通过关键字this定义 定义一个无参主构造器 class rec ...

  3. jdbc连接池中c3p0的配置文件的详解以及在在java中如何使用

    <c3p0-config> <!-- 默认配置,如果没有指定则使用这个配置 --> <default-config> <property name=" ...

  4. CCOrbitCamera卡牌翻转效果

    static CCOrbitCamera* create(float t, float radius, float deltaRadius, float angleZ, float deltaAngl ...

  5. cocos2dx新建android项目lib拷贝、访问权限等问题集

    win7上面搭建cocos2dx的android项目,用create-android-project.bat新建一个项目时,出现了访问权限和项目无lib的问题. 解决方案: 1.项目无lib问题. 当 ...

  6. css笔记19:浮动的案例

    案例一: 1. 首先是01.html文件: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" &q ...

  7. HTTP协议理解

    HTTP(Hyper Text Transfer Protocol)超文本传输协议,是一种请求响应式协议,类似两国会晤中需要遵守的规则.那么,其中有什么内容特点呢? HTTP特点: 1)支持客户端/服 ...

  8. poj 3177 边连通分量

    思路: dfs求出所有点的low值,然后对每个连通分量进行缩点,可以通过low来进行缩点.虽然在同一连通分量里可能存在不同的low值,但这并不影响缩点.将每个连通分量缩为一个点后,只要求出这个缩点后的 ...

  9. 转: 基于nginx的hls直播系统

    转自:http://blog.csdn.net/cjsafty/article/details/9108587 看点: 1. 详细解解答了 nginx rtmp配置过程. 前写了一篇基于nginx的h ...

  10. 嵌入式开发笔记 - U-Boot相关

    1.U-boot使用准备 1.1 U-boot下载 通过德国的denx软件中心提供的FTP下载合集,下载网址: ftp://ftp.denx.de/pub/u-boot/