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. Nginx 集群 反向代理多个服务器

    准备多个服务器,使用 nginx 先做好代理(我这里只有一台服务器,就拷贝两个 tomcat 了,端口分别设置为 8081 和 8082) 1,复制 tomcat cp -r apache-tomca ...

  2. .net core 下编码问题

    System.Globalization.CultureInfo.CurrentCulture = new System.Globalization.CultureInfo("zh-CN&q ...

  3. 解决ie6中png图片格式不兼容问题

    在IE6中对图片格式png24支持度不高,如果使用的图片格式是png24,则会导致透明效果无法正常显示 解决方法: 1.可以使用png8来代替png24,即可解决问题,但是使用png8代替png24以 ...

  4. Android 自定义AlertDialog的实现

    Android默认的AlertDialog太单调,我们可以通过继承原生的Dialog来实现自定义的Dialog. 本文的自定义Dialog和原生的AlertDialog的创建方式类似,通过一个静态Bu ...

  5. hdu-2018题(母牛问题)

    HDU-2018题/*有一头母牛,它每年年初生一头小母牛.每头小母牛从第四个年头开始,每年年初也生一头小母牛.请编程实现在第n年的时候,共有多少头母牛?Input输入数据由多个测试实例组成,每个测试实 ...

  6. git 入门教程之远程仓库

    远程仓库 如果说本地仓库已经足够个人进行版本控制了,那么远程仓库则使多人合作开发成为可能. 如果你只是打算自己使用git,你的工作内容不需要发布给其他人看,那就用不到远程仓库的概念. git 是分布式 ...

  7. elasticsearch及head插件安装与配置

    1. 环境软件版本说明 系统:ubuntu14.04.1 JDK:1.8 elasticsearch:5.5.2 node:9.11.1 elasticsearch:5.X 2. 环境软件下载说明 1 ...

  8. SSL里的certificate格式资料小结

    在查看相关报文的时候,发现RFC5246本身并没有对certificate的格式AlgorithmIdentifier作深入的介绍,只说其格式必须是X509v3 DER表示,思虑良久才找到方向:后者的 ...

  9. TTS 文字转语音 ekho

    1.源码下载 使用svn客户端,执行如下命令下载 svn co https://svn.code.sf.net/p/e-guidedog/code/ 2.官方网站查看说明 http://www.egu ...

  10. 【算法】LeetCode算法题-Count And Say

    这是悦乐书的第153次更新,第155篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第12题(顺位题号是38).count-and-say序列是整数序列,前五个术语如下: ...