2014-03-13 33 views
1

我有一個手風琴,我從數據庫中填充數據。我有所有的工作,或至少看起來是。我試圖找到一個解決方案的問題是,每個手風琴面板都包含一個帶有填充表單字段的相應記錄數據的表單。jQuery UI每個面板的手風琴尋址元素

什麼,我想要做的是能夠提交各自獨立的形式,以及拉動值從展開面板,能夠我的jQuery的代碼中對數據進行工作。

我已經嘗試使用手風琴激活事件開始,但似乎無法弄清楚如何解決激活面板中的元素。我相當肯定這是一個相當簡單的解決方案。我只是不知道如何處理它,並希望以前有人在這裏做過。

非常感謝,

+0

發表您的jsfiddle –

+0

我想,但我似乎無法得到手風琴到的jsfiddle正常工作。抱歉。 – Skittles

+0

我就給你看來什麼,我試圖做一個的jsfiddle。 http://jsfiddle.net/Bf28Q/ – Skittles

回答

0

我似乎已經成功地算出這個對我自己。對於那些曾經遇到過問題的人,我希望這可以幫助你。

這裏是我的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); 
    } 
});