easyui-combobox與Select控件联动&&赋值筆記

双击select 移除某项ondblclick="this.removeChild(this.options[this.selectedIndex])"
不必在option 上定义 。代码如下:

<select style="width:400;height:300;" multiple="true"
ondblclick="this.removeChild(this.options[this.selectedIndex])">
<option value="aaa">aaa</option>
<option value="aaa">bbb</option>
<option value="aaa">ccc</option>
<option value="aaa">ddd</option>
<option value="aaa">eee</option>
</select>

//////////////////////////////////////////
//easyui-combobox联动
<input id="cc1" class="easyui-combobox" data-options="
value:‘请选择...‘,
editable:false,
valueField: ‘catCode‘,
textField: ‘desc1‘,
url: ‘${pageContext.request.contextPath}/Coupon/Couponitemlist‘,
onSelect: function(rec){
 
var url = ‘${pageContext.request.contextPath}/Coupon/Couponitemlist2?cat=‘+rec.catCode;
$(‘#cc2‘).combobox(‘reload‘, url);

}">
<input id="cc2" class="easyui-combobox" data-options=" value:‘请选择...‘,editable:false,valueField:‘itemCode‘,textField:‘desc1‘ ,onSelect: function(row){
var opts = $(this).combobox(‘options‘);
var desc1=row[opts.textField];
var code=row[opts.valueField];
var showstring=‘<option value=‘+code+‘>‘+desc1+‘</option> ‘
<!-- $(‘#select1‘).append(showstring);-->
sll(desc1,showstring)
}">

<select ondblclick="this.removeChild(this.options[this.selectedIndex])" multiple id="select1" style="width:300px;height:200px;" >
<option value="测试移除">测试移除</option>

//////判断select1的内容,有重复的不添加,,在cc2中引用此函数select(desc1,showstring)

function sll(desc1,showstring){
var sell=document.getElementById(‘select1‘);
if(sell.length==0){ $(‘#select1‘).append(showstring);alert("第一个");}
else{
alert("已有"+sell.length);
var qq="ture"
for(var i=0;i<sell.length;i++){
if(desc1==sell.options[i].text){
qq="false";
alert(desc1+"此选项已选择,不能重复选择");
return;
}
}
if( qq="ture"){
$(‘#select1‘).append(showstring);
}
}
}

时间: 2024-10-13 01:17:24

easyui-combobox與Select控件联动&&赋值筆記的相关文章

js代码赋值触发select控件的onchange事件

嗯,现在在一个小公司实习,直接接触代码收获不小.  现在有个需求是4级联动的select过滤,需要js代码赋值并触发onchange来调用ajax方法,于是问题是怎样触发,找了些资料并且自己尝试了一下,验证无误. 代码在chrome.IE8.ff浏览器测试均通过,记在这里以备查阅~ <html> <head> </head> <body> <select id="sel" name="mysel" onchang

WinForm控件复杂数据绑定常用数据源(对Combobox,DataGridView等控件DataSource赋值的多种方法)

开始以前,先认识一下WinForm控件数据绑定的两种形式,简单数据绑定和复杂数据绑定. 1) 简单数据绑定 简单的数据绑定是将用户控件的某一个属性绑定至某一个类型实例上的某一属性.采用如下形式进行绑定:引用控件.DataBindings.Add("控件属性", 实例对象, "属性名", true); 2) 复杂数据绑定 复杂的数据绑定是将一个以列表为基础的用户控件(例如:ComboBox.ListBox.ErrorProvider.DataGridView等控件)绑

前端学习之select控件的使用2,省市县三级联动选择,select控件属性、方法、事件的综合应用

总结select控件的属性.方法.事件的使用.数据源使用json数据,包括json数据的遍历. <label for="sheng">省</label> <select id="sheng" name="sheng"> <option value='00'>请选择</option> <option value='11'>北京市</option> <optio

winform用户控件、动态创建添加控件、timer控件、控件联动

用户控件:(1) 相当于自定义的一个panel 里面可以放各种其他控件,并可以在后台一下调用整个此自定义控件. 使用方法:在项目上右键.添加.用户控件,之后用户控件的编辑与普通容器控件类似.如果要在后台往窗体中添加, 将其实例化,然后添加到想要添加的容器的Control集合中. 动态创建添加控件: 配合上面的用户控件,实现类似QQ界面的打开自动加载好友昵称和签名 public Form1() { InitializeComponent(); //将当前登陆的账号的全部好友信息取出来 List<A

JavaScript封装一个实用的select控件

最近一直把精力放在项目上面,导致忽略的一些底层的东西.以前就一直觉得原有的select控件很丑,正好周末有时间,试着做了一个简单封装,实现了它的基本功能.我总结了一下,大概分为三个部分: 1.对显示样式的处理 2.对点击和hover事件的处理 3.change事件发送请求的处理 我们先看jsp的展示代码: <%@ page language="java" import="java.util.*" pageEncoding="utf-8"%&

模拟select控件&amp;&amp;显示单击的坐标&amp;&amp;用户按下键盘,显示keyCode

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-

JQuery select控件的相关操作

本文转载于 http://www.cnblogs.com/zfc2201/archive/2012/09/06/2674312.html JQuery获取和设置Select选项方法汇总如下: 获取select 先看看下面代码: $("#select_id").change(function(){//code...}); //为Select添加事件,当选择其中一项时触发 var checkText=$("#select_id").find("option:s

js操作select控件大全(包含新增、修改、删除、选中、清空、判断存在等)

原文:js操作select控件大全(包含新增.修改.删除.选中.清空.判断存在等) js操作select控件大全(包含新增.修改.删除.选中.清空.判断存在等) js 代码// 1.判断select选项中 是否存在Value="paraValue"的Item        function jsSelectIsExitItem(objSelect, objItemValue) {            var isExit = false;            for (var i

HTML的select控件美化

CSS: .div-select { border: solid 1px #999; height: 40px; line-height: 40px; cursor: default; } .div-select-text { float: left; background-color: #fff; height: 100%; word-break: keep-all; overflow: hidden; cursor: default; } .div-select-text > div { p