$colacola.AbstractButtoncola.AbstractCheckboxcola.AbstractContainercola.AbstractDropdowncola.AbstractEditorcola.AbstractInputcola.AbstractItemGroupcola.AbstractListcola.AbstractMenuItemcola.AbstractSlotListcola.AjaxValidatorcola.AsyncValidatorcola.Avatarcola.Breadcrumbcola.Buttoncola.ButtonGroupcola.Calendarcola.CardBookcola.Carouselcola.CascadeBindcola.Checkboxcola.ControlMenuItemcola.Cornercola.CustomDropdowncola.CustomValidatorcola.DataTypecola.DatePickercola.DateTimePickercola.Dialogcola.Dividercola.Dropdowncola.DropdownMenuItemcola.Elementcola.EmailValidatorcola.Entitycola.EntityDataTypecola.EntityListcola.FieldSetcola.GroupBoxcola.HeaderMenuItemcola.IFramecola.Imagecola.Inputcola.ItemsViewcola.Labelcola.Layercola.LengthValidatorcola.Linkcola.ListViewcola.Menucola.MenuButtoncola.MenuItemcola.Modelcola.MultiSlotPickercola.NestedListcola.NestedListBindcola.NestedListNodecola.Nodecola.NumberValidatorcola.Panelcola.PointingLabelcola.Progresscola.Propertycola.Providercola.RadioButtoncola.RadioGroupcola.RangeSlotListcola.Ratingcola.RegExpValidatorcola.RenderableElementcola.RequiredValidatorcola.Revealcola.Ribboncola.Segmentcola.Selectcola.Sidebarcola.Slidercola.SlotListcola.SplitPanecola.Stackcola.Stepscola.Tabcola.TabButtoncola.Tablecola.TableColumncola.TableContentColumncola.TableDataColumncola.TableGroupColumncola.TableSelectColumncola.Tagcola.TimeLinecola.TitleBarcola.Togglecola.Treecola.TreeNodecola.TreeNodeBindcola.UrlValidatorcola.Validatorcola.Widgetcola.breadcrumb.Sectioncola.buttonGroup.Separatorcola.steps.Stepcola.tab.AbstractTabButtoncola.utilcola.util.KeyedArray

cola.ListView

列表

items
cola.EntityList || [any]
cola.ListView
列表中要显示的数据。
此属性不要与bind属性同时使用。
bind
string
cola.ListView
绑定表达式。
此属性不要与items属性同时使用。
textProperty
string
cola.ListView
作为内容显示在列表中的数据属性名。
此属性通常只在未自定义行模板时需要使用。

不过在特殊情况下,即使定义了行模板也可以继续使textProperty发挥作用。你可以在行模板中使用`$default`这样的特殊表达式来代表textProperty的值。例如:



columns
string
rowcola.ListView
用于设定列表的控件在各种屏幕分辨率下的分栏方式的表达式。
此处表达式的基本格式是一到多段以空格分割的字符串,分别用于描述小屏、中屏、大屏、超大屏、巨屏下的分栏方式。
可选的设置包括row、1、2、3、4、...。

其中,这些数字表示每一行显示多少个列表项。row表示行模式,即每一个列表项显示为一行。row和1在很多情况下看起来区别并不大。

例如:当columns的设置为"row 2 4"时,表示在小屏上显示为行模式,而在中屏和大屏上分别显示为2列和4列排列的模式。
由于我们没有设置超大屏、巨屏下的分栏方式,因此在超大屏和巨屏下列表将使用前面大屏下的配置,即显示为4列。
itemWidth
int || string
cola.ListView
每个列表项的宽度
默认情况下,即使是在分栏模式下,列表也可以自动调整每个列表项的宽度。因此,如果没有特殊需要的话请不要设置此属性。
itemHeight
int || string
cola.ListView
每个列表项的高度
group
boolean
cola.ListView
是否对所有列表项进行分组显示
groupCollapsible
boolean
truecola.ListView
当启用分组显示后,每个分组是否支持收缩展开的功能。
indexBar
boolean
cola.ListView
当启用分组显示后,是否显示索引栏。
itemSlide
String
cola.ListView
设置是否在列表项上启用左滑右滑的手势操作。
none
left
right
both
currentPageOnly
boolean
cola.AbstractList
是否只显示当前页的数据
autoLoadPage
boolean
cola.AbstractList
是否自动装载下一页记录。
此功能需要配合cola.Provider的pageSize属性来使用。
即当需要时ColaUI会自动利用绑定的cola.EntityList对应的cola.Provider的翻页功能来装载新一页的数据。
changeCurrentitem
boolean
cola.AbstractList
是否在用户点击某个列表元素时自动将其设置为新的当前元素。
pullDown
boolean
cola.AbstractList
是否启动下拉手势。
此功能通常用于实现列表的下拉刷新功能。
pullUp
boolean
cola.AbstractList
是否启动上拉手势。
filterCriteria
string || JSON || [JSON]
cola.AbstractList
过滤条件。
此属性值的具体定义形式请参考此链接中的隐式Action里的filter方法 docs/action。
另外,您也可以任意的为filterCriteria定义个内容,只要filterCriteria的内容不为空。此控件在尝试渲染集合中的每一个元素时就会触发filterItem事件,您可以在该事件中利用代码逻辑来确定要显示哪些列表项。
allowNoCurrent
boolean
truecola.ItemsView
是否允许集合型控件没有当前列表元素。
currentItem
cola.Entity || any
cola.ItemsView
当前列表元素所对应的列表数据项。
highlightCurrentItem
boolean
cola.ItemsView
是否高亮显示当前的列表元素。
float
string
cola.Widget
left
right
浮动:通过属性将根据所设定的值在容器中浮动显示
display
boolean
truecola.Widget
是否显示
ui
string
truecola.Widget
用户可自定样式之后通过此属性激活自定义样式,或者启用框架提供的样式
popup
String
cola.Widget
弹出信息内容,当鼠悬停时显示此内容
dimmer
String
cola.Widget
调光器内容
width
number|string
cola.Widget
宽度(如果传入的值为number将计量单位为px)
height
number|string
cola.Widget
高度(如果传入的值为number将计量单位为px)
tag
string[]
cola.Element
对象拥有的标签
每一个Element的实例都可以拥有1到N的标签,每个标签是一个String类型的值。
通过标签,我们可以快速的获取一批Element的实例,以便于对他们进行统一的操作。
参考:cola.tag()

另外,在设置tag时如果只需要设置一个tag,我们可以直接使用简单的字符串,Cola-UI会自动将其转换成字符串的数组。例如: element.set("tag", "invisible");

userData
any
cola.Element
自定义数据。这里的自定义数据可以是任意数据类型,Cola-UI不会对其内容做任何处理。
getItems()获得items列表cola.ItemsView
Returns:void
refreshItem(item)刷新指定item对应的Domcola.ItemsView
Parameters:
  • itemcola.Entity

Returns:void
showDimmer(options)显示调光器cola.Widget
Parameters:
  • optionsobject

Returns:void

var widget=new cola.Widget();
widget.showDimmer({content:"中间内容"})
widget.showDimmer({
  tagName:"div",
  content:{
    tagName:"div",
    content:"中间内容"
  }
})

hideDimmer()关闭调光器cola.Widget
Returns:void
refresh()刷新控件cola.RenderableElement
Returns:void
appendTo(dom)追加到指定的dom中cola.RenderableElement
Parameters:
  • domHTMLElement | jQuery | zepto

Returns:void
Returns:void
get$Dom()获得此组件Dom的jQuery或zepto实例cola.RenderableElement
Returns:jQeury|zepto
remove()从dom树上移除此组件cola.RenderableElement
Returns:void
destroy()销毁此组件cola.RenderableElement
Returns:void
get(key)根据属性名或路径获取一个Attribute的值cola.Element
Parameters:
  • keystring

    Attribute名或路径

Returns:any
注意设置或读取Attribute时,我们不但可以直接使用属性名也可以利用路径对属性值记性钻取式的读写。
请参考: Element
set(key,value)根据属性名或路径设置一个Attribute的值cola.Element
Parameters:
  • keystring

    Attribute名或路径

  • valueany

    要写入的值

Returns:cola.Element
注意设置或读取Attribute时,我们不但可以直接使用属性名也可以利用路径对属性值记性钻取式的读写。
请参考: Element
on(eventName,listener)绑定一个事件监听器cola.Element
Parameters:
  • eventNamestring

    在定义此处的事件名时,我们可以通过":"分割的方式在事件名后面定义本事件监听器的别名。

  • listenerFunction

    事件监听器

Returns:cola.Element
one(eventName,listener)绑定一个一次性事件监听器cola.Element
Parameters:
  • eventNamestring

    事件名

  • listenerFunction

    事件监听器

Returns:cola.Element
一次性事件监听器表示只要事件触发过一次,该事件监听器就会自动解除绑定。即这样的时间监听器只会触发一次。
off(eventName,listener)解绑一个事件监听器cola.Element
Parameters:
  • eventNamestring

    事件名

  • listenerFunction

    事件监听器

Returns:cola.Element
getGroupString用于确定每一个列表项要按照什么条件进行分组的事件。cola.ListView
Parameters:
  • selfObject

    控件本身

  • argObject

    • item:cola.Entity || any

      当前列表元素对应的列表项数据。

该事件的返回值应该是一个字符串,列表根据这个字符串对列表项进行分组,这个字符串也将作为这个分组的组名。
Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
itemSlideStart当列表项的即将进入左滑或右滑状态时触发的事件。cola.ListView
Parameters:
  • selfObject

    控件本身

  • argObject

    • item:cola.Entity || any

      当前列表元素对应的列表项数据。

    • event:Event

      原生DOM事件对应的Event对象。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
itemSlideStep当列表项已经进入左滑或右滑状态,用户在继续拖动列表项时触发的事件。cola.ListView
Parameters:
  • selfObject

    控件本身

  • argObject

    • item:cola.Entity || any

      当前列表元素对应的列表项数据。

    • event:Event

      原生DOM事件对应的Event对象。

    • direction:string

      滑动的方向。

    • distanceX:int

      拖动的距离。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
itemSlideComplete当列表项完成左滑或右滑操作时触发的事件。cola.ListView
Parameters:
  • selfObject

    控件本身

  • argObject

    • item:cola.Entity || any

      当前列表元素对应的列表项数据。

    • event:Event

      原生DOM事件对应的Event对象。

    • direction:string

      滑动的方向。

    • distanceX:int

      拖动的距离。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
itemSlideCancel当列表项完成左滑或右滑操作被取消时触发的事件。cola.ListView
Parameters:
  • selfObject

    控件本身

  • argObject

    • item:cola.Entity || any

      当前列表元素对应的列表项数据。

    • direction:string

      滑动的方向。

    • event:Event

      原生DOM事件对应的Event对象。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
itemSlidePaneInit当列表项完成左滑或右滑操作,列表控件初始化滑动操作区时触发的事件。cola.ListView
Parameters:
  • selfObject

    控件本身

  • argObject

    • item:cola.Entity || any

      当前列表元素对应的列表项数据。

    • direction:string

      滑动的方向。

    • slidePane:HTMLElement

      滑动操作区。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
itemSlidePaneShow滑动操作区显示后触发的事件。cola.ListView
Parameters:
  • selfObject

    控件本身

  • argObject

    • item:cola.Entity || any

      当前列表元素对应的列表项数据。

    • direction:string

      滑动的方向。

    • slidePane:HTMLElement

      滑动操作区。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
itemSlidePaneHide滑动操作区隐藏后触发的事件。cola.ListView
Parameters:
  • selfObject

    控件本身

  • argObject

    • item:cola.Entity || any

      当前列表元素对应的列表项数据。

    • direction:string

      滑动的方向。

    • slidePane:HTMLElement

      滑动操作区。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
getItemTemplate当列表控件尝试确定每一个列表项的模板时触发的事件。cola.AbstractList
Parameters:
  • selfObject

    控件本身

  • argObject

    • item:cola.Entity || any

      当前列表元素对应的列表项数据。

该事件的返回值即为要使用的模板的名称,如果此事件返回空则表示使用默认的名为“default”的模板。
Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
renderItem当列表控件尝试渲染每一个列表项时触发的事件。cola.AbstractList
Parameters:
  • selfObject

    控件本身

  • argObject

    • item:cola.Entity || any

      当前列表元素对应的列表项数据。

    • itemDom:HTMLElement

      当前列表元素,即当前列表项的DOM元素。

    • itemScope:cola.Scope

      当前列表元素对应的scope。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
pullStart当列表的即将进入下拉或上拉状态时触发的事件。cola.AbstractList
Parameters:
  • selfObject

    控件本身

  • argObject

    • pullPane:HTMLElement

      下拉或上拉区对应的DOM元素。

    • direction:Object

      下拉或上拉。

    • event:Event

      原生DOM事件对应的Event对象。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
pullStep当列表已经进入下拉或上拉状态,用户在继续拖动列表时触发的事件。cola.AbstractList
Parameters:
  • selfObject

    控件本身

  • argObject

    • pullPane:HTMLElement

      下拉或上拉区对应的DOM元素。

    • direction:Object

      下拉或上拉。

    • event:Event

      原生DOM事件对应的Event对象。

    • distence:int

      拖动的距离。

    • theshold:int

      最终将要触发下拉或上拉操作的阈值。即只要用户继续拖动列表当距离达到或超过这个阈值时再释放,将真正的触发下拉或上拉操作。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
pullComplete当列表触发下拉或上拉操作时触发的事件。cola.AbstractList
Parameters:
  • selfObject

    控件本身

  • argObject

    • pullPane:HTMLElement

      下拉或上拉区对应的DOM元素。

    • direction:Object

      下拉或上拉。

    • event:Event

      原生DOM事件对应的Event对象。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
pullCancel当列表已经进入下拉或上拉状态,但最终因为没有继续拖动到阈值而取消时触发的事件。cola.AbstractList
Parameters:
  • selfObject

    控件本身

  • argObject

    • pullPane:HTMLElement

      下拉或上拉区对应的DOM元素。

    • direction:Object

      下拉或上拉。

    • event:Event

      原生DOM事件对应的Event对象。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
filterItem当列表尝试对每一个列表项进行过滤决定其是否需要显示时触发的事件。cola.AbstractList
Parameters:
  • selfObject

    控件本身

  • argObject

    • item:cola.Entity || any

      当前要过滤的列表项数据。

    • filterCriteria:string || JSON || [JSON]

此事件的返回值为逻辑值,表示是否允许当前的列表项显示。
Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
itemClick当用户点击某一个列表项时触发的事件。cola.ItemsView
Parameters:
  • selfObject

    控件本身

  • argObject

    • item:cola.Entity || any

      当前列表元素对应的列表项数据。

    • itemDom:HTMLElement

      当前列表元素,即当前列表项的DOM元素。

    • event:Event

      原生DOM事件对应的Event对象。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
itemDoubleClick当用户双击某一个列表项时触发的事件。cola.ItemsView
Parameters:
  • selfObject

    控件本身

  • argObject

    • item:cola.Entity || any

      当前列表元素对应的列表项数据。

    • itemDom:HTMLElement

      当前列表元素,即当前列表项的DOM元素。

    • event:Event

      原生DOM事件对应的Event对象。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
itemPress当用户长按某一个列表项时触发的事件。cola.ItemsView
Parameters:
  • selfObject

    控件本身

  • argObject

    • item:cola.Entity || any

      当前列表元素对应的列表项数据。

    • itemDom:HTMLElement

      当前列表元素,即当前列表项的DOM元素。

    • event:Event

      原生DOM事件对应的Event对象。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
click单击事件cola.Widget
Parameters:
  • selfObject

    组件本身

  • argObject

    • dom:HTMLElement

      组件本身

    • event:Event

      window.event 对象

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
dblclick双击事件cola.Widget
Parameters:
  • selfObject

    组件本身

  • argObject

    • dom:HTMLElement

      组件本身

    • event:Event

      window.event 对象

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
mousedown鼠标左键被按下cola.Widget
Parameters:
  • selfObject

    组件本身

  • argObject

    • dom:HTMLElement

      组件本身

    • event:Event

      window.event 对象

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
mouseup鼠标左键弹起cola.Widget
Parameters:
  • selfObject

    组件本身

  • argObject

    • dom:HTMLElement

      组件本身

    • event:Event

      window.event 对象

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
tap触碰事件cola.Widget
Parameters:
  • selfObject

    组件本身

  • argObject

    • dom:HTMLElement

      组件本身

    • event:Event

      window.event 对象

在touch环境下建议使用此事件,在Android下响应比click快
Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
attributeChange当有属性的值被改写时触发的事件。cola.Element
Parameters:
  • selfObject

    cola对象本身

  • argObject

    • attribute:string

      被改写的属性名。

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理
destroy当有对象被销毁时触发的事件。cola.Element
Parameters:
  • selfObject

    cola对象本身

  • argObject

Returns:
是否要继续后续事件的触发操作,不提供返回值时系统将按照返回值为true进行处理