如何使用jquery在dropdownlist旁邊添加圖標按鈕

我正在開發一個MVC4 web應用程序。一切正常，但在項目結束時，我得到了一個新的要求，我必須在每個dropdownlist旁邊顯示一個加號圖標目前近20頁像。如何使用jquery在dropdownlist旁邊添加圖標按鈕

enter image description here

在項目上面的圖片下拉列表我又增加了圖標manually.But我要與每一個下拉列表出現在完整的項目添加此圖標。點擊這個圖標後，將會彈出一個文本框。用戶將在此輸入新的項目並保存。

頁面的常見結構爲：

<div runat="server" id="divFormLayout" class="formLayout"> 
<div class="TabSectionL" style="width: 99%"> 
     <span class="TabSectionHeader">Item Details</span> 
     <table cellpadding="4" cellspacing="4"> 
      <tr> 
       <td> 
        Item 
       </td> 
       <td> 
        @if (ViewData["ItemDesc"] != null) 
        { 
         @Html.DropDownListFor(m => m.str_itemdsc, (SelectList)(ViewData["ItemDesc"]), "-Select-", new { @class = "validate[required] cairs_item_dropdown", tabindex = "1" }) 

        } 
        else 
        { 
         @Html.DropDownList("str_itemdsc", new SelectList(""), "", new { tabindex = "1" }) 
        } 

       </td> 
     </tr> 
     </table> 
    </div> 
</div>

問題：我如何添加加動態圖標的每個下拉列表旁邊。

來源

2013-08-20 Sunny

一些谷歌搜索給了我這個.. CHK如果ü作品.. http://www.aspdotnet-suresh.com/2011/12/jquery-bind -images-to-dropdownlist-in.html –

像這樣：

$("select").each(function(){ 
    $("<a class='icon or whatever'></a>").insertAfter($(this)); 
});

來源

2013-08-20 07:57:49 reyaner

這裏不需要循環，你可以將一個選擇器傳遞給'insertAfter'，它會將內容添加到匹配的每個元素 –

也許他會做更多的東西... ... – reyaner

你可以使用一些jQuery的代碼來實現這一目標。

由於您的下拉列表位於<td>標記內，因此您可以選擇您的DDL，然後將圖標附加到其父標記 - 實際上是<td>。所以，把你的_Layout此代碼：

<script> 
    $(document).ready(function() { 
     $("select").parent().append("<img src='...' />"); 
    }); 
</script>

來源

2013-08-20 08:07:39 AminSaghi

如何使用jquery在dropdownlist旁邊添加圖標按鈕

回答

相關問題