下拉选中搜索angularjs-dropdown-multiselect.js

2024-03-28 16:44

本文主要是介绍下拉选中搜索angularjs-dropdown-multiselect.js,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

需要引入angularjs-dropdown-multiselect.js

页面
 <div ng-dropdown-multiselect=""     options="supplierList_data" selected-model="supplierList_select" events="changSelValue_supplierList" extra-settings="mucommonsettings"style=" margin-right: 20px;height: 34px ;border-radius: 3px;width: 200px;float: right;text-indent: 0px; "translation-texts="supplierList_customTexts">  </div>
js配置
//选中类型$scope.supplierList_select = [];//数据源$scope.supplierList_data = [];//多选可以加后面属性全选和全不选$scope.apps_customTexts = {buttonDefaultText: '所属公众号',checkAll:'全选',uncheckAll:'全不选'};
//多选把选中id拼接$scope.changSelValue_supplierList = {onSelectionChanged: function(e) {const lists = $scope.supplierList_select;$scope.param.search_supplier_id = lists ? lists.map(item => item.id).join(',') : '';}};
//设置$scope.mucommonsettings = {smartButtonMaxItems: 2,smartButtonTextConverter: function(itemText, originalItem) {return itemText;},scrollableWidth: '200px',scrollable: true,keyboardControls: true,selectionLimit: 1,  // 选中个数enableSearch: true, // 是否开启搜索框showUncheckAll: false, // 是否显示取消选中按钮checkBoxes: false  // 是否显示普通下拉框};//初始化列表页下拉框填充数据$http({method: 'POST',url: '/xxx/xxx',data: {}}).success(function (res) {$scope.supplierList_data = (res.data.supplierList || []).map(item => ({id: item.supplier_id, //idlabel: item.supplier_alias //显示名称}));});

效果图

如果觉得有用的话,可以点个赞!

这篇关于下拉选中搜索angularjs-dropdown-multiselect.js的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/856152

相关文章

前端原生js实现拖拽排课效果实例

《前端原生js实现拖拽排课效果实例》:本文主要介绍如何实现一个简单的课程表拖拽功能,通过HTML、CSS和JavaScript的配合,我们实现了课程项的拖拽、放置和显示功能,文中通过实例代码介绍的... 目录1. 效果展示2. 效果分析2.1 关键点2.2 实现方法3. 代码实现3.1 html部分3.2

JS 实现复制到剪贴板的几种方式小结

《JS实现复制到剪贴板的几种方式小结》本文主要介绍了JS实现复制到剪贴板的几种方式小结,包括ClipboardAPI和document.execCommand这两种方法,具有一定的参考价值,感兴趣的... 目录一、Clipboard API相关属性方法二、document.execCommand优点:缺点:

Node.js 中 http 模块的深度剖析与实战应用小结

《Node.js中http模块的深度剖析与实战应用小结》本文详细介绍了Node.js中的http模块,从创建HTTP服务器、处理请求与响应,到获取请求参数,每个环节都通过代码示例进行解析,旨在帮... 目录Node.js 中 http 模块的深度剖析与实战应用一、引言二、创建 HTTP 服务器:基石搭建(一

使用Vue.js报错:ReferenceError: “Vue is not defined“ 的原因与解决方案

《使用Vue.js报错:ReferenceError:“Vueisnotdefined“的原因与解决方案》在前端开发中,ReferenceError:Vueisnotdefined是一个常见... 目录一、错误描述二、错误成因分析三、解决方案1. 检查 vue.js 的引入方式2. 验证 npm 安装3.

C# ComboBox下拉框实现搜索方式

《C#ComboBox下拉框实现搜索方式》文章介绍了如何在加载窗口时实现一个功能,并在ComboBox下拉框中添加键盘事件以实现搜索功能,由于数据不方便公开,作者表示理解并希望得到大家的指教... 目录C# ComboBox下拉框实现搜索步骤一步骤二步骤三总结C# ComboBox下拉框实现搜索步骤一这

JS常用组件收集

收集了一些平时遇到的前端比较优秀的组件,方便以后开发的时候查找!!! 函数工具: Lodash 页面固定: stickUp、jQuery.Pin 轮播: unslider、swiper 开关: switch 复选框: icheck 气泡: grumble 隐藏元素: Headroom

认识、理解、分类——acm之搜索

普通搜索方法有两种:1、广度优先搜索;2、深度优先搜索; 更多搜索方法: 3、双向广度优先搜索; 4、启发式搜索(包括A*算法等); 搜索通常会用到的知识点:状态压缩(位压缩,利用hash思想压缩)。

hdu1240、hdu1253(三维搜索题)

1、从后往前输入,(x,y,z); 2、从下往上输入,(y , z, x); 3、从左往右输入,(z,x,y); hdu1240代码如下: #include<iostream>#include<algorithm>#include<string>#include<stack>#include<queue>#include<map>#include<stdio.h>#inc

在JS中的设计模式的单例模式、策略模式、代理模式、原型模式浅讲

1. 单例模式(Singleton Pattern) 确保一个类只有一个实例,并提供一个全局访问点。 示例代码: class Singleton {constructor() {if (Singleton.instance) {return Singleton.instance;}Singleton.instance = this;this.data = [];}addData(value)

hdu 4517 floyd+记忆化搜索

题意: 有n(100)个景点,m(1000)条路,时间限制为t(300),起点s,终点e。 访问每个景点需要时间cost_i,每个景点的访问价值为value_i。 点与点之间行走需要花费的时间为g[ i ] [ j ] 。注意点间可能有多条边。 走到一个点时可以选择访问或者不访问,并且当前点的访问价值应该严格大于前一个访问的点。 现在求,从起点出发,到达终点,在时间限制内,能得到的最大