Когда пользователь отправляет форму на мою страницу, я использую AJAX для отправки информации без обновления страницы. После того, как пользователь отправит информацию, я хочу запустить функцию PHP, которую я уже написал, которая отображает информацию. Возможно ли это, или мне нужно запустить еще одну функцию ajax для обновления после
$(function () { $('add').on('submit', function (e) { $.ajax({ type: 'post', url: 'submit.php', data: $('this').serialize(), success: function () { alert('form was submitted'); } }); e.preventDefault(); updateWords(); //PHP FUNCTION }); });
Вам нужно будет запустить еще один вызов AJAX для успеха первого.
JavaScript не может напрямую взаимодействовать с PHP, поэтому вы не можете вызывать функцию PHP из функции успеха / завершения вызова AJAX.
в ответ на это.
У меня есть несколько форм на странице и, вероятно, 5 различных вызовов ajax, в которых одновременно вызывается не более двух, если json лучше, у вас есть ссылка на некоторый материал для чтения или дополнительный пример стека, подобный этому, поэтому я могу научить себя – user934902
прежде всего
jquery был сделан для старых браузеров для поддержки основных функций, которые ie6 не поддерживает
использование jquery является хорошим, если вы хотите иметь полную поддержку почти во всех браузерах
но есть и много плохих сторон:
теперь мы находимся в эпоху, когда большинство из ppl используют свои мобильные устройства и современные браузеры, которые поддерживают стандартный javascript 1.7.Андрой, ios, сафари, Internet Explorer 10, хром, опера и firefox поддерживают javascript 1.7
приведенный ниже код поддерживается этими браузерами.
это функция ajax, написанная мной, она обрабатывает post & get
вы можете узнать больше об этой функции здесь https://stackoverflow.com/a/18309057/2450730
function ajax(a,b,e,d,f,g,c){ c=new XMLHttpRequest; !f||(c.upload.onprogress=f); !g||(c.onprogress=g); c.onload=b; c.open(e||'get',a); c.send(d||null) } // Params: // Url,callback,method,formdata or {key:val},uploadFunc,downloadFunc,placeholder
простой запрос на получение будет
ajax('example.php',responseFunction);
и сложная функция сообщения будет
ajax('example.php',responseFunction,'post',new FormData(form),uploadFunc,dlFunc);
вам это нужно.
поэтому, если у вас есть ваша форма
<form id="myForm"> <input name="name"> Name <input name="surname"> Surname <input name="mail"> Email <input name="file" type="file" multiple> File/Files </form>
вам просто нужно написать такую функцию
var form=document.getElementsById('myForm'); form.onsubmit=function(e){ e.preventDefault(); ajax('submit.php',SUCCESS,'post',new FormData(this)); }
и вот мы подошли к вашему вопросу:
создайте файл submit.php для своих нужд
<?php // do whatever you need with the posted info // copy files to a specific folder // insert/update/delete the database // check for errors // lets say no errors $err=array(); // load extra info from database to an array called $extrainfo // load some functions... (you can do what you want here) // like executing the function you have already written and add that info to // the $extrainfo. $extrainfo=array('updated correctly','files copied'); $data=array('post'=>$_POST,'files'=>$_FILES,'info'=>$extrainfo,'errors'=>$err); echo json_encode($data); ?>
это возвращает json закодированный массив, который будет использоваться позже в javascript.
теперь нам нужно разработать этот json. в функции УСПЕХА
function SUCCESS(){ var data=JSON.parse(this.response); if(data.errors.length>0){ // you have some errors }else{ // no errors // display your response in a proper way. console.log(data); } }
внутри этой функции вам просто нужно отображать на основе данных ответа.
data
содержат все, что вам нужно.
вот весь код.
скопируйте и submit.php
в txt-файл и сохраните его как submit.php
. На данный момент я тестировал только хром.
<?php if($_POST){ $err=array(); $extrainfo=array('updated correctly','files copied'); $data=array('post'=>$_POST,'files'=>$_FILES,'info'=>$extrainfo,'errors'=>$err); echo json_encode($data); }else{ ?><!doctype html> <html> <head> <meta charset="utf-8"> <title>upload</title> <script> var form,result; function ajax(a,b,e,d,f,g,c){ c=new XMLHttpRequest; !f||(c.upload.onprogress=f); !g||(c.onprogress=g); c.onload=b; c.open(e||'get',a); c.send(d||null) } function SUCCESS(){ console.log(JSON.parse(this.response)); var data=JSON.parse(this.response); if(data.errors.length>0){ result.textContent='you have some errors:'+data.errors[0]; }else{ result.textContent=JSON.stringify(data, null, '\t'); } } window.onload=function(){ form=document.getElementById('myForm'); result=document.getElementById('response'); form.onsubmit=function(e){ e.preventDefault(); ajax('submit.php',SUCCESS,'post',new FormData(this)); } } </script> </head> <body> <form id="myForm"> <input name="name"> Name <input name="surname"> Surname <input name="mail"> Email <input name="file[]" type="file" multiple> File/Files <input type="submit" value="send"> </form> <pre id="response"></pre> </body> </html> <?php } ?>
Если функция зависит от вызова AJAX для submit.php
в submit.php
, создайте новый вызов AJAX. Если нет, то просто добавьте функцию в submit.php и вызовите ее в конце файла.
Вы должны использовать функцию ajax, которая выполняет обновление информации для обновления самой страницы одновременно.
Просто верните полезный HTML в качестве возврата из ajax и используйте его как содержимое HTML на странице.
Пример: test.php
<script> function updateName() { var url = './test.php?inpName=' + $('#inpName').val(); $.get( url, function( data ) { $( "#frmDivUpdate" ).html( data ); alert( "Call was performed." ); }); } </script> <div id="frmDivUpdate"> <form> Enter your name : <input name="inpName" id="inpName"> <br> <input type="button" onClick="updateName();" value="Update"> </form> </div> <?php if (isset($_GET)) { $inpName = $_GET["inpName"]; echo "You updated your val to $inpName"; } ?>
PHP – серверный, javascript – клиентский. вы не можете вызывать php от клиента, если страница уже загружена.
поэтому простой способ – ajax
в submit.php добавить:
echo json_encode($_POST);
или
Функция PHP, которую я уже написал
… информация, в которой вы нуждаетесь.
и в функции успеха
success: function () { // i don't use jquery but the response contains the json string console.log('the words you wanna update:',JSON.parse(response)); // updateWords(JSON.parse(response)); }
РЕДАКТИРОВАТЬ
вам также не нужно больше одной функции ajax
вы говорите, что вы уже написали скрипт для отображения следующей информации клиенту.
добавьте этот скрипт в файл submit.php
и функция succes даст вам то, что вам нужно в качестве ответа.
Я добавил echo json_encode($_POST);
потому что большую часть времени в качестве информации для ответа / обновления вам нужен тот, который вы только что опубликовали.