select与ajax结合
要实现的功能是,点击select输入框,数据库里面的数据会以option弹出。
这需要用到ajax异步连接数据库
下面贴出代码
先说明一下后台传递的数据是json,以map的形式传入的。后台代码很简单,这里就不累赘了
直接贴出前台代码了
<select id="courseSelect" class="select" size="1" onclick="find()" name="demo1" datatype="*" nullmsg="请选择所在城市!">
</select>
下面是js代码
function find(){
if(document.getElementById("courseSelect").length==0){
$.ajax({
type:"get",
async:true,
url:"curriculum.do",
dataType:"json", //必写
data: {method:"getAllCourseName"},
contentType: "application/x-www-form-urlencoded; charset=utf-8", //防止提交中文乱码
success:function(msg){
for(var mi in msg){ //循环json
var txt2=$("<option value=msg[mi]></option>").text(msg[mi].name);
$("select").append(txt2);
}
}
});
return true;
}else{
return false;
}
}
select中用的是onclick,js语句中记得要用if判断一下
select与ajax结合的更多相关文章
- jquery select 列表 ajax 动态获取数据 模糊查询 分页
最近需要一个这样的select 在网上找的多是数据一次性获取到再通过前端模糊查询匹配的 这样在数据量比较大的情况下不适合 ,所以参考http://www.jq22.com/jquery-info145 ...
- 【jquery】ajax 动态 改变 select下拉框选中的值
//JS<script type="text/javascript> //ajax动态给添加原料的[商品名称]下拉框绑定selected属性 $("#origin_co ...
- ajax省市区三级联动
jdbc+servlet+ajax开发省市区三级联动 技术点:jdbc操作数据库,ajax提交,字符拦截器,三级联动 特点:局部刷新达到省市区三级联动,举一反三可以做商品分类等 宗旨:从实战中学习 博 ...
- JQuery+Ajax制作省市联动
$(document).ready(function () { $("#Province").append("<option value=''>" ...
- 完整的Ajax及三级联动小练习
Ajax结构: var name = $("#text_1").val(); $.ajax({ url: "Ashxs/Handler.ashx",//一般处理 ...
- Ajax.Utility.RegisterTypeForAjax(typeof(_Default)) 的使用
语句的作用:页面注册方法的作用. Ajax.Utility.RegisterTypeForAjax(typeof(命名空间.类名)); 首先要在配置文件里配置 <httpHandlers> ...
- $.ajax()实现简单计算器
1.html页面 a.html <!DOCTYPE html> <html lang="en"> <head> <meta charse ...
- select2中的ajax请求
下面介绍select2.js的方法,已经整理好文件,可以直接下载使用: 实现效果如下: 引用文件:select2.min.css jquery.js select2.full.min.js <h ...
- WEB框架之Ajax
一 Ajax简介 1 Ajax的介绍 AJAX翻译成中文就是"异步Javascript和XML".即使用JavaScript语言与服务器进行异步交互,传输的数据为XML(当然,传输 ...
随机推荐
- C/C++基础知识总结——C++简单程序设计
1. sizeof 1.1 sizeof(类型名) 1.2 sizeof 表达式 1.3 返回所占字节大小 2. I/O流的输出格式 2.1 常用I/O流库操纵符 dec 十进制 he ...
- Discuz开源论坛
Discuz开源论坛本地部署自动生成数据库 这个版本可能比较有点老,但是万变不离其宗,再新的版本都是在已有的基础上更新的,所以掌握方法是最重要的! 先上几张安装成功后的图 (安装成功的论坛首页 ...
- 设置角色遗留问题和为权限设置角色以及EasyUI Tabs的使用
设置角色遗留问题和为权限设置角色以及EasyUI Tabs的使用 ASP.NET MVC+EF框架+EasyUI实现权限管系列 (开篇) (1):框架搭建 (2):数据库访问层的设计Demo ...
- day7 面向对象编程
编程范式 编程是程序员用特定的语法+数据结构+算法组成的代码来告诉计算机如何执行任务的过程,一个程序是程序员为了得到一个任务结果而编写的一组指令的集合,正所谓条条大路通罗马,实现一个任务的方式有很多种 ...
- Hadoop Streaming Command Details and Q&A
Hadoop Streaming Hadoopstreaming is a utility that comes with the Hadoop distribution. The utilityal ...
- 用友CDM系统,将货位间商品移库单(一步)修改为内调出入库单(一步)方法使用
客户一般只购买CDM供应链系统,但是只买供应链模块不能进行内调等操作,据说插件将近15万(坑爹~~~) 货位间商品移库单和内调差不多,区别是货位间移库默认只能选择登陆账号所属机构的货位. 解决方案:分 ...
- ubuntu下vsftpd配置
网上的文章好难懂啊..只想要简单粗暴,弄好能用就行啊,复杂的以后研究不行吗...折腾好久,其实弄出来能用不就这么点内容吗... 本文在Ubuntu Server 14.04 amd64系统测试. 安装 ...
- JS网站当前日期在IE9、Chrome和FireFox中年份显示为113年的解决方法 getFullYear();
JS网站当前日期在IE9.Chrome和FireFox中年份显示为113年的解决方法 getFullYear();
- 从ASP.NET Web API 2 (C#)开始说起
[译]Getting Started with ASP.NET Web API 2 (C#) 单击此处查看原文 HTTP不是单单为网页服务的,它更是一种用于构建API(用于暴露服务和数据)的强大平台. ...
- TestNG中的DataProvider返回Iterator<Object[]>的妙用
TestNG中使用DataProvider有个好处,就是: 1. 在执行用例的时候dataProvider迭代中的每组数据都是作为一个用例执行 2. 在测试数据有规律的情况下,免去了添加testXML ...