Отправка избранных меню

Question

Я использую код в jQuery Mobile для динамического создания меню выбора, но у меня возникают проблемы при передаче данных в базу данных. Меню создаются с использованием append метод для каждого элемента формы. Вот краткий пример кода:

for (var i = 0; i < arr.length; i++) {
var r = arr[i];
console.log(r);
    name    = r.optionname;
    val     = r.optionvalue;
    nameid  = r.optionnameid;
    valueid = r.optionvalueid;
if ($("#prodAttributes_"+prodID+" select").is("[name*=" + name + "]")) {

var select = $("#prodAttributes_"+prodID).find("select[name*=" + name + "]");
var option = $("<option></option>");
    option.val(val);
    option.text(val);
    option.attr("id", valueid);
    select.append(option);
  } else {

var select = $("<select></select>");
    select.attr("name", name);
    select.attr("id", nameid);
var option = $("<option></option>");
    option.val(val);
    option.text(val);
    option.attr("id", valueid);
    select.append(option);
var label = $("<label></label>");
    label.attr("class", "select");
    label.attr("for", name);


    label.text(name);
    fieldset.append(select);
    myform.append(div);
    $(myform).appendTo("#prodAttributes_"+prodID);

    }

    }

Я знаю, что это не самый хороший код.

У меня проблема в том, что я не знаю, как получить представленные данные. Я так растерялся, если мне нужно использовать тег формы.

Это действительно нужно? Должен ли я использовать тег или тег ?

Должен ли я использовать функцию при нажатии на кнопку отправки или использовать что-то из библиотеки jQuery?

Сгенерированный HTML здесь:

<div id="prodAttributes_2">
<form id="attributesubmit">
<div data-role="fieldcontain">
<fieldset data-role="controlgroup">
<div role="heading" >Options:</div>

<select name="Memory" id="4">
<option value="16 mb" id="3">16 mb</option>
<option value="32 mb" id="4">32 mb</option>
</select>


<select name="Model" id="3">
<option value="Premium" id="6">Premium</option>
<option value="Deluxe" id="7">Deluxe</option>
</select>

</fieldset>
</div>
<input type="button" id="submitme" value="send" />
</form>
</div>

Я также сделал JSFiddle, чтобы показать вам, как это на самом деле выглядит.

Я пришел к выводу, что я должен запустить функцию. Однако я сомневаюсь serialize() делает то, что я хочу, так что-то вроде:

$("#submitme").live('click', function(){
$('select').each(function() {
var selectedOption = $(this).find('option:selected');

alert('Value: ' + selectedOption.val() + ' Text: ' + selectedOption.text());
});

var formData = '<p>something generated</p>';
var newPage = $('<div data-role="page" data-url="test"><div data-role="header"><h1>test</h1></div><div data-role="content">'+formData+'</div></div');
    newPage.appendTo( $.mobile.pageContainer );
    //append it to the page container
    $.mobile.changePage(newPage);

        });

Но тогда мне все равно требуется имя / идентификатор самого выбранного элемента. Как будет выглядеть код, когда его можно будет вставить в базу данных SQL?

Answer 1

Это полностью связано с действием, которого вы хотите достичь. Если вы используете кнопку submit когда вы делаете клик, он будет искать все элементы в форме и отправлять его на URL-адрес атрибута action из form в формате get или же post и это автоматически, поэтому, если вам нужно отправить много элементов, вы должны рассмотреть вопрос об использовании submit, Теперь запомните, что это не AJAX, чтобы вы не могли знать, что происходит на сервере. Если есть несколько элементов, вы можете поймать событие нажатия кнопки и обернуть селекторами элементы, а затем отправить его по ajax.

Заметка

Вы можете связать submit событие типа кнопки submit а затем отправить AJAX, призванный контролировать ответ сервера

ОБНОВИТЬ

Я не совсем уверен, что вы хотите достичь, но вот как вы можете получить и обработать все поля в форме, связывающей кнопку отправки, чтобы избежать выбора селектора для каждого HTML-элемента в форме

Предполагая, что кнопка, это ввод ввода

$('form#attributesubmit').live('submit', function (){

     $(this).serialize() -->> this give you all the fields and values of the form
});

Answer 2

Каким-то образом вам нужно отправить данные обратно на сервер. Вы можете сделать это, используя AJAX (используя дополнительные методы jQuery) - что позволит вам остаться на той же странице после нажатия "Отправить", или вы можете сделать это как традиционную HTML-форму - что потребует <form> тег с action установите URL, который вы хотите отправить.