easyui 图标下拉框

easyui 图标下拉框

css样式:

.item-img{
   display:inline-block;
   vertical-align:middle;
   width:16px;
   height:16px;
   cursor: pointer;
  }
  .item-text{
   display:inline-block;
   vertical-align:middle;
   padding:3px 0 3px 3px;
   cursor: pointer;
  }

jsp:

<input id="icons" name="icons" style="width: 300px;"/>

js:

$('#icons').combobox({
  valueField:'text',
  textField:'text',
  url:'jsp/icons.jsp',
  editable:false,
     formatter:function(data){
       return '<img class="item-img" src="'+data.url+'"/><span class="item-text">'+data.text+'</span>';
     },
 });

编辑下拉框赋值

$('#icons').combobox("select", node.iconCls);

相关推荐