2016-08-25 22 views
0

我能夠檢索文本字段,但使用剃刀獲取屬性的語法不起作用,在獲取它時我得到了未定義的從data-genre-id="@item.Id"使用mvc中的剃刀語法從下拉列表中獲取Id

$(".dropdown-menu li") 
       .on('click', 
        function() { 
          $(".dropdown-toggle").text($(this).text()); 
          var id = $(this).attr("data-genre-id"); 
          console.log(id); 
         }); 

..

<div class="dropdown"> 
     <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> 
      Dropdown 
      <span class="caret"></span> 
     </button> 
     <ul class="dropdown-menu" aria-labelledby="dropdownMenu1"> 

      @foreach (var item in Model.Genres) 
      { 
      <li><a data-genre-id="@item.Id">@item.Name</a></li> 
      }   
      <li role="separator" class="divider"></li> 
      <li><a href="#">Separated link</a></li> 

     </ul> 
    </div> 
+0

請注意,模型 - 視圖 - 控制器標記是關於模式的問題。 ASP.NET-MVC實現有一個特定的標籤。 –

+0

對不起,修正了它。 –

回答

0

data-genre-id屬性屬於a元素沒有li,所以當你點擊li必須找到a元素,並得到數據類型-id屬性。

改變你這樣的代碼:

$(document).ready(function(){ 

    $(".dropdown-menu li").on('click',function() { 

     $(".dropdown-toggle").text($(this).text()); 

     var id = $(this).find("a").attr("data-genre-id"); 

     console.log(id); 
    }) 
}) 

最終代碼:

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
</head> 
 
<body> 
 
    <div class="dropdown"> 
 
     <button class="btn btn-default dropdown-toggle" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true"> 
 
      Dropdown 
 
      <span class="caret"></span> 
 
     </button> 
 
     <ul class="dropdown-menu" aria-labelledby="dropdownMenu1"> 
 

 
      @foreach (var item in Model.Genres) 
 
      { 
 
      <li><a data-genre-id="@item.Id">@item.Name</a></li> 
 
      }   
 
      <li role="separator" class="divider"></li> 
 
      <li><a href="#">Separated link</a></li> 
 

 
     </ul> 
 
    </div> 
 
    
 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script> 
 
    <script> 
 
$(document).ready(function(){ 
 
    
 
    $(".dropdown-menu li").on('click',function() { 
 
     
 
     $(".dropdown-toggle").text($(this).text()); 
 
     
 
     var id = $(this).find("a").attr("data-genre-id"); 
 
     
 
     console.log(id); 
 
    }) 
 
}) 
 
    </script> 
 
</body> 
 
</html>

+0

沒有看到那個,謝謝! –