форматирование данных формы / перебор динамически создаваемых наборов полей - PullRequest
0 голосов
/ 03 апреля 2012

Проблема: я не знаю, как выполнить форматирование данных формы в соответствии с требованиями API.

Вопрос: Я прошу вашей помощи:)

HTML:

<form id="donation">
     <fieldset>
          <ul>
               <li>
                    <input type="hidden" name="method" value="submitDonations" />
                    <input type="hidden" name="donor" value="Fred" />
                    <input type="hidden" name="donor_city" value="Nashville" />
                    <input type="hidden" name="donor_state" value="TN" />
                    <select name="donate_country">
                         <option value="choose_one">Choose One</option>
                         <option value="africa">Africa</option>
                         <option value="usa">USA</option>
                         <option value="china">China</option>
                    </select>
               </li>
               <li>
                    <label for="apples">Apples: </label>
                    <input type="number" name="apples" />
                    <label for="bananas">Bananas: </label>
                    <input type="number" name="bananas" />
                    <label for="pears">Pears: </label>
                    <input type="number" name="pears" />
               </li>
               <li>
                    <button>Donate</button>
               </li>
          </ul>
     </fieldset>
</form>

javaScript / jQuery

$('#donation').delegate('select', 'change', function(event) {
    var self = $(event.target),
    insertHere = $(self).parents('fieldset');
    $('#donation')
        .find('fieldset')
        .first()
        .clone()
        .insertAfter($(insertHere));
});

$('#donation').delegate('button', 'click', function(e) {
    e.preventDefault();
    $('#donation').find('fieldset').each(function() {
        //serializeArray() or something to go here but i can't figure it out
    });
});

Мне нужно, чтобы окончательный массив был представлен, чтобы выглядеть следующим образом / быть в следующем формате: method = submitDonations & donor = Fred & donor_city = Nashville & donor_state = TN & donations = [{donate_country: Африка, яблоки: 500, бананы: 300, груши: 200}, {donate_country: польза, яблоки: 300, бананы: 150, груши: 400}, {donate_country: Китай, яблоки: 400, бананы: 320, груши: 450}]

1 Ответ

0 голосов
/ 04 апреля 2012

К счастью и наконец ... Я понял это.Надеюсь, это поможет кому-то еще:

$('#donation').delegate('button', 'click', function(e) {
e.preventDefault();
var FORMDATA = {
    method: $('#donation').find('input[name=method]').val(),
    donor: $('#donation').find('input[name=donor]').val(),
    donor_city: $('#donation').find('input[name=donor_city]').val(),
    donor_state: $('#donation').find('input[name=donor_state]').val()
};
FORMDATA.donations = [];
var fieldsets = $('#donation').find('fieldset');
for(var f = 0; f < fieldsets.length - 1; f++) {
    var fieldset = $(fieldsets[f]);
    var inputs = fieldset.find(':input');
    var data = {};
    for(var i = 0; i < inputs.length; i++) {
        data[$(inputs[i]).attr('name')] = $(inputs[i]).val();
    }
    FORMDATA.donations.push(data);
}
$.get('url/', JSON.stringify(FORMDATA), function(data, textStatus, jqXHR) {
    if (//Errors) {
        //handle errors
    }
    //do stuff with returnObject
});
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...