Angular之【form提交问题】
前端页面是这样:
<form class="form-horizontal" role="form" name="LoginForm" >
<div class="list list-inset">
<label class="item item-input">
<input type="text" placeholder="用户名" ng-model="userInfo.username">
</label>
<label class="item item-input">
<input type="password" placeholder="密码" ng-model="userInfo.password">
</label>
</div>
<button type="submit" ng-disabled="LoginForm.$invalid" class="button button-block button-balanced" ng-click="login()">登录</button>
<p class="text-center"> <a ui-sref="register">注册</a></p>
</form>
而angular是这样的
var McardController = angular.module('McardController', [ 'angular-flash.service', 'angular-flash.flash-alert-directive' ])
.config(function (flashProvider) {
// Support bootstrap 3.0 "alert-danger" class with error flash types
flashProvider.errorClassnames.push('alert-danger');
});
McardController.controller('LoginCtrl', function($scope, $http, $window, $location, flash, LoginService, $ionicPopup, $state) {
$scope.userInfo = {};//这里如果没有初始化,表单提交过来是接收不到数据的。这个地方值得我们注意下
/* $http.get('/api/login')
.success(function(data){
// $scope.cards = data;
}).error(function(data){
console.log('Error:'+data);
});*/
$scope.failed_login = "";
$scope.login = function() {
console.log($scope.userInfo);
$scope.$parent.failed_login = "";
var user = {"username": $scope.userInfo.username, "password": $scope.userInfo.password};
console.log(user);
if($scope.userInfo.username!==undefined || $scope.userInfo.password !==undefined){
// $http({method: 'POST', url: '/api/login', user:user}).
$http.post('/api/login', $scope.userInfo).
success(function(data, status, headers, config) {
console.log("login success");
flash.success = "Success";
// $window.location.href="/configure";
$location.path('/configure');
}).
error(function(data, status, headers, config) {
var alertPopup = $ionicPopup.alert({
title: '登录失败!',
template: '请检查你的账号!'
});
});
}
/* LoginService.loginUser($scope.userInfo).success(function(data) {
// var user = {"username": $scope.username, "password": $scope.password};
$http.post('/api/signup', $scope.userInfo)
.success(function(data){
$location.path('/home');
}).error(function(data){
console.log('Error:'+data);
});
$state.go('tab.dash');
}).error(function(data) {
var alertPopup = $ionicPopup.alert({
title: '登录失败!',
template: '请检查你的账户!'
});
});*/
}
})
Angular之【form提交问题】的更多相关文章
- AngularJS系列:表单全解(表单验证,radio必选,三级联动,check绑定,form提交验证)
一.查看$scope -->寻找Form控制变量的位置 Form控制变量 格式:form的name属性.input的name属性.$... formName.inputField.$pristi ...
- 关于button和form提交的一些问题
1.form 中type 为submit 和button的区别 submit是button的一个特例,也是button的一种,它把提交这个动作自动集成了. 如果表单在点击提交按钮后需要用JS进行处理( ...
- 解析:使用easyui的form提交表单,在IE下出现类似附件下载时提示是否保存的现象
之前开发时遇到的一个问题,使用easyui的form提交表单,在Chrome下时没问题的,但是在IE下出现类似附件下载时提示是否保存的现象. 这里记录一下如何解决的.其实这个现象不光是easyui的f ...
- struts2中form提交到action中的中文参数乱码问题解决办法(包括取中文路径)
我的前台页是这样的: <body> <form action="test.action" method="post"> ...
- jquery.form.js实现将form提交转为ajax方式提交的使用方法
本文实例讲述了jquery.form.js实现将form提交转为ajax方式提交的方法.分享给大家供大家参考.具体分析如下: 这个框架集合form提交.验证.上传的功能. 这个框架必须和jquery完 ...
- jquery.validate+jquery.form提交的三种方式
原文:http://www.cnblogs.com/datoubaba/archive/2012/06/06/2538873.html jquery.validate+jquery.form提交的三种 ...
- Extjs ajax form 提交
1.form 提交 form.form.submit({ url: "/HandlerExcelToDB/UploadFile.ashx", params: {}, success ...
- 2016 系统设计第一期 (档案一)jQuery ajax serialize()方法form提交数据
jQuery ajax serialize()方法form提交数据,有个很奇怪的问题,好像不能取到隐藏控件的值. //点击提交按钮保存数据 $('#btn_submitUser').click(fun ...
- HttpWebRequest结合HtmlAgilityPack实现网页form提交
年前一个项目,需要在某个系统实现系统自动操作. 系统页面使用form提交,页面参数较多,也参数设计一系列计算逻辑,改动一个值,其他值自动改变. 传统方法使用正则表达式匹配参数,构建post参数进行请求 ...
- 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 ...
随机推荐
- 关于File.getPath,File.getAbsolutePath,File.getCanonicalPath的区别
这个问题, 不了解一下还是挺恍惚它们之间的区别的. 其实也挺简单的. getPath()-->>new File()时的路径 getAbsolutePath()-->>当前路径 ...
- linux_nand_driver
本文的主要目的是,看了之后,你应该对Nand Flash的硬件特性以及对应的Linux下软件平台有了基本的认识,进一步地,对如何实现Linux下的Nand Flash的驱动,知道要做哪些事情了,以及大 ...
- 小白日记10:kali渗透测试之端口扫描-UDP、TCP、僵尸扫描、隐蔽扫描
端口扫描 二三四层发现的目的只是为了准确发现所有活着主机IP,确定攻击面,端口扫描即发现攻击点,发现开放端口.端口对应网络服务及应用端程序,服务端程序的漏洞通过端口攻入.[所有的扫描结果,都不要完全相 ...
- mongoDB 插入数据 用java实现
import java.net.UnknownHostException; import com.mongodb.BasicDBObject; import com.mongodb.DB; impor ...
- python(1) - 数据类型和变量
数据类型: 整数:就是整数,包括正整数,0,负整数 浮点数: 通俗点说,就是小数 长整数: 就是比较长的整型,通常后面会跟一个L 字符串: 字符串需要用""或''括起来.单引号和双 ...
- oracle 10g升级到11g
Linux 上Oracle RAC 10g 升级到 Oracle RAC 11g 了解如何在 Oracle Enterprise Linux 5 上逐步将 Oracle RAC 10g 第 2 版升级 ...
- Adobe Edge Animate –EdgeCommons Log和全局变量设置功能
Adobe Edge Animate –EdgeCommons Log和全局变量设置功能 版权声明: 本文版权属于 北京联友天下科技发展有限公司. 转载的时候请注明版权和原文地址. 一.Log功能 当 ...
- [改善Java代码]不要让类型默默转换
建议23:不要让类型默默转换 public class Client { // 光速是30万公里/秒,常量 public static final int LIGHT_SPEED = 30 * 100 ...
- CSE(Corrupted State Exceptions) 严重异常处理办法
原因分析 出现这个问题说明.NET版本至少是4.0,因为微软在.NET 4.0版本中更改了异常处理机制.微软认为catch(Exception)这种写法是不负责任的,程序员应该按照异常严重类别决定程序 ...
- css3 calc():css简单的数学运算-加减乘除
css3 calc():css简单的数学运算–加减乘除 多好的东西啊,不用js,一个css就解决了. .box{ border:1px solid #ddd; width:calc(100% - 10 ...