получение переменной размера формы для javascript и PHP (AJAX)

Фон. У меня есть веб-страница, содержащая кучу кнопок (думаю, POS-система). Я хочу, чтобы пользователь мог редактировать имя кнопки (используется для размещения в определенном порядке) и текст кнопки, который содержит 2 части, которые являются предметом и стоимостью. В настоящее время я работаю, передавая данные с PHP-страницы (где делаются изменения) на другую страницу PHP (где я пишу ее обратно в db), но я хочу использовать больше метода AJAX и передать его в js функция для обновления, когда редактирование сохраняется. Поскольку количество кнопок может быть очень я не знаю точное количество кнопок для чтения в скрипт. В настоящее время у меня есть что-то вроде этого …

echo "<td><input type='text' name='btn[]' size='5' value='" . $row['button'] . "'/></td>"; echo "<td><input type='text' name='itm[]' size='5' value='" . $row['item'] . "'/></td>"; echo "<td><input type='text' name='prc[]' size='5' value='" . $row['price'] . "'/></td>"; 

который отправляется на страницу PHP, где у меня есть …

 $buttonArray = $_POST['btn']; $itemArray = $_POST['itm']; $priceArray = $_POST['prc']; $numberofItems = count($itemArray); for ($i=0; $i<$numberofItems; $i++) { $sql = "UPDATE concessions SET button = '".$buttonArray[$i]."', item = '".$itemArray[$i]."', price = '".$priceArray[$i]."'"; mysql_query($sql); } 

Я хочу сделать что-то подобное в js, глядя на document.form.elements, но не могу понять, как отправить что-то (например, и массив). Я могу использовать цикл for для прокрутки. Любое предложение приветствуется.

Related of "получение переменной размера формы для javascript и PHP (AJAX)"

Существует очень простой способ сделать это: используйте эту простую функцию javascript (убедитесь, что у вас загружен последний jquery)

 $.fn.serializeObject = function() { var o = {}; var a = this.serializeArray(); $.each(a, function() { if (o[this.name] !== undefined) { if (!o[this.name].push) { o[this.name] = [o[this.name]]; } o[this.name].push(this.value || ''); } else { o[this.name] = this.value || ''; } }); return o; }; 

Эта функция будет сериализовать ваши элементы формы в правильном порядке и выведет объект javascript. Вам нужно использовать его с помощью ajax, чтобы проанализировать ваши значения:

 var objects = $("#ID_OF_YOUR_FORM").serializeObject(); $.ajax({ url: "your_ajax_file_location.php", type: "POST", data: ({ objects:objects, otherdata:otherdata }), success: function(msg){ /* do whatever here */ } }); данные var objects = $("#ID_OF_YOUR_FORM").serializeObject(); $.ajax({ url: "your_ajax_file_location.php", type: "POST", data: ({ objects:objects, otherdata:otherdata }), success: function(msg){ /* do whatever here */ } }); данные var objects = $("#ID_OF_YOUR_FORM").serializeObject(); $.ajax({ url: "your_ajax_file_location.php", type: "POST", data: ({ objects:objects, otherdata:otherdata }), success: function(msg){ /* do whatever here */ } }); 

Ajax сделает это волшебство и автоматически преобразует этот объект в php-массив и отправит его в php … попробуйте следующее:

 echo "<pre>".$_POST['objects']."</pre>"; 

Массив php должен выглядеть так:

 { btn= array( "your btn1 info", "your btn2 info", "your btn3 info" ); itm= array( "your itm1 info", "your itm2 info", "your itm3 info" ); prc= array( "your prc1 info", "your prc2 info", "your prc3 info" ); } 

Из этого типа массива довольно легко манипулировать в php, чтобы обновить вашу базу данных