Eric Hynds jQuery UI多選擇小工具：複選框寬度等於每個項目的文本寬度

我使用Eric Hynds的多選小工具，並且複選框的寬度等於文本寬度。以下是我的代碼：Eric Hynds jQuery UI多選擇小工具：複選框寬度等於每個項目的文本寬度

文件的清單中包括控制

<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); 
    } 
});

以下是截圖：

MultiSelect Issue

來源

2012-08-23 Abhisheik Deo

你試圖替換代碼：

 jQuery('select#SchemaName').append(jQuery("<option value=". val(this['Value']). " selected='selected'>" .html(this['Text']) . "</option> ");

？

來源

2012-10-02 01:19:13

你可以請更具體一點，我應該用什麼替換代碼？ –

Eric Hynds jQuery UI多選擇小工具：複選框寬度等於每個項目的文本寬度

回答

相關問題