Передача данных в БД (ajax)

@Nebiros · Регистрация: 23.03.2010

Author24 — интернет-сервис помощи студентам

вот такой код сделал

index.php

PHP/HTML

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<script type="text/javascript">
function f(){
    var req= new XMLHttpRequest();
    req.open('get','data.php'+'?a',true);
    req.send(null);
    }
</script>
<title>Test</title>
</head>
<body>
 
<form action="#" method="get">
<input type="text" name="a">
<input type="submit" onClick="f()" value="ok">
</form>
<br>
<?php
echo $a;
?>
 
 
 
</body>
</html>

и data.php

PHP

<?php
$a=$_GET['a'];
echo $a;
// сдесь далее будет код записи данных в бд
?>

но сделал так чтобы его можно было и увидеть , но что то не работает , подскажите что не так ?

тоесть пытаюсь динамически передать данные в бд

@Alorian · 17.05.2010, 19:06

Изначально создается объект XMLHttpRequest и уже потом с помощью него отправляются запросы. У тебя я создания этого объекта не увидел. Кроссбраузерно он делается так:

Javascript

function getXmlHttp(){
  var xmlhttp;
  try {
    xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
  } catch (e) {
    try {
      xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
    } catch (E) {
      xmlhttp = false;
    }
  }
  if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
    xmlhttp = new XMLHttpRequest();
  }
  return xmlhttp;
}

Далее. Подсветку кода создали не зря. Если ты в своем примере включишь подсветку кода то сразу увидишь:

Javascript

function f(){
var req= new XMLHttpRequest();
req.open('get','data.php'+'?a',true);//Внимание на эту строку. В кавычках указывается текст. Переменные указываются без кавычек. 
req.send(null);
}

Запись в БД делается как обычно на языке php. С помощью аякса передается переменная, а манипулирование этой переменной точно такое же.
Советую изучить принципы работы аякса например по этому материалу http://javascript.ru/ajax/intro.

P.S. Имхо ты идешь не тем путем. Изучение отдельных технологий это просто упражнения для ума. Если хочешь уметь что то на практике, то нужно и заниматься практикой.
Хочешь создавать сайты, ну и пробуй создать конкретный сайт с конкретным функционалом. С 90% вероятностью для первого сайта аякс тебе не понадобится.

@Nebiros · 17.05.2010, 19:32 **[ТС]**

да хотел сразу все кирпичики изучить из которых делаются все сайты , а динамика практически везде сейчас используется , вот думал с ajax разберусь и буду в комплексе делать

@Nebiros · 18.05.2010, 13:05 **[ТС]**

всеравно неработает , вот пробовал по вики сделать и всеравно нет и нет

index.php

HTML5

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1251">
<script type="text/javascript">
//---------------------------------------------------------
function f(){
    var req = new XMLHttpRequest();
        function createRequestObject()
                {
                if (XMLHttpRequest == undefined) {
                XMLHttpRequest = function() {
                try { return new ActiveXObject("Msxml2.XMLHTTP.6.0"); }
                    catch(e) {}
                try { return new ActiveXObject("Msxml2.XMLHTTP.3.0"); }
                    catch(e) {}
                try { return new ActiveXObject("Msxml2.XMLHTTP"); }
                    catch(e) {}
                try { return new ActiveXObject("Microsoft.XMLHTTP"); }
                     catch(e) {}
                throw new Error("This browser does not support XMLHttpRequest.");
                    };
                }
                    return null;
                }
 
            }
            
        req.open("GET",'data.php'+?a,true);
        req.onreadystatechange = processReqChange;
        req.send(null);
        }
 
</script>
<title>Test</title>
</head>
<body>
 
<form action="#" method="get">
<input type="text" name="a">
<input type="submit" onClick="f()" value="ok">
</form>
<br>
<?php
echo $a;
?>
 
 
</body>
</html>

data.php

PHP

<?php
$a=$_GET['a'];
echo $a;
 
$host='localhost';
$user='root';
$pass='';
$name='test';
 
$l=mysql_connect($host,$user,$pass);
mysql_select_db($name,$l);
 
 
$id=4;
 
$q="insert into tes value ('$a',$id)";
mysql_query($q,$l);
 
mysql_close();
 
?>

в БД таблица tes и поля a и id (для упрощения)
отдельно БД тестил все там работает записывает , там все норм
проблемма с передачей переменной ('а')
подскажите где ошибка ?

@Alorian · 18.05.2010, 17:13

Твой код проще переписать чем исправить ошибки. Без обид

Написано с минимальной отладкой, но вроде работает.

HTML5

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
 
<head>
    <title>Testing...</title>
    <script type="text/javascript" src="script.js"></script>
</head>
 
<body>
 
<form method="post" action="/answer.php" id="form">
    <input type="text" name="ask" id="input">
    <input type="submit" id="submit" value="value">
</form>
    
</body>
 
</html>

Javascript

window.onload = function(){
    document.getElementById("form").onsubmit = request;
}
 
function getXmlHttp(){
    var xmlhttp;
    try {
        xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
    } catch (e) {
        try {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        } catch (E) {
            xmlhttp = false;
        }
    }
    if (!xmlhttp && typeof XMLHttpRequest!='undefined') {
        xmlhttp = new XMLHttpRequest();
    }
    return xmlhttp;
}
 
function request(){
    var req = getXmlHttp();
    var ask = document.getElementById("input").value;
    req.onreadystatechange = function() {  
        if (req.readyState == 4) { 
            if(req.status == 200) { 
                alert("answer: "+req.responseText);
            }
        }
    }
    req.open('GET', '/answer.php?ask='+ask, true);  
    req.send(null);
    return false;
}

PHP

<?php
if($_GET["ask"]){
    echo "Request succes! Value: ".$_GET["ask"];
}else{
    echo "Request empty!";
};

Вопросы?

Добавлено через 24 минуты
Бросилось в глаза сразу после отправки. В html вот этот кусок <form method="post" неправильный. Тут надо поставить get, а не post, но это влияет только на отправку формы при отключенном js у пользователя.

Добавлено через 20 минут
Чтобы было понятнее расскажу основной алгоритм:

1. Создаем чистый html безо всякого js с формой.
2. В подключенном js файле ставим обработчик на отправку формы сразу после загрузки всего окна.
3. Пишем функцию по кроссбраузерному созданию объекта xmlhttprequest
4. Пишем функцию request, которая и будет осуществлять работу ajax. В функции
а. Создаем объект xmlhttprequest в переменной "req".
б. Создаем переменную ask в которую помещаем значение input из формы.
в. Ставим обработчик на событие onreadystatechange, то по сути прописываем что делать после получения ответа от сервера.
г. Запрашиваем страницу на сервере.
д. Функция должна возвращать false, иначе дополнительно к js запросу форма отправится обычным методом без js.

Как то так.

@Nebiros · 18.05.2010, 17:37 **[ТС]**

вопросы как раз и есть

1: почему в index.html метод post а в js get
2: убрал

Javascript

req.onreadystatechange = function() {  
                if (req.readyState == 4) { 
                        if(req.status == 200) { 
                                alert("answer: "+req.responseText);
                        }
                }
        }

так как алерт ненужен , да и считаю лишний текст
3:ask переменная не передается , в алерте текст высвечивало а вот в бд пустое место пишет

@Alorian · 18.05.2010, 18:27

Сообщение от Nebiros

1. почему в index.html метод post а в js get

Ответил еще в предыдущем посте.

Сообщение от Nebiros

2: убрал

Javascript

req.onreadystatechange = function() { 
 if (req.readyState == 4) { 
 if(req.status == 200) { 
 alert("answer: "+req.responseText);
 }
 }
 }

А зачем убрал все? Если не нужен alert так и удаляй alert. В любом случае какие то действия на странице нужно совершать после ответа сервера, чтобы пользователь понял что что-то произошло после нажатия на кнопку.

Сообщение от Nebiros

3:ask переменная не передается , в алерте текст высвечивало а вот в бд пустое место пишет

Начальные параметры.
Есть php скрипт add.php записывающий данные в базу.
Данные он получает методом GET из переменной ask.

Задача.
Проверить пишет ли скрипт данные в базу.

Решение.
Запросить страницу add.php в браузере и передать в строке браузера переменную ask с любым значением.
Итоговый запрос в строке браузера:
add.php?ask=bugoga

Если bugoga запишется в базу, то скрипт пишет данные полученные методом GET.
Проверь безо всякого ajax, пишутся у тебя данные или нет?

После проверки если все работает
Вставь все что есть в твоем файле add.php в мой файл answer.php в самое начало.
Ничего кроме этого не изменяй. Вообще ничего.

Что должно произойти?
Твоя вставленная часть добавит данные в базу. Моя часть выведет на страницу alert.
Все должно работать. Мне сейчас проверить негде.

Если все заработает, то разбери код по строчкам. Он довольно легкий.

@Nebiros · 18.05.2010, 18:40 **[ТС]**

нашел наконецто где была ошибка причем такая элементарная

PHP

<?php
if($_GET["ask"]){
        echo "Request succes! Value: ".$_GET["ask"];
}else{
        echo "Request empty!";
};
 
$a=$_GET['a']; // <--- сдесь старая переменная стояла

смешно до слез , пол дня бился а ошибка элементарная

спасибо за подсказки , теперь все работает

@Alorian · 18.05.2010, 18:43

Сообщение от Nebiros

спасибо за подсказки , теперь все работает

Весь остальной код понятен?

@Nebiros · 18.05.2010, 18:59 **[ТС]**

да вроде уже начинаю вникать , просто думал что в js коде чтото не так а про php код как то не подумал но по немногу начинаю вникать в js

p.s. Если чесно уже изучил так в среднем php mysql html css но вот js очень трудно чтото мне дается

@Nebiros 41 / 40 / 16 Регистрация: 23.03.2010 Сообщений: 3,122
	17.05.2010, 19:32 [ТС]	3
	да хотел сразу все кирпичики изучить из которых делаются все сайты , а динамика практически везде сейчас используется , вот думал с ajax разберусь и буду в комплексе делать 0

@Alorian 694 / 534 / 40 Регистрация: 22.06.2009 Сообщений: 1,293
	18.05.2010, 18:43	9
	Сообщение от Nebiros спасибо за подсказки , теперь все работает Весь остальной код понятен? 0

@Nebiros 41 / 40 / 16 Регистрация: 23.03.2010 Сообщений: 3,122
	18.05.2010, 18:59 [ТС]	10
	да вроде уже начинаю вникать , просто думал что в js коде чтото не так а про php код как то не подумал но по немногу начинаю вникать в js p.s. Если чесно уже изучил так в среднем php mysql html css но вот js очень трудно чтото мне дается 0