js
$.extend($.fn.datagrid.defaults.editors, {
lookup: {
init: function(container, options){
var input = $(
"<span class='datagrid-editable-input' >" +
"<input type='hidden' class='look-up-value' />"+
"<input type='text' class='look-up-text' readonly='readonly'>" +
"<span class='look-up-btn' onclick='look_up()'/></span></span>" +
"<script type='text/javascript'> function look_up(){" +
"showTPopbox({width:"+options.width+",height:"+options.height+",url:'"+options.url+"',title:'"+options.title+"'});"+
"}</script> "
).appendTo(container);
if(options.required){
$('.look-up-text').validatebox({
required: true
});
}
return input;
},
getValue: function(target){
return $(".look-up-value").val();
},
setValue: function(target, value){
$(".look-up-value").val(value.id);
$(".look-up-text").val(value.factorClassName);
},
resize: function(target, width){
var input = $(target);
if ($.boxModel == true){
input.width(width - (input.outerWidth() - input.width()));
} else {
input.width(width);
}
}
}
});
Css
.look-up-btn {
background: url('images/lookup_btn.gif') no-repeat scroll 0 0 transparent;
border-left: 1px solid #E1E0E0;
cursor: pointer;
display: inline-block;
height: 20px;
overflow: hidden;
vertical-align: top;
width: 18px;
}
.look-up-text {
border: 0 none;
font-size: 12px;
height: 20px;
line-height: 20px;
padding: 0;
cursor: text;
}
.look-up-input-validatebox-invalid{
background: url("images/validatebox_warning.png") no-repeat scroll right 1px #FFFFEE;
width:90%;
font-size:12px;
border:1px solid #A4BED4;
padding:3px 2px;
}
.look-up-input{
width:90%;
font-size:12px;
border:1px solid #A4BED4;
padding:3px 2px;
}
.look-up {
background: none repeat scroll 0 0 #FFFFFF;
border: 1px solid #D8D8D8;
display: inline-block;
font-size: 12px;
margin: 0;
padding: 0;
white-space: nowrap;
}
图片可以自己自定义，也可以找我要