treeMultiselect 去掉勾选项
场景描述:弹窗,显示树形结构,节点层次可变(可只有一级节点,也可是多级节点),限制只能选择一个节点!
1、修改jquery.tree-multiselect.min.js 文件

2、前台页面
参考代码:
<!--耗材分类弹出框-->
<div class='popupWindow' id="itemTypeView">
<ul>
<li class="popupWindow-header">
<div class="titleName" id="titleName">@T("Consumable_type")</div>
<div class="close">×</div>
</li>
<li>
<div class="popupWindow-content">
<div class="form-group col-xs-12 popupWindow-tree" style="overflow-y: auto;overflow-x: hidden;max-height: 410px;">
<select id="test-select" multiple="multiple" class="treeCheckbox"></select>
</div>
</div>
</li>
<li>
<div class="popupWindow-footer">
<button type="button" class="btn btn-primary" onclick="buttonLoading(this)" autocomplete="off" id="btn_save" data-bind="click:saveItemTypeClick">@T("op_save")</button>
<button type="button" class="btn btn-default" id="btn_cancel" data-bind="click:closeItemTypeClick">@T("op_cancel")</button>
</div>
</li>
</ul>
</div>
3、调用

参考代码:
//选择耗材分类
this.selectItemType = function () {
//初始化树
var $select = $('#test-select');
var div = $select.parent();
var param = {
itemtypecode: self.form.itemtypecode()
}
$.ajax({
type: "POST",
url: self.urls.getitemtype,
data: { data: JSON.stringify(ko.toJS(param)) },
beforeSend: function () {
showLoading();
},
success: function (d) {
if (d.result == "error") {
console.log(d.message);
$(div).html(com.getLocalization(self.sourceName, "Data loading failure."));
} else {
$select.html("");
$(div).html("").append($select);
var treeData = com.parseJson(d);
for (var i = 0; i < treeData.length; i++) {
var treenode = treeData[i];
var $option = $('<option value="' + treenode.treeNodecode + '" data-parent-code="' + treenode.treeNodeParentPathCode + '" data-section="' + treenode.treeNodeParentPathText + '" class="float-left" ' + ($.trim(treenode.checkState) == "" ? '' : 'selected="' + treenode.checkState + '"') + '>' + treenode.treeNodetext + '</option>');
if (treenode.treeNodeParentPathCode == "0") {
$option = $('<option value="' + treenode.treeNodecode + '" data-parent-code="' + treenode.treeNodeParentPathCode + '" data-section="' + treenode.treeNodetext + '" class="float-left" ' + ($.trim(treenode.checkState) == "" ? '' : 'selected="' + treenode.checkState + '"') + '></option>');
}
$(div).find('#test-select').append($option);
}
var treeObject = $select.treeMultiselect({ enableSelectAll: false, sortable: true, searchable: true, onChange: treeChange })[0];
$('#test-select').closest('.popupWindow').css('top', ($(window).height() - $('#test-select').closest('.popupWindow').height()) / 2 + "px");
function treeChange(options, add, remove) {
if (add.length > 0) {
$.each($("#test-select option"), function (i, e) {
if (e.value != add[0].value) {
//去掉树节点的勾选项
treeObject.removeItem($(e).attr("data-key"));
}
})
}
}
}
},
error: function (d) {
NotifyDanger(d.message);
},
complete: function () {
hideLoading();//关闭特效
}
});
showNormalWindow('itemTypeView');
}
//保存耗材分类
this.saveItemTypeClick = function () { ///获取选择的药效分类信息
var itemtypenames = "", itemtypecodes = "";
var count = parent.$("#test-select option").length;
$.each(parent.$("#test-select").get(0).options, function (i, e) {
if (e.text != "") {//子节点
itemtypenames += e.innerHTML + ",";
itemtypecodes += e.value + '_0' + ",";
} else {
itemtypenames += $(e).attr("data-section") + ",";
itemtypecodes += $(e).attr("value") + '_0' + ",";
}
})
if (self.form.itemtypecode().trim() != "") {
var deleteitemtypecode = $.map(self.form.itemtypecode().split(','), function (e, i) {
var code = e.substring(0, e.length - 2);
if (itemtypecodes.indexOf(code) == -1) {
return code
}
})
$.each(deleteitemtypecode, function (i, e) {
itemtypecodes += e + '_1' + ",";
})
}
self.form.itemtypename(itemtypenames.substring(0, itemtypenames.length - 1));
self.form.itemtypecode(itemtypecodes.substring(0, itemtypecodes.length - 1)); self.closeItemTypeClick();
}
//关闭耗材分类弹窗
this.closeItemTypeClick = function () {
hidePopupWindow('itemTypeView');
}
4、数据转换
/// <summary>
/// 获取耗材分类
/// </summary>
/// <param name="data"></param>
/// <returns></returns>
[AlwaysAccessible]
public JsonResult GetItemType(string data)
{
var d = JsonConvert.DeserializeObject<dynamic>(data);
string itemtypecode = d.itemtypecode == null ? "" : ((string)d.itemtypecode.ToString()).Trim(); try
{
//当前耗材已经关联的itemtypecode集合
List<string> selectedItemTypeCoce = new List<string>();
if (!string.IsNullOrEmpty(itemtypecode) && itemtypecode != "[]")
{
foreach (string item in itemtypecode.Split(','))
{
if (item.Split('_')[] == "")
{
selectedItemTypeCoce.Add(item.Split('_')[]);
}
}
}
#region 获取树状结构数据
ReturnMsg readData = new DeviceService().sys_query_comn(@"with recursive r(itemtypecode,itemtypename,parentitemtypecode,parentitemtypename) as(
--select itemtypecode,itemtypename,parentitemtypecode::varchar(500),1 as depth from base_itemtype where parentitemtypecode='0' and main.itemtypeclass='1'
select main.itemtypecode,main.itemtypename,main.parentitemtypecode::varchar(500),bi.itemtypename::varchar(500) parentitemtypename from base_itemtype main
left join base_itemtype bi on main.parentitemtypecode=bi.itemtypecode where main.parentitemtypecode='0' and main.itemtypeclass='2' and main.isdelete=0
union ALL
select bi.itemtypecode,bi.itemtypename,case when r.parentitemtypecode='0' then bi.parentitemtypecode::varchar(500) else (r.parentitemtypecode||'✪'||bi.parentitemtypecode)::varchar(500) end , case when r.parentitemtypename is null then bi.parentitemtypename::varchar(500) else (r.parentitemtypename||'✪'||bi.parentitemtypename)::varchar(500) end
from (select main.itemtypecode,main.itemtypename,main.parentitemtypecode,bi.itemtypename parentitemtypename from base_itemtype main
left join base_itemtype bi on bi.itemtypecode=main.parentitemtypecode where main.isdelete=0
) bi,r where bi.parentitemtypecode = r.itemtypecode
)
select * from r
where r.itemtypecode not in (select parentitemtypecode from base_itemtype where isdelete=0)
", , );
#endregion
if (readData.returnlist.Count > )
{
List<Tree> roleTreenodes = new List<Tree>();
foreach (var roleSelected in readData.returnlist)
{
Tree treenode = new Tree();
treenode.treeNodecode = ((HashMap<object, object>)roleSelected)["itemtypecode"] != null ? ((HashMap<object, object>)roleSelected)["itemtypecode"].ToString().Trim() : "";//设备型号编码在树中以“DM^”开头,以区分角色编码
treenode.checkState = (selectedItemTypeCoce.Contains(treenode.treeNodecode) ? "selected" : "");
treenode.treeNodetext = ((HashMap<object, object>)roleSelected)["itemtypename"] != null ? ((HashMap<object, object>)roleSelected)["itemtypename"].ToString().Trim() : "";
treenode.treeNodeParentPathCode = ((HashMap<object, object>)roleSelected)["parentitemtypecode"] != null ? ((HashMap<object, object>)roleSelected)["parentitemtypecode"].ToString().Trim() : "";
treenode.treeNodeParentPathText = ((HashMap<object, object>)roleSelected)["parentitemtypename"] != null ? ((HashMap<object, object>)roleSelected)["parentitemtypename"].ToString().Trim() : "";
roleTreenodes.Add(treenode);
}
//return Json(new { result = "success", data = readData.returnlist }, JsonRequestBehavior.AllowGet);
var jsonArr = JsonConvert.SerializeObject(roleTreenodes);
return Json(jsonArr, JsonRequestBehavior.AllowGet);
}
else
{
return Json(new { result = "error", message = readData.returnmessage.Contains("java.lang") ? T("Api_exception").ToString() : readData.returnmessage }, JsonRequestBehavior.AllowGet);
}
}
catch (Exception ex)
{
SaveException(new ExceptionMessage() { ex = ex, message = "URL:" + System.Web.HttpContext.Current.Request.Url.ToString() });
return Json(new { result = "error", message = ex.Message }, JsonRequestBehavior.AllowGet);
}
}
treeMultiselect 去掉勾选项的更多相关文章
- zTree-已勾选项id传输到action的解决方案
测试jsp <%@ page language="java" contentType="text/html; charset=utf-8" page ...
- oracle表结构和数据导出时的一些勾选项说明
使用pl/sql developer导出oracle数据库的表结构和表数据时,有一些勾选项供用户选择,需要用户根据实际情况进行勾选或取消. 导出方法如下:一.只导出表结构1.使用pl/sql deve ...
- class7_Checkbutton 勾选项
最终的运行效果(程序见序号3): #!/usr/bin/env python# -*- coding:utf-8 -*-# ------------------------------------ ...
- android TDD平台插入双卡时,查看允许返回发送报告的选项,去掉勾选,不起作用
请在MultiSimPreferenceActivity.java 下修改 修改1: 函数 isChecked() private boolean isChecked(String prefe ...
- SDK Manager中勾选项
运行SDK Manager 勾选对应版本的SDK,从这里基本可以知道一个Android版本对应着一个版本的API. 其中每个包都有这么几个文件: Documentation for Android S ...
- jenkins 批量修改 去掉勾选Build whenever a SNAPSHOT dependency is built
进入jenkins 的jobs的上一层目录 执行 sed -i 's/<ignoreUpstremChanges>false<\/ignoreUpstremChanges>/& ...
- winfrom_根据checkbox勾选项增减dgv字段列
1.效果: 2.点击‘配置’按钮: private void btn_configure_Click(object sender, EventArgs e) { string sum = string ...
- solr6.4.1搜索引擎(2)首次同步mysql数据库
尚未成功启动solr的,请参考我的另一篇文章:http://www.cnblogs.com/zhuwenjoyce/p/6506359.html(solr6.4.1 搜索引擎启动eclipse启动) ...
- iDempiere 使用指南 采购入库流程
Created by 蓝色布鲁斯,QQ32876341,blog http://www.cnblogs.com/zzyan/ iDempiere官方中文wiki主页 http://wiki.idemp ...
随机推荐
- hosts 屏蔽定位域名
通过修改hosts屏蔽定位服务的域名 #屏蔽百度地图 1.0.0.1 api.map.baidu.com 1.0.0.1 ps.map.baidu.com 1.0.0.1 sv.map.baidu.c ...
- ASP.NET MVC5+EF6+EasyUI 后台管理系统-代码生成器用法
新的代码生成器比老的更加容易使用,要生成什么形式就选择什么形式,新的代码生成器采用的是WCF界面开发,同样采用开源的模式,根据自己使用习惯容易扩展 1.单列表模式 2.树形列表模式 3.左右列表模式 ...
- TICK/TIGK运维栈安装运行 docker-compose【下】
InfluxDB 构建Dockerfilevim /opt/influxdb-docker/Dockerfile FROM influxdb COPY influxdb.conf /etc/influ ...
- SQL优化-如何分析性能瓶颈
MySQL优化一览图 笔者将优化分为了两大类:软优化和硬优化.软优化一般是操作数据库即可:而硬优化则是操作服务器硬件及参数设置. 1.软优化 1)查询语句优化 首先我们可以用EXPLAIN或DESCR ...
- Java算法 -- 桶排序
桶排序(Bucket sort)或所谓的箱排序,是一个排序算法,工作的原理是将数组分到有限数量的桶里.每个桶再个别排序(有可能再使用别的排序算法或是以递归方式继续使用桶排序进行排序).桶排序是鸽巢排序 ...
- (转)自动微分(Automatic Differentiation)简介——tensorflow核心原理
现代深度学习系统中(比如MXNet, TensorFlow等)都用到了一种技术——自动微分.在此之前,机器学习社区中很少发挥这个利器,一般都是用Backpropagation进行梯度求解,然后进行SG ...
- [LeetCode] 109. Convert Sorted List to Binary Search Tree 把有序链表转成二叉搜索树
Given a singly linked list where elements are sorted in ascending order, convert it to a height bala ...
- [LeetCode] 654. Maximum Binary Tree 最大二叉树
Given an integer array with no duplicates. A maximum tree building on this array is defined as follo ...
- 【神经网络与深度学习】Win10+VS2015 caffe环境搭建(极其详细)
caffe是好用,可是配置其环境实在是太痛苦了,依赖的库很多不说,在VS上编译还各种报错,你能想象那种被一百多个红色提示所笼罩的恐惧. 且网上很多教程是VS2013环境下编译的,问人很多也说让我把1 ...
- Navicat工具链接 mysql"Access denied for user'root'@'IP'" 用户远程赋值
如题 用Navicat远程连接数据库出现错误 给用户添加权限 连接MySQL mysql -uroot -p: use mysql; 更改权限 使用grant all privileges on来 ...