【问题标题】:Foreach loop on dynamic number of checkboxes, get nameForeach循环动态数量的复选框,获取名称
【发布时间】:2013-05-30 02:01:31
【问题描述】:

所以我有了这个概念(我对它可能是一个坏概念的可能性持开放态度)循环遍历checkboxes 的动态数字并取每个已选择的checkbox 的名称并推送它到我表单上的隐藏文本字段,以便可以在我的应用程序的其他地方使用已选择的 checkboxes 名称的值。但是,对于 JQuery 来说有点新,我不确定这是否可以完成或如何完成。这是我迄今为止的研究成果:

相关的jQuery:

    $('#saveButton').click(function () {

      $('checkbox').each(function () {
          if ($(this).is(':checked')) {
              $('#hiddenDate').append($(this).text());
          }
      });
   });

相关查看代码:

<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<% using (Html.BeginForm("SaveExit", "User", new { }, FormMethod.Post, new { id = "selectExitPoints" }))    { %>
    <fieldset>
        <div class="title center xl">Event&nbsp;Exit&nbsp;Selection&nbsp;</div>
        <table class="data-table">
        <%var odd = true; %>
        <%foreach (var log in Model.Log.OrderBy(s => s.DateEntered))
        { %>
            <tr class="row_<%=(odd ? "odd" : "even")%>">
                <td><input class="skill-checkbox" name="<%=log.DateEntered%>" type="checkbox" /></td>
                <td><span class="skill-text"><%= log.DateEntered%></span></td>
                <td><span class="skill-text"><%= log.EntryAccessPoint %></span></td>
            </tr>
            <%odd = !odd;%>
        <% } %>
        </table>
        <input type="hidden" id="hiddenDate" />
    </fieldset>
<% } %>

谁能指出我正确的方向?

【问题讨论】:

  • 如果用户反复点击复选框,hiddenDate 将会变得很长。
  • $('checkbox') 应该是 $(':checkbox') 或者更好的是 $('[type=checkbox]')
  • 这就是为什么我把那个特定的函数放在保存函数中——这样 hiddenDate 只会在用户被引导离开页面时被填充一次,因为保存函数也会执行重定向
  • @Blazemonger 产生以下错误:'TypeError: Object [type=checkbox] has no method 'each''
  • 那你没有输入正确。

标签: jquery asp.net-mvc checkbox


【解决方案1】:

您可以使用jQuery .map()。就这样:

var values = $.map($(':checkbox:checked'), function(el){
    return $(el).prop('name');
})
$('input').val(values.join(','));

【讨论】:

  • 使用我的 JQuery 版本,我现在不记得这通过将 .prop 更改为 .attr 来工作,所以谢谢!
  • 是的,道具适用于 jquery >1.6,至少你发现了问题!
猜你喜欢
  • 2014-12-10
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2014-07-11
  • 1970-01-01
  • 2021-07-20
  • 2020-05-01
相关资源
最近更新 更多