Ajax-MySql-Php проблема (отправить текст из формы, отправить через AJAX в php скрипт, обратно в div) - PullRequest
Новая
       1

Ajax-MySql-Php проблема (отправить текст из формы, отправить через AJAX в php скрипт, обратно в div)

0 голосов
/ 22 сентября 2011

Я хотел бы отправить данные в БД MySql из формы через AJAX и PHP-скрипт.Я могу сделать это идеально, используя выбор параметров в форме, но я просто не могу получить его, используя текстовую форму отправки.

Первое, что работает:

Форма HTML: 

<form>
<select name="users" onchange="showUser(this.value)">
<option value="">Select a person:</option>
<option value="1">Peter Griffin</option>
<option value="2">Lois Griffin</option>
</select>
</form>

.js Scipt: 

function showUser(str)
{
        if (str=="")
  {
  document.getElementById("txtHint").innerHTML="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
    }
  }

xmlhttp.open("GET","getuser.php?q="+str,true);
xmlhttp.send();
}

PHP Script: 

<?php
$q=$_GET['q'];

$con = mysql_connect('localhost', 'root');
if (!$con)
  {
  die('Could not connect: ' . mysql_error());
  }

mysql_select_db("ajax_demo", $con);

$sql="SELECT * FROM emp WHERE id = '$q'";

$result = mysql_query($sql);

$i = 0;

echo "<table class=\"table-master\">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Age</th>
<th>Hometown</th>
<th>Job</th>
</tr>";

while($row = mysql_fetch_array($result))
  {
  $i++;
  echo "<tr class=\"d".($i & 1)."\">";
  echo "<td>" . $row['FirstName'] . "</td>";
  echo "<td>" . $row['LastName'] . "</td>";
  echo "<td>" . $row['Age'] . "</td>";
  echo "<td>" . $row['Hometown'] . "</td>";
  echo "<td>" . $row['Job'] . "</td>";
  echo "</tr>";
  }
echo "</table>";

mysql_close($con);
?>

То, что я хочу сделать, - это иметь текстовое поле в моем HTML, которое будет заполнено пользователем, когдапользователь нажимает «отправить», эта информация передается в js-скрипт, содержащий сегмент AJAX, запрашивается БД, а результаты передаются в мой DIV.

Где я думаю, что я иду не так - не могу использовать onchange , очевидно, в форме при использовании текстовой формы для передачи.Должен быть подан!?Скрипт js работает, поэтому я думаю, что моя AJAX-часть в порядке.Сценарий PHP также работает, но опять же, все ломается, как только я пытаюсь получить ввод текста из формы.Возможно, мой js-скрипт не настроен для захвата входящих переменных текстовой формы !?Буду признателен за любую помощь / руководство.

Ответы [ 2 ]

0 голосов
/ 22 сентября 2011

Если вы хотите XmlHttp, то вот как я делаю это для одного текстового поля, добавьте больше себя. Создайте тестовую таблицу с именем emp с 5 полями f1, f2, .., f5, и это будет работать:

index.htm 

<html>
<head>
<script type="text/javascript">

var request = false;
try { 
  request = new XMLHttpRequest(); 
} catch (trymicrosoft) {                         
  try { 
    request = new ActiveXObject("Msxml2.XMLHTTP"); 
  } catch (othermicrosoft) {
    try {
      request = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (failed) {                  
      request = false;       
    }
  }
}

if (!request) 
  alert("Error initializing XMLHttpRequest!"); 
</script>

<script type="text/javascript">
   function getEmp(emp) 
   { 
        document.getElementById('results').innerHTML="Please wait..."; 

        //we will call asychronously getData.php 
        var url = "getEmp.php";
        var params = emp;//no url parameters
     var params = "empField=" +emp+"";
        request.open("POST", url, true);//use post for connect harder to attack, lots of data transfer 

        //Some http headers must be set along with any POST request.
        request.setRequestHeader("Content-type", "application/x-www-form-urlencoded;charset=utf-8");
        request.setRequestHeader("Content-length", params.length);
        request.setRequestHeader("Connection", "close");

        request.onreadystatechange = updatePage;
        request.send(params);

   }////////////////////

   //You're looking for a status code of 200 which simply means okay.
   function updatePage() {
     if (request.readyState == 4) {
       if (request.status == 200) 
       {   
            document.getElementById('results').innerHTML=request.responseText;   
       } 
       else{
         //alert("status is " + request.status);
         }
     }
   }

</script>
</head>
<body >


Write employ name: <input type="text" name="emp" id='empField' value='John'/>
<span style="background-color:blue;color:yellow;"  
onClick="getEmp(document.getElementById('empField').value )"/>
Click to find
</span>

<div id="results">

</div>


</body>
</html>

getEmp.php 

<?PHP

 mysql_connect('localhost', 'root',''); 
mysql_select_db("ajax_demo" );

$sq='\'';
$sql="SELECT * FROM emp WHERE f1 = ".$sq.$_POST['empField'].$sq." ";

$result = mysql_query($sql); 
$row = mysql_fetch_row($result);

?>

<table border=4>
<tr><td>Field 1</td><td>Field 2</td><td>Field 3</td><td>Field 4</td><td>Field 5</td></tr>
<tr>
    <td><?PHP echo $row[0]; ?></td>     <td><?PHP echo $row[1]; ?></td> 
    <td><?PHP echo $row[2]; ?></td>     <td><?PHP echo $row[3]; ?></td> 
    <td><?PHP echo $row[4]; ?></td>     
<tr>
</table>
0 голосов
/ 22 сентября 2011

Прежде всего, я ленивый и использую jquery. Но если у вас есть несколько входов в форме, лучше всего использовать обработчик onsubmit или обработчик onclick на вашей кнопке отправки.

Вы должны получить значение каждого элемента и правильно построить строку запроса: 

<form>
<select id="users" name="users">
<option value="">Select a person:</option>
<option value="1">Peter Griffin</option>
<option value="2">Lois Griffin</option>
</select>
<input id="textfield" name="textfield" type ="text" />
<input type="submit" value="process" onclick="showUser()" />
</form>


    function showUser()
{
var sel = document.getElementById('users');
var selvalue = sel.options[sel.selectedIndex].value;
var textfield = document.getElementById('textfield').value;

        if (selvalue=="" || textfield = "")
  {
 document.getElementById("txtHint").innerHTML="";
  return false;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
{
if (xmlhttp.readyState==4 && xmlhttp.status==200)
  {
  document.getElementById("txtHint").innerHTML=xmlhttp.responseText;
  }
}

xmlhttp.open("GET","getuser.php?q=" + selvalue + "&t=" + textfield,true);
xmlhttp.send();
return false;
}

Вы должны проверить переменную T в вашем php-скрипте и делать с ней все, что захотите. Пожалуйста Пожалуйста Пожалуйста продезинфицируйте ваши данные перед взаимодействием с базой данных.

вы должны привести к int и использовать mysql_real_escape_string () или параметризованные запросы.

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

Я уверен, что у кого-то есть намного лучший способ сделать это - я не очень хорошо знаю javascript.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...