Я хочу отправить данные полей из формы в файл через AJAX, и я нашел это решение в Интернете: http://techglimpse.com/pass-localstorage-data-php–ajax–jquery/
Единственная проблема заключается в том, что у меня есть несколько полей вместо одного поля, и я хочу сохранить вывод (localStorage) в файле HTML (или любом другом формате), а не показывать его в #output div.
Как я могу это сделать?
Вы можете увидеть мою работу, которую я сделал до сих пор: Сохранить данные формы, используя AJAX для PHP
И вот мой код HTML / JS: http://jsbin.com/iSorEYu/1/edit и код PHP http://jsbin.com/OGIbEDuX/1/edit
PHP:
<h1>Below is the data retrieved from SERVER</h1> <?php date_default_timezone_set('America/Chicago'); // CDT echo '<h2>Server Timezone : ' . date_default_timezone_get() . '</h2>'; $current_date = date('d/m/Y == H:i:s '); print "<h2>Server Time : " . $current_date . "</h2>"; $dataObject = $_POST; //Fetching all posts echo "<pre>"; //making the dump look nice in html. var_dump($dataObject); echo "</pre>"; //Writes it as json to the file, you can transform it any way you want $json = json_encode($dataObject); file_put_contents('your_data.txt', $json); ?> JS:
<script type="text/javascript"> $(document).ready(function(){ localStorage.clear(); $("form").on("submit", function() { if(window.localStorage!==undefined) { var fields = $(this).serialize(); localStorage.setItem("eloqua-fields", JSON.stringify( fields )); alert("Stored Succesfully"); $(this).find("input[type=text]").val(""); alert("Now Passing stored data to Server through AJAX jQuery"); $.ajax({ type: "POST", url: "backend.php", data: fields, success: function(data) { $('#output').html(data); } }); } else { alert("Storage Failed. Try refreshing"); } }); }); </script>
ПРИМЕЧАНИЕ. Замените формат файла your_data на html в PHP-коде, если вы хотите, чтобы ваши данные JSON были в формате HTML.
Вы слишком много компрометируете. Проверка localStorage может быть проще ( другие параметры ). jQuery имеет функцию serialze() которая принимает все элементы формы и сериализует ее. Вы можете сохранить их в разделе «eloqua-fields», чтобы вы могли найти его снова. Не нужно делать какое-то фантастическое случайное ожидание.
Я хотел бы добавить, что не все из вас имеют смысл. Зачем использовать localstorage, если вы очищаете его каждый раз, когда DOM готов? Ваша проверка не отменяет процесс отправки, если есть ошибки, но я предполагаю, что вы просто хотите поиграть с вещами.
$(document).ready(function(){ localStorage.clear(); $("form").on("submit", function() { if(window.localStorage!==undefined) { var fields = $(this).serialize(); localStorage.setItem("eloqua-fields", JSON.stringify( fields )); alert("Stored Succesfully"); $(this).find("input").val(""); //this ONLY clears input fields, you also need to reset other fields like select boxes,... alert("Now Passing stored data to Server through AJAX jQuery"); $.ajax({ type: "POST", url: "backend.php", data: {data: fields}, success: function(data) { $('#output').html(data); } }); } else { alert("Storage Failed. Try refreshing"); } }); });
Для части сервера, если вы просто хотите хранить данные где-то.
$dataObject = $_POST['data']; $json = json_decode($dataObject); file_put_contents('your_data.txt', $json) ;