Eric Hynds jQuery UI多选小部件:复选框宽度等于每个项目的文本宽度
我使用Eric Hynds的Multiple Select小部件,但复选框的宽度与文本的宽度相等,这是一个问题。以下是我的代码: 包括的文件列表Eric Hynds jQuery UI多选小部件:复选框宽度等于每个项目的文本宽度,jquery,Jquery,我使用Eric Hynds的Multiple Select小部件,但复选框的宽度与文本的宽度相等,这是一个问题。以下是我的代码: 包括的文件列表 <link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/> <link href="../../Content/themes/redmond/jqu
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css"/>
<link href="../../Content/themes/redmond/jquery-ui-1.8.2.custom.css" rel="stylesheet" type="text/css" />
<link href="../../Content/themes/redmond/ui.jqgrid.css" rel="stylesheet" type="text/css" />
<link href="../../Content/themes/base/jquery.ui.button.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js" type="text/javascript"></script>
<link href="../../Content/jquery.multiselect.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/grid.locale-en.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.jqGrid.min.js" type="text/javascript"></script>
<script src="../../Scripts/grid.common.js" type="text/javascript"></script>
<script src="../../Scripts/grid.formedit.js" type="text/javascript"></script>
<script src="../../Scripts/jqModal.js" type="text/javascript"></script>
<script src="../../Scripts/jqDnR.js" type="text/javascript"></script>
<script src="../../Scripts/dropmenu.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.multiselect.js" type="text/javascript"></script>
<link href="../../Content/style.css" rel="stylesheet" type="text/css" />
<script src="../../Scripts/Common.js" type="text/javascript"></script>
控件的HTML:
<select id="SchemaName" multiple="multiple"></select>
用于填充控件的代码。我使用的是AJAX调用,因为数据来自数据库。我在stackoverflow上的一个示例中发现了此代码
var $SchemaName_multiselect = jQuery('select#SchemaName').multiselect();
$SchemaName_multiselect.multiselect({ selectedList: 1 });
jQuery.ajax({
type: "GET",
url: "/Controller/Action",
data: "",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function OnPopulateControl(data, response) {
if (data.length > 0) {
jQuery.each(data, function () {
jQuery('select#SchemaName').append(jQuery("<option></option>").val(this['Value']).html(this['Text']));
});
} else {
jQuery("select#SchemaName").empty().append('<option selected="selected" value="0">Not available<option>');
}
jQuery("select#SchemaName").multiselect('refresh');
jQuery('select#SchemaName').unbind('multiselectclick').bind('multiselectclick', function (event, ui) {
//ToDo: when the selection has changed.
}
});
},
error: function (data, response) {
alert('Error: ' + response);
}
});
以下是屏幕截图:
您是否尝试在代码中替换:
jQuery('select#SchemaName').append(jQuery("<option value=". val(this['Value']). " selected='selected'>" .html(this['Text']) . "</option> ");
?您能否更具体地说明我应该用什么替换代码?