Форум: Форум PHPФорум ApacheФорум Регулярные ВыраженияФорум MySQLHTML+CSS+JavaScriptФорум FlashРазное
Новые темы: 0000000
MySQL 5. В подлиннике. Авторы: Кузнецов М.В., Симдянов И.В. PHP. Практика создания Web-сайтов (второе издание). Авторы: Кузнецов М.В., Симдянов И.В. PHP на примерах (2 издание). Авторы: Кузнецов М.В., Симдянов И.В. Самоучитель MySQL 5. Авторы: Кузнецов М.В., Симдянов И.В. Самоучитель PHP 5 / 6 (3 издание). Авторы: Кузнецов М.В., Симдянов И.В.
ВСЕ НАШИ КНИГИ
Консультационный центр SoftTime

HTML+CSS+JavaScript

Выбрать другой форум

 

Здравствуйте, Посетитель!

вид форума:
Линейный форум Структурный форум

тема: Ajax дублирует выдачу
 
 автор: bibika   (11.10.2011 в 11:53)   письмо автору
3 Кб
 
 

Пробую разобраться в Ajax на простых примерах. На странице выдаче результатов почему-то дублируются записи в таком порядке
1
2
1
2
В базу данные поступают в нормальном виде, если убрать Ajax, все работает нормально. Файлы прикрепляю.

Спасибо

  Ответить  
 
 автор: АЯС   (11.10.2011 в 12:03)   письмо автору
 
   для: bibika   (11.10.2011 в 11:53)
 

А зачем Вы дважды вызываете файл submit.php - сначала посредством Ajax по событию onsubmit, затем в результате самого сабмита?

  Ответить  
 
 автор: bibika   (11.10.2011 в 12:19)   письмо автору
 
   для: АЯС   (11.10.2011 в 12:03)
 

Может подскажите как написать правильно. Кроме того я заметил вот что, если вставить в базу 1 запись и обновлять страницу вывода ничего не дублируется, если 2 записи, дублируется 1 запись и так далее..

Помогите разобраться.

  Ответить  
 
 автор: bibika   (11.10.2011 в 13:31)   письмо автору
 
   для: bibika   (11.10.2011 в 12:19)
 

Народ дайте пожалуйста простой пример с комментариями, что можно было разобраться.

  Ответить  
 
 автор: АЯС   (11.10.2011 в 18:57)   письмо автору
 
   для: bibika   (11.10.2011 в 13:31)
 

Из приложенных вами кодов совершенно непонятно - что именно вам надо.
Объясните кратко задачу. В том числе поясните:
- что должно появиться на странице по нажатию кнопки сабмит
- что должно появиться по нажатию ссылки "вывод"

  Ответить  
 
 автор: bibika   (11.10.2011 в 19:26)   письмо автору
 
   для: АЯС   (11.10.2011 в 18:57)
 

Объясняю:
в файл с формой index.html вводятся данные

файл submit.php обрабатывает данные и забрасывает данные в базу

файл vyvod.php просто выводит данные с базы без перезагрузки

в файл edit.php я думал засунуть редактирование данных без перезагрузки, но застрял на дубляже при выводе записей.

Если коротко, то:
>- что должно появиться на странице по нажатию кнопки сабмит
данные заносятся в базу и отображаются на странице vyvod.php

>- что должно появиться по нажатию ссылки "вывод"
на это можно внимания не обращать, это я сделал что б каждый раз не набирать в строке адрес vyvod.php

просто сложно найти простой пример без сторонних библиотек и наворотов, чтоб разобраться самому.
Спасибо за ответы

  Ответить  
 
 автор: bibika   (12.10.2011 в 07:04)   письмо автору
 
   для: bibika   (11.10.2011 в 19:26)
 

АЯС где Вы пропали. Очень жду Вашего ответа.

  Ответить  
 
 автор: АЯС   (12.10.2011 в 11:02)   письмо автору
 
   для: bibika   (11.10.2011 в 19:26)
 

Судя по вашему описанию, AJAX вам нужен только и исключительно для ссылки "вывод", которая вам как бы и не нужна и на которую вы просили "не обращать внимания":-)

PS. Очень трудно помочь тому, кто сам не понимает - а что именно ему нужно.
Или - если и понимает - не может объяснить ему требуемое.

  Ответить  
 
 автор: bibika   (12.10.2011 в 11:44)   письмо автору
 
   для: АЯС   (12.10.2011 в 11:02)
 

Да я косноязычен, кроме того русский не мой родной язык, та что извините. Вот что я хочу коротко:

главное
1. добавить без перезагрузки данные в базу
2. вывести их без перезагрузки на другой странице

не очень важное
3. если Вы покажете как сделать формочку в которой можно править внесенные в базу данные без перезагрузки вообще будет супер.

Извините, что отбираю Ваше время
Спасибо за ответ

>PS. Очень трудно помочь тому, кто сам не понимает - а что именно ему нужно.
>Или - если и понимает - не может объяснить ему требуемое.

Скорее второе, я понимаю, а не могу пояснить.

  Ответить  
 
 автор: Чайчай_выручай   (12.10.2011 в 12:25)   письмо автору
 
   для: bibika   (12.10.2011 в 11:44)
 

просто сложно найти простой пример без сторонних библиотек и наворотов, чтоб разобраться самому
Я могу написать код на jquery (стороння библиотека) сойдет?

  Ответить  
 
 автор: bibika   (12.10.2011 в 12:39)   письмо автору
 
   для: Чайчай_выручай   (12.10.2011 в 12:25)
 

Да если не сложно, напишите пример.

  Ответить  
 
 автор: Чайчай_выручай   (12.10.2011 в 13:29)   письмо автору
 
   для: bibika   (12.10.2011 в 12:39)
 

Это вырезки из регистрации, которые я использовал.

Dannie.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">
<title>Составление программы</title>
<link href="css/style.css" rel="stylesheet" type="text/css">
<script src=”query.js" type = "text/javascript"></script>
<script src="otpravka.js" type = "text/javascript"></script>
</head>
<body>
// Форму  можно не открывать и не закрывать, потому что мы сами ее отправим
<input type="text" name="name" id="name" >
//пароли и т.д. не буду писать все по аналогии с именем
<input type="submit" name="otp" id="otp" value="Зарегистрировать">
</body>
</html>


otpravka.js

$(document).ready(function(){
    //Если кликнули по сабмиту у которого id="otp"
    $('#otp').click(function(){
        // возвращаем в переменную х значение поля name
        var x = $('#name').val();
    // Указываем файл, который будет обрабатывать запрос
        $.post("ajax.php",
    //Что отправляем, можно и массив отправить
        {'m[]': x},
    //Функция которая возвращает обработанные данные
        function(prihod){
        if(prihod==1){alert('получилось')}else{alert('тупим');}
    });
    });
});



Ajax.php

<?php
header
('Content-type: text/html; charset=windows-1251');
// Здесь подключемся к базе данных
require_once '../bazadannih.php';
if (isset(
$_POST['m']))
// Меняем кодировку на нужную нам
{$name iconv ('UTF-8''cp1251'$_POST['m'][0]);
// Вставляем данные в таблицу, предположив, что мы отправили еще пароль и мэйл              
              
$query "INSERT INTO  table(name, pass, email)
            VALUES ('"
.mysql_real_escape_string$name )."', 
                      '"
.mysql_real_escape_stringmd5($pass))."', 
                          '"
.mysql_real_escape_string($email)."');"
            
            
$res mysql_query$query ); 
        
$vihod=1;                         
        }else{
$vihod=2;}
//Возвращаем данные
echo json_encode($vihod); //Закрывать php или что либо писать после этого нельзя

  Ответить  
 
 автор: bibika   (12.10.2011 в 13:35)   письмо автору
 
   для: Чайчай_выручай   (12.10.2011 в 13:29)
 

Спасибо уважаемый. Сейчас протестируем. И буду ждать решения от АЯСа, что б посмотреть на разные варианты.

Я тут посмотрел, у Вы только привели пример внесения записей в базу, а вывод с базы не покажете?

Спасибо

  Ответить  
 
 автор: Чайчай_выручай   (12.10.2011 в 14:12)   письмо автору
 
   для: bibika   (12.10.2011 в 13:35)
 


 $query = "SELECT  * FROM table WHERE
            name ='".mysql_real_escape_string( $name )."'
           LIMIT 1";
                      
            $res = mysql_query( $query ); 

  Ответить  
 
 автор: bibika   (12.10.2011 в 14:20)   письмо автору
 
   для: Чайчай_выручай   (12.10.2011 в 14:12)
 

Спасибо, вывести записи я знаю как. Я спрашивал о том, как вывести их на страницу с помощью Ajax, с минимальной задержкой.

  Ответить  
 
 автор: Чайчай_выручай   (12.10.2011 в 14:40)   письмо автору
 
   для: bibika   (12.10.2011 в 14:20)
 

otpravka.js

$(document).ready(function(){ 
    //Если кликнули по сабмиту у которого id="otp" 
    $('#otp').click(function(){ 
        // возвращаем в переменную х значение поля name 
        var x = $('#name').val(); 
    // Указываем файл, который будет обрабатывать запрос 
        $.post("ajax.php", 
    //Что отправляем, можно и массив отправить 
        {'m[]': x}, 
    //Функция которая возвращает обработанные данные 
        function(prihod){ 
        if(prihod){

//Выбираем элемент в котором будем выводить данные. 
В переменную vihod которая отправляется из файла ajax.php можно вставить хоть массив. 
Здесь он будет как строка, мы его обрежем, потому что по бокам будут 
квадратные скобки и сделаем массивом
var x = prihod.substring(1, prihod.length-1);
var massiv = x.split(",");
//Создаете <div id=idelement class=scrit_pokazat></div> в том месте, где хотите делать вывод данных. Даете ему класс в css
//.scrit_pokazat{display:none;}

$('# idelement').append('massiv').removeClass('scrit_pokazat'); 
alert(massiv)}else{alert('тупим');} 
    }); 
    }); 
});

  Ответить  
 
 автор: АЯС   (12.10.2011 в 21:21)   письмо автору
 
   для: bibika   (12.10.2011 в 11:44)
 

Мда...

Пойдём другим путём.

В окне браузера загружена текущая страница с двумя (тремя...десятью) полями для заполнения (и/или списки, где юзер может что-то выбрать) и с ОДНОЙ кнопкой.

Как я понял, по нажатию на эту кнопку на сервер передаются данные из полей, заполненных (выбранных) юзером, и что-то там (на сервере) с этими данными происходит (меняется база данных).

Вы попробуйте по-русски (можете даже на мове, если трудности с русским) объяснить - ЧТО должно произойти ВИЗУАЛЬНО в окне браузера после нажатия на эту кнопку?

Варианты (или/или):
1. текущая страница в окне должна замениться на какую-то другую (например, на файл, адрес которого указан в атрибуте ACTION тега <FORM> текущей страницы)
2. текущая страница должна остаться в окне браузера, но на ней должны произойти какие-то видимые юзеру изменения (какие именно?)
3. должно произойти что-то совсем другое, о чём я не смог догадаться

  Ответить  
 
 автор: bibika   (13.10.2011 в 20:09)   письмо автору
 
   для: АЯС   (12.10.2011 в 21:21)
 

Отвечаю кратко:

2. текущая страница должна остаться в окне браузера, но на ней должны произойти какие-то видимые юзеру изменения (какие именно?)

просто отобразить запись данные добавлены. Что-то типа как в Gmail.

  Ответить  
 
 автор: АЯС   (13.10.2011 в 23:00)   письмо автору
 
   для: bibika   (13.10.2011 в 20:09)
 

1. На текущей странице (файл index.html) создаёте форму (теги <form>...</form>)

2. У открывающего тега <form> НЕ НАДО прописывать никаких атрибутов. Совсем никаких: ни action, ни method, ни name, ни target... Абсолютно "голый" тег <form>.

3. Между тегами <form> и </form> помещаете нужные вам для заполнения юзером текстовые поля (теги <input type="text"> и <textarea>) и элементы, в которых юзер должен сделать выбор (теги <input type="checkbox">, <input type="radio">, <select>). И то, и другое - в любом нужном вам количестве и в любом порядке.

4. Каждому из прописанных текстовых полей (и каждому из прописанных элементов выбора) устанавливаете уникальные name. Обязательно - валидные значения (содержащие только латинские буквы любого регистра, арабские цифры и символ подчёркивания, при этом начинающиеся с буквы)

5. Кроме того, в любом месте (можно даже самой первой) между тегами <form> и </form> помещаете кнопку. Но (ВАЖНО!!!) не кнопку сабмита формы, а просто кнопку <input type="button" value="Отправить">. Этой кнопке не надо присваивать никакого имени (не прописывайте ей атрибут name вообще - это ВАЖНО!!!).

6. "Повесьте" на эту кнопку на событие onclick вызов функции GetServer (), которая будет осуществлять связь с сервером. Вот так <input type="button" value="Отправить" onclick=="GetServer (this.form)">

7. Где-нибудь на странице (в том числе можно и между тегами <form> и </form>) создайте некое "место" для вывода сообщения сервера об успешном изменении БД (или о неудаче). Обязательно дайте этому "месту" уникальный валидный id. Кроме того, желательно дать этому "месту" изначально какие-то размеры, чтобы потом текущая страница не "прыгала", когда в этом месте появится текст. Например, так: <div id="inform" style="width: 120px; height: 40px"></div>. Разумеется, можете стилями заранее предусмотреть нужные вам параметры шрифта для этого сообщения (размер, цвет, жирность и т. д.)

Пример HTML-кода файла index.html:
<form>
<input name="inpt1"> <!-- name="name" пишут только кретины, см. примечание -->
<input name="inpt2">
<textarea name="txtr1"></textarea>
<textarea name="txtr2"></textarea>
<select name="slct1"></select>
<select name="slct2"></select>
...
<input type="button" value="Отправить" onclick=="GetServer (this.form)">
</form>
...
<div id="inform" style="width: 120px; height: 40px"></div>
...
<script>
function GetServer (x)
{
//перебираем все элементы формы
for (var rez = [], j = k = 0, elm = x.elements, ln = elm.length; j < ln; j++)
//создаём массив пар "имя=значение" для поименованных элементов формы
if (elm [j].name) rez [k+] = elm [j].name + '=' + encodeURIComponent (elm [j].value);
//кнопка "Отправить", как не имеющая атрибута NAME, в этот массив не входит

//создаём объект HttpRequest
if (navigator.appName == 'Microsoft Internet Explorer') htReq = new ActiveXObject ('Microsoft.XMLHTTP');
else htReq = new XMLHttpRequest ();

//Отсылаем данные серверу, преобразовав массив в строку, разделённую амперсандами
htReq.open ('get', 'submit.php?' + rez.join ('&'));
//Назначаем функцию AnswerServer "ответственной" за отображение ответа сервера на текущей странице
htReq.onreadystatechange = AnswerServer;
htReq.send (null);
}

//Отображаем ответ сервера в заранее подготовленное место
function AnswerServer ()
{if (htReq.readyState == 4) document.getElementById ('inform').innerHTML = htReq.responseText}
</script>
Примечание - см. http://www.softtime.ru/forum/read.php?id_forum=4&id_theme=82674, ВЫВОД в шестом сверху сообщении.

8. Файл submit.php НЕ ДОЛЖЕН иметь никаких инструкций для or die.
Файл этот должен заканчиваться заголовком и выводом результата:
header ("Content-type: text/plain; charset=utf-8");
print $result;
Переменная $result к моменту вывода должна иметь одно из всего двух возможных значений:
"База даних успішно оновлено" либо "Відбулася критична помилка"

  Ответить  
 
 автор: bibika   (14.10.2011 в 06:51)   письмо автору
 
   для: АЯС   (13.10.2011 в 23:00)
 

Спасибо за такой подробный ответ

  Ответить  
Rambler's Top100
вверх

Rambler's Top100 Яндекс.Метрика Яндекс цитирования