https://github.com/mydea/handsontable-chosen-editor

handsontable-chosen-editor是handsontable column的扩展,实现了在handsontable编辑列中下拉列表,同时支持的多选。

使用后发现,屏幕底部的行中,下拉项无法显示,因为下拉项定义的是向下展开,即使下拉项的位置超出了屏幕底部。

修改方法:

chosen.css中添加

.chosen-container.chosen-with-drop-top .chosen-drop {
left: 0;
top:-220px;
}

chosen.jquery.js中的results_show中

把原来的

this.container.addClass("chosen-with-drop");

改为

var totalheight = $(window).height();
var thistop = $($.find('div.handsontableInputHolder')[0]).offset().top;
if ((parseInt(totalheight) - parseInt(thistop)) < 200)
{
this.container.addClass("chosen-with-drop-top");
}
else
{
this.container.addClass("chosen-with-drop");
}

 在results_hide函数中添加

this.container.removeClass("chosen-with-drop-top");

这样,当底部空间不足时,下拉列表将向上展开。

handsontable-chosen-editor的更多相关文章

  1. handsontable-developer guide-cell function

    renderer 展示的数据不是来自于数据源,而是先把DOM和其他信息传给renderer,然后展示. //五种展示函数 TextRenderer: default NumericRenderer A ...

  2. Handsontable对单元格的操作

    1.自动填充单元格数据 fillHandle:true/false    //当值为true时,允许拖动单元格右下角,将其值自动填充到选中的单元格 2.合并单元格 mergeCells:[{row:起 ...

  3. handsontable 合并单元格

    <!DOCTYPE html> <html> <head> <title>handsontable demo</title> <met ...

  4. handsontable 属性汇总

    常规属性: 1.固定行列位置 fixedRowsTop:行数 //固定顶部多少行不能垂直滚动 fixedColumnsLeft:列数 //固定左侧多少列不能水平滚动 2.拖拽行头或列头改变行或列的大小 ...

  5. handsontable 常用 配置项 笔记

    import React, { Component } from 'react'; import HotTable from 'react-handsontable'; import Handsont ...

  6. Handsontable Dropdown with key-value pair

    在使用handsontable的时候,本身的下拉列表无法满足业务需求,需要使用key-value类型的dropdown. 找了半天终于找到了一个可以满足需求的 参考方案 此方案完美的解决了我的问题. ...

  7. eclipse default handler IHandler interface “the chosen operation is not enabled”

    NOTE: These two methods: Tip: Subclass AbstractHandler rather than implementing IHandler. but you ca ...

  8. [转]Handsontable对单元格的操作

    原文地址:http://blog.csdn.net/mafan121/article/details/46119905 1.自动填充单元格数据 fillHandle:true/false    //当 ...

  9. handsontable-developer guide-cell editor

    单元格编辑 cell editor renderer:展示数据:editor:改变数据:renderer用一个函数表示:后者有一系列的操作,需要用class来表示: EditorManager han ...

  10. [bzoj1269][AHOI2006文本编辑器editor] (splay模版题 or pb_ds [rope]大法)

    Description 这些日子,可可不和卡卡一起玩了,原来可可正废寝忘食的想做一个简单而高效的文本编辑器.你能帮助他吗?为了明确任务目标,可可对“文本编辑器”做了一个抽象的定义:   文本:由0个或 ...

随机推荐

  1. 10.Odoo产品分析 (二) – 商业板块(5) –日历(1)

    查看Odoo产品分析系列--目录 日历模板也可以理解为一个日历视图,在分析"销售"模块的日历视图时做过介绍.在这里做一下详细的介绍:  从页面上,它横向分为两个部分,左边的80%显 ...

  2. Java判断一个字符是否是数字的几种方法的代码

    在工作期间,将写内容过程经常用到的一些内容段做个记录,下面内容是关于Java判断一个字符是否是数字的几种方法的内容,希望能对码农们有好处. public class Test{ public stat ...

  3. IIS 配置 HTTPS

    前言 HTTPS(全称:Hyper Text Transfer Protocol over Secure Socket Layer 或 Hypertext Transfer Protocol Secu ...

  4. WPF:Metro样式ProgressBar(圆点横向移动),自适应宽度

    先看效果图: 最直观的,这是4个圆点在移动,就用一个横向的StackPanel表示这四个点吧. <StackPanel Orientation="Horizontal"> ...

  5. 如何训练AI

    如何训练AI让其更加智能,而不是用特定的代码控制AI逻辑! AI守则 首先应该为机器人设置几个必要信息: 目标 规则 能力 目标,规定机器人要做到什么. 规则,规定机器人的限制,不能做什么. 能力,规 ...

  6. php json_encode中提示的中文总是返回"\u767b\u5f55\u6210\u529f\uff01"的解决办法

    最近在练习使用 php 写一些简单的接口,但是在返回的消息中,如果有中文,在测试后总是返回: {"resultCode":200,"message":" ...

  7. Oracle笔记----oracle数字类型number自增

    创建序列 create sequence seq_student start increment maxvalue nominvalue nocycle nocache; 创建触发器 create o ...

  8. C#-枚举(十三)

    概念 枚举是一组命名整型常量 枚举类型是使用 enum 关键字声明的 例如定义一个变量,该变量的值表示一周中的一天: enum Days { Sunday, Monday, Tuesday, Wedn ...

  9. iOS In-App Purchase(IAP)内购服务端二次验证注意事项

    前端iOS完成对应的商品购买之后,会得到一个Transaction(交易)的数据结构指针,后端实际上只需要这个结构内的一个东西,那就是 transaction.transactionReceipt. ...

  10. 【RHEL7.0】软件包管理

    1.常用的RPM软件包命令 安装软件的命令格式  rpm –ivh filename.rpm 升级软件的命令格式  rpm –Uvh filename.rpm 卸载软件的命令格式  rpm –e fi ...