Question

我有手风琴我正在填充数据库中的数据。我所有这些都运作良好，或者至少看起来如此。我试图找到解决方案的问题是每个手风琴面板都包含一个表单，其中包含填写表单字段的相应记录数据。

我想要做的是能够独立提交每个表单，并从展开的面板中提取值，以便能够在我的jQuery代码中处理该数据。

我已经尝试使用手风琴激活事件，但似乎无法弄清楚如何在激活的面板中寻址元素。我相当肯定这是一个相当简单的解决方案。我只是不确定如何接近它，并希望此前有人这样做过。

非常感谢，

Answer 1

我似乎已经设法自己解决了这个问题。对于那些曾经遇到过这个问题的人，我希望这可以帮助你。

这是我在jsFiddle上的工作版本。 http://jsfiddle.net/Bf28Q/1/

<div id="cust-data-accordian">
  <h3>Joe Schmoe: 1</h3>
  <div id="ac_panel_1">
    <form name="frmDlyUpld" id="frmDlyUpld_1" mehtod="post" action="/functions/update">
      <input type="hidden" name="account_id" id="account_id_1" value="1" />
      First name: <input type="text" name="firstname" id="firstname_1" value="Joe" /><br />
      Last name: <input type="text" name="lastname" id="lastname_1" value="Schmoe" /><br />
      <input type="submit" name="frmSubmit" id="fromSubmit_1" />
    </form>
  </div>
  <h3>Jane Schmoe: 2</h3>
  <div id="ac_panel_2">
    <form name="frmDlyUpld" id="frmDlyUpld_2" mehtod="post" action="/functions/update">
      <input type="hidden" name="account_id" id="account_id_2" value="2" />
      First name: <input type="text" name="firstname" id="firstname_2" value="Jane" /><br />
      Last name: <input type="text" name="lastname" id="lastname_2" value="Schmoe" /><br />
      <input type="submit" name="frmSubmit" id="fromSubmit_2" />
    </form>
  </div>
</div>

var values = {};
$('#cust-data-accordian').accordion({
  activate: function(i, e) {
    var panel_id = e.newPanel[0].id;
    var acct_id  = panel_id.match(/\d+/);
    var inputs   = $('#frmDlyUpld_' + acct_id + ' :input');
    inputs.each(function() {
        values[this.name] = $(this).val();
    });
    console.log(values);
  }
});

jQuery UI Accordion寻址每个面板的元素

1 个答案: