画像とラベルの付いたMVC Razorドロップダウンリスト？

Question

MVCかみそりで@ Html.DropDownListForヘルパーを使ってイメージとラベルをリストする方法があるのだろうか？このような 何か：

a busy cat http://www.dotnetspeaks.com/ArticleImages/DropDownList%20with%20images.png

Answer 1

MVCに組み込まれたこのようなものは何もありませんが、私は多くのサードパーティ製のコンポーネントがあることを確認しています。私は個人的にこの種のものにdijitを使用していますが、あなたのタグの1つとしてJQueryがあるので、JQuery UIからMenuを使用できます。

Answer 2

DropDownListForは、<select>をレンダリングする。このHTML要素は、リスト内の画像をサポートしていません。この効果を得るには、JavaScriptライブラリを使用する必要があります。ライブラリのいくつかは、<select>をベースとして使用しています（選択肢を隠していますが、値を取得します）。数十の選択ライブラリがあります。

this tutorialをご覧ください。これは画像付きのドロップダウンリストの作成に役立ちます。

Answer 3

look here。それはそれを動作させるために

<link rel="stylesheet" type="text/css" href="../Scripts/msdropdown/dd.css" /> 
 
<script type="text/javascript" src="../Scripts/msdropdown/js/jquery-1.6.1.min.js"></script> 
 
<script type="text/javascript" src="../Scripts/msdropdown/js/jquery.dd.js"></script> 
 

 
    <div> 
 
     <select name="webmenu" id="webmenu"> 
 
      <option value="calendar" title="~/Content/Images/arrow.png">Calendar</option> 
 
      <option value="shopping_cart" title="~/Content/Images/SendtoFriend.jpg">Shopping Cart</option> 
 
      <option value="cd" title="~/Content/Images/facebook.png">CD</option> 
 
      <option value="email" title="~/Content/Images/Email.png">Email</option> 
 
      <option value="faq" title="~/Content/Images/VotePositive.png">FAQ</option> 
 
      <option value="games" title="~/Content/Images/VoteNegative.png">Games</option> 
 
     </select> 
 
    </div> 
 
<script type="text/javascript"> 
 
     $(document).ready(function() { 
 
      $("#webmenu").msDropDown(); 
 
     }); 
 
    </script>  
 

数行で実装するのは簡単です、jqueryのです。私は少しを変更する必要があります...私はtitleを使用してイメージを表示することを好む。それは私に役立ちます