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

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

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

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

index.php

PHP/HTML
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
<!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
1
2
3
4
5
<?php
$a=$_GET['a'];
echo $a;
// сдесь далее будет код записи данных в бд
?>

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

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

@Alorian · 17.05.2010, 19:06

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

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
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
1
2
3
4
5
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
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
<!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
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
<?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
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
<!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
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
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
1
2
3
4
5
6
<?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
1
2
3
4
5
6
7
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
1
2
3
4
5
6
7
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
1
2
3
4
5
6
7
8
<?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 очень трудно чтото мне дается

Новые блоги и статьи Все статьи Все блоги /
Установка Qt Creator для C и C++: ставим среду, CMake и MinGW без фреймворка Qt 8Observer8 05.04.2026 Среду разработки Qt Creator можно установить без фреймворка Qt. Есть отдельный репозиторий для этой среды: https:/ / github. com/ qt-creator/ qt-creator, где можно скачать установщик, на вкладке Releases:. . .	AkelPad-скрипты, структуры, и немного лирики.. testuser2 05.04.2026 Такая программа, как AkelPad существует уже давно, и также давно существуют скрипты под нее. Тем не менее, прога живет, периодически что-то не спеша дополняется, улучшается. Что меня в первую очередь. . .	Отображение реквизитов в документе по условию и контроль их заполнения Maks 04.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "ПланированиеСпецтехники", разработанного в конфигурации КА2. Данный документ берёт данные из другого нетипового документа. . .	Фото всей Земли с борта корабля Orion миссии Artemis II kumehtar 04.04.2026 Это первое подобное фото сделанное человеком за 50 лет. Снимок называют новым вариантом легендарной фотографии «The Blue Marble» 1972 года, сделанной с борта корабля «Аполлон-17». Новое фото. . .
Вывод диалогового окна перед закрытием, если документ не проведён Maks 04.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: реализовать программный контроль на предмет проведения документа. . .	Программный контроль заполнения реквизитов табличной части документа Maks 02.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: 1. Реализовать контроль заполнения реквизита. . .	wmic не является внутренней или внешней командой Maks 02.04.2026 Решение: DISM / Online / Add-Capability / CapabilityName:WMIC~~~~ Отсюда: https:/ / winitpro. ru/ index. php/ 2025/ 02/ 14/ komanda-wmic-ne-naydena/	Программная установка даты и запрет ее изменения Maks 02.04.2026 Алгоритм из решения ниже реализован на примере нетипового документа "СписаниеМатериалов", разработанного в конфигурации КА2. Задача: при создании документов установить период списания автоматически. . .

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

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