Мне очень сложно понять, как все это работает. Я провел несколько дней с этим и не смог придумать никаких результатов. Я пытаюсь заполнить текстовое поле в форме, и когда форма отправлена, я хочу добавить текст в свой sqlite db с помощью ajax.
Я понимаю, что вам нужен вызов $ .get в jquery, который запускается в submit. Это похоже на то, что я могу запускать js-боксы. Однако, когда я передаю адрес php-скрипта, у которого есть строки для добавления в sqlite db с использованием PDO, в db ничего не добавляется. Однако, когда я запускаю этот php-скрипт с помощью php cli, что-то добавится в db.
Кажется, я не вижу здесь существенного шага. Я был бы очень признателен, если бы кто-то смог преодолеть этот пробел для меня!
Изменить: по просьбе Мартина есть код:
Мой php создает такой список с формой в середине:
<ul> <li>hello</li> <li id="formItem"> <form action="" method="post"> <input type=text name="content"/> </form> </li> <li>world</li> </ul> Затем мой код jquery выглядит так, чтобы добавить все, что находится в текстовое поле прямо над ним, в списке есть вызов ajax. Это внутри $ (document) .ready (function () {.
$("form").submit(function() { var inputText = $("input").val(); $.ajax({ type: "POST", url: "add.php", data: inputText, success: function() { $('#formItem').prev().after( "<li>" + inputText + "</li>" )} }); });того, как$("form").submit(function() { var inputText = $("input").val(); $.ajax({ type: "POST", url: "add.php", data: inputText, success: function() { $('#formItem').prev().after( "<li>" + inputText + "</li>" )} }); });
Мой файл add.php выглядит так, и он будет вставлять что-то в мой db, если я выполню скрипт php на cli:
<?php $base = new PDO('sqlite:todo.db'); $sql = $base->prepare("INSERT INTO ThisTable (content, priority) VALUES ('lolololol', 1);"); $sql->execute(); $base = null; ?>
Не забывайте, что HTTP – это протокол без учета состояния. Каждый HTTP-запрос, который вы делаете на ваш веб-сервер, обрабатывается одинаково. Это означает, был ли HTTP-запрос выполнен с использованием AJAX или нет.
Я пытаюсь сказать, что AJAX – это реализация на стороне клиента. Все AJAX означает, что вы можете взаимодействовать с вашим веб-сервером, не перезагружая свою страницу. Внедрение запроса AJAX в первый раз в JavaScript часто является изгибом мозга, потому что требование обратных вызовов и общий асинхронный характер взаимодействия затрудняют понимание.
Однако на сервере не о чем беспокоиться. Запрос AJAX по-прежнему является HTTP-запросом, поэтому независимо от того, переходите ли вы в http://www.yourwebsite.com/ajax/interact.php?a=1&b=2 в своем браузере или делаете запрос HTTP GET с помощью AJAX, ваш PHP сценарий будет по-прежнему вести себя точно так же. Если вы var_dump($_GET); в любой ситуации вы получите массив, чьи члены a и b равны 1 и 2 соответственно.
Если вы можете успешно эмулировать запрос AJAX в своем браузере, вручную перейдя по URL-адресу, это работа сервера.
Установив это, ваш JavaScript должен выглядеть примерно так:
$('#yourForm').bind('submit', function (event) { jQuery.get('/ajax/interact.php', 'a=1&b=2', function (response) { alert("AJAX request succeeded, response from the server was: " + response); }); event.preventDefault(); });
После того, как вы уверены в использовании методов AJAX jQuery, вам может понадобиться изучить методы, такие как serialize() чтобы помочь вам, и вы можете разработать код jQuery для чего-то следующим образом:
$('form.ajax').live('submit', function (event) { var self = $(this); jQuery[(self.attr('method') || 'get').toLowerCase()](self.attr('action'), self.serialize(), function (response) { alert("AJAX request succeeded, response from the server was: " + response); }); event.preventDefault(); });
Надеюсь это поможет 🙂
Функция submit должна return false;