自己写了一个带搜索功能的多选下拉框,为了要获取值,就没有封装插件,实现思路

1.一个文本框 做搜索

2.一个文本框显示选中文本,一个隐藏控件存值

3.一个div里面绑定CheckBoxList控件(这里,你也可以请求后直接插入checkbox)

代码

1.一个变量把div的html存起来

2.选中就加到文本框,取消就减掉

//选中记录,反选删除
$("#divChkList :checkbox").each(function () {
$(this).click(function () {
var $txtList = $("#txtList");
if (this.checked) {
$txtList.val($txtList.val() + $(this).next().text() + ",");
$("#hid_id").val($("#hid_id").val() + $(this).val() + ",");
}
else {
$txtList.val($txtList[0].value.replace($(this).next().text() + ',', ''));
$("#hid_id").val($("#hid_id").val().replace($(this).val() + ',', ''));
}
});
});

3.搜索

//判断是否包含,包含则选中
if ($("#txtList").val().indexOf($(this).next().text()) > -1) {
$(this).attr("checked", true);
}
else {
$(this).attr("checked", false);
}

//全选反选

//全选/反选
function allcb() {
if ($("#all").attr("checked") == "checked") {
$("#divChkList :checkbox").each(function () {
$(this).attr("checked", true);
var $txtList = $("#txtList");
if ($txtList.val().indexOf($(this).next().text()) == -1) {
$txtList.val($txtList.val() + $(this).next().text() + ",");
$("#hid_id").val($("#hid_id").val() + $(this).val() + ",");
}
});
}
else {
$("#divChkList :checkbox").each(function () {
$(this).attr("checked", false);
});
$("#txtList").val("");
$("#hid_id").val("");
}
}

具体代码:

http://download.csdn.net/detail/jine515073/9445968

多选下拉框带搜索(aps.net)的更多相关文章

  1. yii2下拉框带搜索功能

    简单的小功能,但是用起来还是蛮爽的.分享出来让更多的人有更快的开发效率,开开心心快乐编程.作者:白狼 出处:http://www.manks.top/yii2_dropdown_search.html ...

  2. js:jquery multiSelect 多选下拉框实例

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  3. 自定义SWT控件二之自定义多选下拉框

    2.自定义下拉多选框 package com.view.control.select; import java.util.ArrayList; import java.util.HashMap; im ...

  4. pentaho cde 自定义复选下拉框 checkbox select

    pentaho  自带的component 虽多,但是当用户需要在一个表格中查看多个组别的数据时,pentaho自带的单选框就不能实现了,所以复选下拉框势在必行,实现效果如下: 实现原理是借用了jqu ...

  5. EazyUI_Datagrid_行内编辑(editor)的combobox下拉框带图片

    1.业务需求: 商品的明细列表里面下拉框需要 [图片+文字 ] 显示 2.我们使用的是EazyUI,而我比较懒,不习惯用拼接html来显示列表页面,使用的是eazyui的数据网格(datagrid) ...

  6. Easyui-Combobox多选下拉框

    因为工作需要,引入combobox多选下拉框,并且获取选择的值并以","分开. 效果如下: 代码如下: <html> <head> <title> ...

  7. Extjs4.2 多选下拉框

    //多选下拉框 Ext.define('MDM.view.custom.MultiComboBox', { extend: 'Ext.form.ComboBox', alias: 'widget.mu ...

  8. DropDownList单选与多选下拉框

    一.单选DropDownList传值 1.添加界面的DropDownList显示值问题 (1)在方法内添加ViewData的方法: var ad = new UnitsRepository(); Vi ...

  9. Bootstrap3级联多选下拉框

    <!DOCTYPE html> <html> <head> <title>Bootstrap3级联多选下拉框</title> <met ...

随机推荐

  1. Package CJK Error: Invalid character code. 问题解决方法--xelatex和pdflatex编译的转换

    Package CJK Error: Invalid character code. 问题解决方法--xelatex和pdflatex编译的转换 解决方法:添加格式说明信息 将下面语句: \docum ...

  2. Python 的黏包问题

    Client 端内的代码: #Author:BigBao #Date:2018/7/4 import socket import struct client=socket.socket(socket. ...

  3. rocketmq 学习记录-2

    产品选型 我们在进行中间件选型时,一般都是通过下面几点来进行产品选型的: 1.性能 2.功能支持程度 3.开发语言(团队中是否有成员熟悉此中间件的开发语言,市场上此种语言的开发人员是否好招) 4.有多 ...

  4. JSTL标签之&lt;c:choose&gt;&lt;c:when&gt;&lt;c:otherwise&gt;标签

    假设是JSTL1.1版本号,使用<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" ...

  5. Android:相机适配及图片处理的一些问题

    链接:http://www.cnblogs.com/liushilin/p/6387263.html 链接:http://www.cnblogs.com/liushilin/p/5956691.htm ...

  6. 常用的NodeJS模块

    图片处理 1.Manipulate images 官网:http://github.com/aheckmann/gm ImageMagick和GraphicsMagick主要用于图片的创建.编辑.合成 ...

  7. 菜鸟调错(一)——Maven项目部署到Jboss出现:Failed to create a new SAX parser

    今天调试的时候遇到一个错误,往Jboss的deploy目录扔war包的时候,报了一个“Failed to create a new SAX parser”的错误.在网上找了找解决方案,一般都说将项目中 ...

  8. adb devices连接提示 Android offline或unauthorized的解决办法

    我有一个华为X1手机,版本是Android 4.2.2(我的手机是Android 4.0版本), 但之前用adb连接(包括usb/tcp)时总莫名其妙出现offline或unauthorized的问题 ...

  9. (原创)谈谈boost.asio的异步发送

    在上一篇博文中提到asio的异步发送稍微复杂一点,有必要单独拿出来说说.asio异步发送复杂的地方在于: 不能连续调用异步发送接口async_write,因为async_write内部是不断调用asy ...

  10. django model form 保存方法 django-rest-framework save 修改某一项值 方法

    django Model Form django-rest-framework save 方法 修改某个数据的值