|
|
|
| Добрый вечер!
Сейчас делаю простейший мини-чат!
диалоговое окно подгружено через IFRAME!
как сделать перезагрузку этого плав. фрейма, но чтобы родительское окно не перезагружалось, и полоса загрузки не отображалась в браузере(когда плав. фрейм перезагружается!
вот я сделал, так
<html>
<head>
<title>мини-чат</title>
<meta http-equiv="refresh" content="0">
<link href="../../css/minichat.css" rel="stylesheet" type="text/css">
</head>
<body bgcolor="#7f0004">
<?php
запрос
?>
</body>
</html>
|
здесь самое простое что пришло мне в голову! рефреш страницы с перерывом 0сек(бесконечно короче!)
но в браузере всё равно отображается строка загрузки...
с помощью какой подстройки или может скрипта авто-обновления достичь "невидимой" перезагрузки? | |
|
|
|
|
|
|
|
для: frisst
(06.11.2009 в 23:55)
| | Лучше iframe.location.src.replace(URL), в истории браузера не остается следа, а вот прогресс не убрать. | |
|
|
|
|
|
|
|
для: sim5
(07.11.2009 в 06:29)
| | Спасибо... Но разрешите спросить, данную конструкцию в мета тэги нужно подставлять? | |
|
|
|
|
|
|
|
для: frisst
(07.11.2009 в 10:11)
| | Мне так думается, лучше из скрипта, чтобы не случилось перезагрузки во время приема данных с сервера. | |
|
|
|
|
|
|
|
для: sim5
(07.11.2009 в 10:33)
| | Не до конца вас понял!(
вот все файлы мини-чата... подскажите пожалуйста, куда и как подставить этот элемент...
состоит чат из двух плав. фреймов!
вот главная страница:
<html>
<head>
<title>мини-чат</title>
"путь к стилям"
</head>
<body>
<div id="mcc">
<div id="fix"><iframe src="mini_chat/mclist.php" height="200px" width="188px" vspace="0" hspace="0" frameborder="0">Ваш браузер не поддерживает IFRAIM</iframe></div>
<div><iframe src="mini_chat/dobnews_.php" height="128px" width="188px" vspace="0" hspace="0" frameborder="0">Ваш браузер не поддерживает IFRAIM</iframe></div>
</div>
</body>
</html>
|
это mclist.php:
<html>
<head>
<title></title>
<meta http-equiv="refresh" content="1">
<link href="../../css/minichat.css" rel="stylesheet" type="text/css">
</head>
<body bgcolor="#7f0004">
<?php
include("connect.php");
$query="SELECT id,data,time,name,sms,tip_chat FROM sms_chat ORDER BY `id` DESC limit 5";
$result=mysql_query($query)or die("Запрос не выполнен");
if (mysql_num_rows($result)>0){
while ($row = mysql_fetch_assoc($result)){
$sqlid=$row["id"];
$sqldata=$row["data"];
$sqltime=$row["time"];
$sqlname=$row["name"];
$sqlsms=$row["sms"];
$sqltip_chat=$row["tip_chat"];
echo "<a href='#' title='сообщение №$sqlid' class='datamc'>$sqldata/$sqltime||ОТ:</a><a href='#' title='$sqltip_chat' class='namemc'>$sqlname</a><p class='smsmc'>$sqlsms</p><img src='../../design/red/images/smchat.png' width='160' height='1' align='center'>";}}
?>
</body>
</html>
|
это dobnews_.php:
<html>
<head>
<title></title>
</head>
<body>
<div id="fix" align="center">
<form action="dobnews.php" method="post">
<div><input name="name" id="name" value="введите имя" size="16" /></div>
<div><textarea name="sms" id="sms" cols="16">введите сообщение</textarea>
<input name="data" type="hidden" id="data" value="<?php echo date("Y-m-d") ?>">
<input name="time" type="hidden" id="time" value="<?php echo date("H:i:s") ?>">
<input name="tip_chat" type="hidden" id="tip_chat" value="Написано через мини-чат."></div>
<div><input type="submit" value="отправить" name="submit" OnClick="document.location.reload()"></div>
</form>
</div>
</body>
</html>
|
теперь серверные страницы
это dobnews.php:
<?
include_once("connect.php");
if (isset($_POST['submit']))
{
if(empty($_POST['name']))
{
echo 'Вы не ввели имя<p><FORM>
<INPUT TYPE="button" VALUE="вернуться"
onClick="history.back()">
</FORM> </p>';
}
elseif(empty($_POST['sms']))
{
echo 'Вы не ввели сообщение<p><FORM>
<INPUT TYPE="button" VALUE="вернуться"
onClick="history.back()">
</FORM> </p>';
}
else
{
$name = $_POST['name'];
$data= $_POST['data'];
$time= $_POST['time'];
$sms= $_POST['sms'];
$tip_chat= $_POST['tip_chat'];
$query = "SELECT `id`
FROM `sms_chat`
WHERE `name`='{$name}' AND `sms`='{$sms}'
";
$sql = mysql_query($query) or die(mysql_error());
if (mysql_num_rows($sql) > 0)
{
echo 'ВЫ УЖЕ ДОБАВИЛИ ЭТО СООБЩЕНИЕ!!! <p>
<FORM>
<INPUT TYPE="button" VALUE="написать ещё"
onClick="history.back()">
</FORM>
</p>';
}
else
{
$query = "INSERT INTO sms_chat(name , data , time , sms , tip_chat)
VALUES ('$name', '$data', '$time', '$sms', '$tip_chat')";
$result = mysql_query($query) or die(mysql_error());;
echo '<html><head><title></title><meta http-equiv="refresh" content="3;URL=dobnews_.php"></head><body>Сообщение отправлено! <p><FORM>
<INPUT TYPE="button" VALUE="вернуться назад"
onClick="history.back()">
</FORM></p></body></html>';
}
}
}
?>
|
ну а это connect.php:
<?php
$dblocation = "localhost";
$dbname = "имя БД";
$dbuser = "имя пользователя";
$dbpasswd = "пароль";
$dbcnx = @mysql_connect($dblocation,$dbuser,$dbpasswd);
if (!$dbcnx)
{
echo( "<P>В настоящий момент сервер базы данных не доступен, поэтому корректное отображение страницы невозможно.</P>" );
exit();
}
if (!@mysql_select_db($dbname, $dbcnx))
{
echo( "<P>В настоящий момент база данных не доступна, поэтому корректное отображение страницы невозможно.</P>" );
exit();
}
?>
|
и куда мне нужно подставить конструкцию?
помогите пожалуйста... | |
|
|
|
|
|
|
|
для: frisst
(07.11.2009 в 12:35)
| | Так у вас два фрейма, один на прием, другой для передачу данных. Обновлять нужно первый, но запрос им сервера не должен мешать ответу второму фрейму. А почему не использовать один фрейм? | |
|
|
|
|
|
|
|
для: sim5
(07.11.2009 в 15:33)
| | Я сперва хотел в одном использовать, но при 3-5 сообщениях форма ввода опускается вниз... | |
|
|
|
|
|
|
|
для: frisst
(07.11.2009 в 15:38)
| | А вы используйте фрейм как контейнер, с нулевыми размерами, содержимое которого при загрузке перезаписывайте в DIV, который находится в родительском окне как и сам фрейм. Во-первых для этого DIV будут доступны стили родительского окна, что облегчит оформление. Во-вторых он будет содержать только ответы, так как сама форма как элемент будет отдельна от сообщений, и добавление прокрутки DIV ни коим образом не повлияет на положение формы. В третьих, легче будет синхронизировать запросы-ответы, так как все будет управляться из родительского окна. | |
|
|
|
|
|
|
|
для: sim5
(07.11.2009 в 15:46)
| | хм... а я не знаю как это сделать( | |
|
|
|
|
 176.8 Кб |
|
|
для: frisst
(07.11.2009 в 17:32)
| | Да все просто делается. Атрибуту target фрмы указываете имя фрейма как целевого контейнера ответа сервера. По событию onload фрейма (когда он получит ответ на отправку формы), можете сразу перегрузить содержимое фрейма в DIV:
onload="window.document.getElementById('as').innerHTML= frame.document.body.innerHTML
где 'as' это id DIV в который перегружаем ответ сервера. IFARANE, DIV и форма, все они пренадлежат родительскому окну.
Но сперва надо решить, что вы отдаете клиенту - все накопившиеся сообщения для него, либо сообщения за период, а может лучше возвращать ему только последнее новое сообщение?
Синхронизация. Вы уверены, что во время ответа сервера на обновление, передача формы не прервет его, или наоборот?
По большому счету, все можно сделать на AJAX, не заморачиваясь с фреймами, и если это для вас вызывает трудности, воспользоваться jQuery, там все просто для понимания, тогда:
1. Есть постоянный ajax-запрос к серверу на получение новых сообщений. Каждое, полученное сервером, новое сообщение устанавливает метку времени, которая определяет, что сообщения равные и меньше ее по времени уже отданы клиенту и отдавать нечего. То есть клиенту будет отдаваться только новые сообщения.
2. Отправляете форум также ajax-запросом.
3. Можно пренебречь синхроницазией, полагаясь на то, что форма клиентом отправляется намного реже, чем постоянный опрос сервера. Но, если произойдет обрыв соединения, то гарантировано, что это сообщение клиент уже не увидит, так как в нашем случае оно будет уже помечено сервером как отданное, а значит старое.
4. Лучше синхронизируем запрос на обновление с отправкой формы. Будем использовать флаг. В начале работы он сброшен, и первым (по времени) начнет работу ajax-запрос на обновление, он проверяет сброшен или установлен флаг, и если сброшен, то устанавливает его, и делает запрос к серверу. Если в это время будет произведена отправка формы, то она должна проверить, установлен или сброшен флаг, если установлен, то ждем когда он будет сброшен.
При удачном приеме нового сообщения, методом jQuery создаем DIV, в который помещаем ответ, и добавляем его последним в основной DIV, который и является окном сообщений, с прокруткой, и сбрасываем флаг. Если нет новых сообщений, просто сбрасываем флаг.
Форма получила сброшенный флаг, устанавливает его (запрещая на время отправки формы запросы на обновление) и производит отправку.
Если прием прошел удачно, возвращаем время записи ответа в базу, которое помещаем вместе сохранненным временно ответом на клиенте в основной DIV, так же с помощью метода jQuery. То есть сам ответ отправляемый формой не обязательно возвращать, чтобы поместить его в окно сообщений. Его можно держать в переменной. Возврат, либо его игнорирование необходимо только при ошибках ввода.
В общем после все работ над ошибками, или при все ОК-ситуациях, после окончания передачи сообщения на сервер, форма сбрасывает флаг, разрешая обновление.
5. Процесс работы над ошибками в форме может занять время, и за это время сервер может накопить более одного нового сообощения, поэтому сообщения лучше передавать в JSON-формате. В простейшем случае это массив, но лучше возвращать массив объектов, каждый из которых будет содержать время, имя и собственно сообщение. То есть, на сервере это многомерный массив, а клиент получит его в виде объекта (после eval).
Обходим в цикле этот массив, помещая объекты его в HTML-элементы, и добавляем последними к окну сообщений.
Вот я бы так делал, если бы делал. Про работу IFRAME как ajax контейнера можете почитать тут. jQuery найдете в сети (если на нем делать), описание API jQuery в прикреплении. А это функция, которая будет преобразовывать данные на входе в JSON формат:
<?
function toJSON($var) {
switch (gettype($var)) {
case 'boolean': return $var ? 'true' : 'false';
case 'integer':
case 'double': return $var;
case 'resource':
case 'string': return '"'. str_replace(array("\r", "\n", "<", ">", "&"),
array('\r', '\n', '\x3c', '\x3e', '\x26'),
addslashes($var)) .'"';
case 'array':
if (empty ($var) || array_keys($var) === range(0, sizeof($var) - 1)) {
$output = array();
foreach ($var as $v) {
$output[] = toJSON($v);
}
return '['. implode(',',$output).']';
}
case 'object':
$output = array();
foreach ($var as $k => $v) {
$output[] = toJSON(strval($k)) .': '. toJSON($v);
}
return '{'.implode(',',$output).' }';
default: return 'null';
}
}
header('Content-Type: text/javascript; charset=/*здесь указать кодировку*/');
echo toJSON($var);
?>
|
| |
|
|
|
|
|
|
|
для: sim5
(07.11.2009 в 19:17)
| | Спасибо огромное... сейчас буду думать и пробовать... а то для меня пока сложно...)
но думаю пойму! | |
|
|
|
|