Передача данных в БД (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 очень трудно чтото мне дается

Новые блоги и статьи
Что такое HCL Notes и как с ним работать InfoMaster 10.01.2025 HCL Notes (ранее известный как IBM Notes и Lotus Notes) представляет собой комплексную платформу для совместной работы и обмена информацией в корпоративной среде. Это многофункциональное решение,. . .	Как работать с Git из Windows и Visual Studio InfoMaster 10.01.2025 Работа с Git в Windows Работа с Git в операционной системе Windows может быть осуществлена с помощью различных инструментов, каждый из которых обладает своими уникальными возможностями и. . .	Аналог оператора switch case в Python InfoMaster 10.01.2025 Оператор switch case используется в программировании для выбора одного из нескольких вариантов исполнения кода. Однако в языке Python этот оператор отсутствует. Понимание аналогов switch case в. . .	Отличия абстрактного класса от интерфейса InfoMaster 10.01.2025 В современной разработке программного обеспечения существуют два основных механизма реализации абстракции: абстрактные классы и интерфейсы. Эти инструменты, хотя и схожи в своей основной цели -. . .	Как работать в Git InfoMaster 10.01.2025 Git — это одна из наиболее популярных систем контроля версий, которая активно используется разработчиками по всему миру. Она позволяет эффективно управлять изменениями в коде, координировать работу. . .	Реализация передвижения персонажа в Unity3d на C# InfoMaster 10.01.2025 Реализация передвижения персонажа в Unity3D начинается с правильной настройки проекта. Этот этап критически важен для создания отзывчивого и плавного управления. Рассмотрим основные шаги для создания. . .
Docker: руководство для начинающих InfoMaster 10.01.2025 В современном мире разработки программного обеспечения контейнеризация стала неотъемлемой частью процесса создания и развертывания приложений. Docker, как ведущая платформа контейнеризации, произвела. . .	Книги и учебные ресурсы по C# InfoMaster 08.01.2025 Базовые учебники и руководства Одной из лучших книг для начинающих является "C# 10 и . NET 6 для начинающих" Эндрю Троелсена и Филиппа Джепикса . Книга последовательно раскрывает основные концепции. . .	Что такое NullReferenceException и как исправить? InfoMaster 08.01.2025 NullReferenceException - одно из самых распространенных исключений, с которым сталкиваются разработчики на C#. Это исключение возникает при попытке обратиться к членам объекта (методам, свойствам или. . .	Что такое Null Pointer Exception (NPE) и как это исправить? InfoMaster 08.01.2025 Null Pointer Exception (NPE) - это одно из самых распространенных исключений в Java, которое возникает при попытке использовать ссылку на объект, значение которой равно null. Это исключение относится. . .	Русский язык в консоли C++ InfoMaster 08.01.2025 При разработке программ на C++ одной из частых проблем, с которой сталкиваются русскоязычные программисты, является корректное отображение кириллицы в консольных приложениях. Эта проблема особенно. . .	Telegram бот на C# InfoMaster 08.01.2025 Разработка ботов для Telegram стала неотъемлемой частью современной экосистемы мессенджеров. C# предоставляет мощный и удобный инструментарий для создания разнообразных ботов, от простых. . .

@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