angularjs之级联菜单
原理:
1.ng-options中val.id as val.name for val in cascading 将id的值赋给 mg-modelone
2.在通过ng-change传给函数
3.当一级下拉菜单的值改变后,执行函数,去后台请求二级下拉菜单的数据,并加载
angularjs代码:
app.controller('addmultiple_scontroller', function($scope, $http) {
//常量
$scope.postCfg = postCfg;
$scope.modelone = "";
$scope.modeltwo = "";
$http.post("./getAllExamNameByTid.action").success(function(res) {
$scope.cascading = res;
});
$scope.changeone = function(val) {
if(null != val){
$http.post("./getAllExamClassifyByEnid.action",{
"en_id": val
},$scope.postCfg).success(function(res) {
$scope.cascadingtwo = res;
});
}
}
});
html代码:
<p>
<label>
<span>所属题库:</span>
<select ng-model="modelone" ng-options="val.id as val.name for val in cascading" ng-change="changeone(modelone)">
<option value="">--请选择--</option>
</select>
</label>
<label>
<select name="" ng-model="modeltwo" ng-options="val.id as val.name for val in cascadingtwo">
<option value="">--请选择--</option>
</select>
</label>
</p>
angularjs之级联菜单的更多相关文章
- JS实战 · 级联菜单选择省份和城市(两种)
DOM编程步骤.思路 1.定义界面: 通过html标签将数据进行封装: 2.定义一些静态样式: 利用css: 3.需要动态地完成的和用户的交互: a:明确事件源: ...
- JS动态级联菜单
JS动态级联菜单是前端常用的一个功能,特此抽时间研究了下,附上代码 <html> <head> <meta charset="utf-8" /> ...
- 前台JS(Jquery)调用后台方法 无刷新级联菜单示例
前台用AJAX直接调用后台方法,老有人发帖提问,没事做个示例 下面是做的一个前台用JQUERY,AJAX调用后台方法做的无刷新级联菜单 http://www.dtan.so CasMenu.aspx页 ...
- 使用json方式实现省市两级下拉级联菜单[原创]
本文为博主原创,转载请注明. 首先看一下实现后的效果图: 当然,要完成这个实验,mysql必须与数据库连接,这里选用navicat for mysql这款软件,它与mysql的契合度是很高的,配置环境 ...
- Ajax实现动态的二级级联菜单
今天花了点时间用Ajax实现了一个二级级联菜单.整理总结一下.为了把重点放在Ajax和级联菜单的实现上,本文省略了数据库建表语句和操作数据库的代码! 数据库建表语句就不帖出来了.主要有两张表,区域表: ...
- [python] 初学python,级联菜单输出
#Author:shijt china_map = { "河北": { '石家庄': ['辛集', '正定', '晋州'], '邯郸': ['涉县', '魏县', '磁县'], ' ...
- javascript实现select菜单/级联菜单(用Rails.ajax实现发送请求,接收响应)
在购物网站,填写收货地址的时候,会出现XX省XX市XX区的下拉菜单,如何实现此功能?思路是什么? 功能设置: 当选择省select菜单后,市的select菜单为这个省的城市列. 当选择市菜单后,区菜单 ...
- Excel操作之级联菜单
设置级联菜单主要用的是excel的数据验证功能.下面以简单的设置城市选择框为例: 1.准备好数据 2.给所有省份起个名称(例如:省份),然后同样方法给每个省份所对应的城市以其省份命名,(例如:南京.苏 ...
- js实现级联菜单(没有后台)
html代码: <!-- js级联菜单 --> <div id="cascMenu"> <select id="select" o ...
随机推荐
- 跟踪Makefile输出调试信息
/********************************************************************* * 跟踪Makefile输出调试信息 * 说明: * 有时 ...
- PHP---文件上传与下载
转自http://www.cnblogs.com/lazycat-cz/p/4113037.html 安全性能---水平不够 ╮(╯_╰)╭ 文件上传--->就是将本地的文件上传到服务器上.(H ...
- 神器如 dnSpy,无需源码也能修改 .NET 程序
dnSpy 是 0xd4d 开发的 .NET 程序调试神器. 说它是神器真的毫不为过!它能在完全没有源码的情况下即时调试程序,甚至还能修改程序!本文讲向大家介绍如何使用 dnSpy 修改 .NET 程 ...
- 《DSP using MATLAB》示例Example 8.20
%% ------------------------------------------------------------------------ %% Output Info about thi ...
- 《selenium2 python 自动化测试实战》(3)——操作测试对象
上一节我们说了如何定位元素,定位到元素以后就涉及到对元素的操作了,webdriver中常用的操作元素的方法有: clear ——用于清除输入框的默认内容 send_keys ——用于在一个输入框里 ...
- cell的循环利用
方式1 // 1.先根据cell的标识去缓存池中查找可循环利用的cell UITableViewCell *cell = [tableView dequeueReusableCellWithIdent ...
- javascript把json串转成对象
// 这个是待转的json串 var jstr = "{'a':100,'b':'aaa'}"; // 经过下面语句把这个语句描述的对象数据,赋给这个m对象了 eval (&quo ...
- Nchan nginx 支持的开源消息推送模块
1. 介绍 // 官方说明 Nchan is a scalable, flexible pub/sub server for the modern web, built as a module for ...
- toxiproxy 安装试用
备注: 实际上是一个代理工具,但是又不是简单的进行代理(tcp,可以配置策略,toxics 实现延迟,模拟故障, 对于这个大家可能了解的就是netflix 公司的chaos monkey, ...
- cocos2dx调度器(scheduler)
调度器(scheduler) http://cn.cocos2d-x.org/article/index?type=cocos2d-x&url=/doc/cocos-docs-master/m ...