我有带有列的html表,其中每个列都包含按钮和下拉列表。

<table class="table" border="1">
   <thead>
      <tr>
         <td>
            <p>
               Terminy
            </p>
            <br/>
            <p>
               Warsztat
            </p>
            <p>
               Liczba uczestników
            </p>
         </td>
         @foreach(DateTime date in Model.AssignedAttractions.Keys.ToList())
         {
         <td>
            <p>
               @date.ToShortDateString()
            </p>
            <p>
               @(ReservationAttractions.Days[date.DayOfWeek.ToString()])
            </p>
            <p>
               @Html.DropDownList("AttractionsAvaiableAttractions", Model.AvaiableAttractions)
            </p>
            <p>
               @Html.DropDownList("AttractionsQuantityParticipants", Model.ParticipantsQuantity)
            </p>
            <p>
               <input type="button" value="Wybierz" />
            </p>
         </td>
         }
      </tr>
   </thead>
</table>


列数可以不同。如何使用javascript单击哪个按钮,并从单击按钮所在列的下拉列表中获取所选项目?

使用模型填充表格。

public class ReservationAttractions
    {

        public List<SelectListItem> AvaiableAttractions { get; set; }

        public List<SelectListItem> ParticipantsQuantity { get; set; }

        public Dictionary<DateTime,List<string>> AssignedAttractions { get; set; }

    }

最佳答案

您可以为按钮添加点击处理程序。然后获得在下拉菜单中选择的值,如下所示:

$(document).ready(function () {
    $("thead td input[type='button']").click(function () {
        // gets the td for which button was clicked
        var $td = $(this).closest("td");
        // gets the selected Attraction for that particular td
        var selectedAttractions = $td.find("[name^='AttractionsAvaiable']").val();
        // gets the selected Participants for that td
        var selectedParticipants = $td.find("[name^='AttractionsQuantity']").val();
    });
});


MVC将name属性添加到表单元素。并且当存在循环时,它会附加一些额外的内容来区分元素。 [name^='AttractionsAvaiableAttractions']Attribute Starts With Selector。这将返回select元素。由此,您可以获取.val()以获得在下拉菜单中选择的值。

08-27 00:53
查看更多