Главная » Статьи » Статьи о/про uCoz » JS и JQ скрипты для uCoz

Скрипт отправки личного сообщения в аякс (Ajax) окне. Для юКоз (uCoz)

Пишем скрипт для отправки личных сообщений

(PM, здесь и далее) с поддержкой кода безопасности, который, к сожалению, виден и зарегистрированным пользователям...

Видел очень много подобных скриптов в сети, но у них, при отправке сообщения пользователем, входящим в группу «пользователи» - выдавало ошибку - «Неправильный код безопасности» или «Доступ запрещен».
И вот, поддавшись на уговоры одного человека, написал скрипт, который выводит в аякс окно и  форму и код безопасности, если есть. Следовательно, при правильном заполнении - ошибки отсутствуют.

Сложность скрипта - средняя.

Если вы ничего не понимаете в HTML и CSS ... и немного в JavaScript - далее читать смысла не много - простейшие вещи, в этом посте, объясняться не будут.

Приступим.

Скрипт будет основан на запросе на страницу отправки ПМ, если пользователь вошёл, и передачи результатов в аякс окно ... Это, если в двух словах.

Исходные данные.
Сама форма для отправки, к которой будем обращаться (обрезанная версия):

Code
<form method="POST" name="addform" id="addform" action="http://likbezz.ucoz.ru/index/" style="margin: 0pt;" onsubmit="safe('addform');return false;">
<table border="0" cellpadding="1" cellspacing="0" width="100%">
<tbody>
<tr>
<td colspan="2"><div id="eMessage" align="center"></div></td>
</tr>
<tr>
<td width="11%">Получатель:</td>
<td><input id="PMtoUser" name="s" value="" size="30" type="text">
<span id="userDtls"></span></td>
</tr>
<tr>
<td>Тема:</td>
<td><input id="pmSubject" name="subject" value="" style="width: 100%;" maxlength="100" size="20" type="text"></td>
</tr>
<tr>
<td colspan="2"><table border="0" cellpadding="0" cellspacing="0" width="100%">
<tbody>
<tr>
<td valign="top"><textarea rows="8" id="message" name="message" cols="40" style="height: 135px; width: 100%;"></textarea></td>
</tr>
</tbody>
</table></td>
</tr>
<tr>
<td colspan="2">Код:
<input class="securityCode" id="secuCode" name="code" size="5" maxlength="4" type="text">
<input name="seckey" value="2589625112" type="hidden">
<img alt="" style="border: 0pt none ; margin: 0pt; padding: 0pt; cursor: pointer;" id="secuImg" title="Обновить код безопасности" onclick="this.src='http://likbezz.ucoz.ru/secure/?k=2589625112;s=index;tm='+Math.random();" src="http://likbezz.ucoz.ru/secure/?k=2589625112;s=index;tm=1281662189" align="absmiddle"></td>
</tr>
<tr>
<td colspan="2" align="center"><input value="Просмотреть" style="width: 110px;" onclick="prepost();" type="button">
<input style="font-weight: bold; width: 130px;" id="sbm" value="Отправить" type="submit">
<input value="Отменить" style="width: 110px;" onclick="document.getElementById('eMessage').innerHTML='';document.getElementById('sbm').disabled=false;" type="reset"></td>
</tr>
</tbody>
</table>
<input name="a" value="18" type="hidden">
</form>

Сама ссылка, у меня, будет выглядеть вот так, вы же можете оформить как вам нужно.

Code
[<a class="getSend" title="Help" href="/index/14-0-0-1" onclick="mySensForm(this);return false;"><b>Битая ссылка</b></a>]

Еще раз, обрисуем задачу.

Если пользователь не вошёл, то есть «Гость» и/или  он в группе «Заблокированные» - вывести ему сообщение о невозможности данного действия, а если вошёл - открыть аякс (uWnd) окно, и загрузить в него все необходимые элементы для отправки сообщения ... по тому или иному поводу. При успешной отправки сообщения - оповестить юзера об этом, и закрыть окно с формой. Вроде всё. ヅ

Должно получится что-то вроде этого ....ヅ

Окно, для «проверенных» пользователей и прочих...

Окно, для «просто» пользователей

Окно, для «Гостей» и/или входящих в группу «Заблокированные»


Здесь буду рассматривать стандартное сообщение на ПМ о «битой» ссылке.

Все стили применяемые к самой форме - подстраиваются индивидуально - текущие - под мои стили.

Данные о «Имени отправителя», «Теме сообщения», и принадлежности пользователя к той или иной группе - буду определять прямо из запроса, то есть при клике - вызове функции.

Для этого немного изменю саму ссылку до вот такого вида:

Code
[<a class="getSend" title="Битая ссылка, Сообщение от юзера «$USERNAME$» ($USER_GROUP$)" href="/index/14-0-0-1" onclick="mySensForm(this);return false;"><b>Битая ссылка</b></a>]

Где:
class="getSend" - просто класс - отвечает за внешний вид и оформление ссылки.
title="Битая ссылка, Сообщение от юзера «$USERNAME$» ($USER_GROUP$)" - Отсюда буду брать тему сообщения и фильтровать пользователей от гостей и забаненных.
href="/index/14-0-0-1" - ссылка на страницу ПМ, сработает, при отключённом JS, участвует в функции.
onclick="mySensForm(this); - действие при клике, с передачей параметров в функцию.
return false; - отмена действия по умолчанию (перехода по ссылке)
<b>Битая ссылка</b> ヅ .... То, что отображается на странице ..... ヅ


Пишем функцию.

Code
function mySensForm(el){
var usr='Likbezz',tem=el.title||'Ваша тема';
if(/гость|заблокированные/i.test(tem.toLowerCase())){
var mess='Вы входите в группу пользователей, которым запрещено совершать данное действие.<br>По всем вопросам обращайтесь к <a href="/index/0-3">администратору</a> сайта.<br>Гостям запрещено просматривать данную страницу,<br> пожалуйста <a href="javascript://" rel="nofollow" onclick="new _uWnd(\'LF\',\' \',-250,-110,{autosize:0,closeonesc:1,resize:1},{url:\'/index/40\'});_uWnd.close(\'Attn\');return false;" title="Вход">войдите</a> на сайт как пользователь или <a href="/index/3">зарегистрируйтесь</a>.';
new _uWnd('Attn','Данное действие запрещено',400,110,{shadow:1,autosize:0,modal:1,close:1},mess);
}else{
var mess='Добрый!\nВот в [url='+document.location.href+']этом посте[/url] битая ссылка.\nПрошу перезалить, плизз ヅ\n\nСпасибки ...';
var cont='Здесь сама форма';
new _uWnd('myForm','Обратная связь',440,320,{align:'left',fadeclosetype:1,min:1,shadow:1,header:1,max:1,resize:0, oncontent:function(){
$.get(el.href,{},function(data){/*Здесь функция*/});}},cont);
};
function safe(f){
$('#eMessage').html('<span style="color:#8B8B8B;">Идет передача данных...</span>');
_uPostForm('addform',{type:'POST',url:'/index/'});
};
function new_message(t){
_uWnd.alert('Сообщение успешно отправлено','Битая ссылка',{w:200,h:95,tm:6000}); _uWnd.close('myForm');
};

Где:
function mySensForm(el) - Сама функция отправки, одноимённая на одной странице.

var usr='Likbezz' - Кому слать.

tem=el.title||'Ваша тема'; - Тема сообщениия или «'Ваша тема'», если title пустой/нет вообще.

if(/гость|заблокированные/i.test(tem.toLowerCase())) - отсеиваем «Гостей» и «Забаненных», (!!!) при наличии «title» и «$USERNAME$» и ($USER_GROUP$)

var mess='Вы входите в группу... - сообщение для гостей и забаненных.

var mess='Добрый!\nВот в... - сообщение для остальных ....

var cont='Здесь сама форма'; - форма. Делать будем ниже.

new _uWnd('myForm','Обратная связь',440,320 - юВинд (uWnd) окно для формы, с присущими ему атрибутами.

oncontent:function(){/*Здесь функция*/} - Функция, выполняющаяся после добавления контента в окно.

function safe(f) - юкозовская функция отправки.

function new_message(t) - функция, оповещающая отправителя о успешном завершении и закрывающее окно с формой.


Пока всё.


Верстаем форму.


У меня получилось вот так:

Code
<div id="myForm" style="width:400px;height:260px;margin:0 auto;">
<form method="POST" name="addform" id="addform" action="/index/" style="margin: 0pt;" onsubmit="safe(\'addform\');return false;">
<fieldset>
<legend id="eMessage"><b>Написать администратору</b></legend>
<label for="PMtoUser"><b>Получатель:</b></label>
<input id="PMtoUser" name="s" value="" size="30" style="width:250px;" type="text" />
<br clear="all" />
<label for="pmSubject"><b>Тема сообщения:</b></label>
<input id="pmSubject" name="subject" value="" style="width:250px;" type="text" />
</fieldset>
<fieldset id="mF1">
<legend><b>Текст сообщения:</b></legend>
<textarea rows="5" id="message" name="message" cols="40" style="height:125px;width:380px;"></textarea>
</fieldset>
<fieldset style="">
<table border="0" cellpadding="2" cellspacing="1" width="100%">
<tr>
<td>Код: </td>
<td id="mC1">&nbsp;</td>
<td id="mS1"></td>
<td id="mSb"></td>
</tr>
</table>
<input name="a" value="18" type="hidden">
</fieldset>
</form>

И стили к ней:

Code
/* StartStyle */
#myForm legend{display:block;clear:both;}
#myForm label{display:block;float:left;line-height:14px;}
#myForm input{float:right;display:block;}
#myForm,#myForm fieldset{overflow:hidden;}
#eMessage hr{display:none;}
/* EndStyle */

ID, в форме, нам понадобятся для вставки в неё кода безопасности ...


Функция запроса и вставки


Code
$.get(el.href,{},function(data){
$('#sbm',data).appendTo('#mSb');
$('#secuCode',data).appendTo('#mC1');
$('input[name="seckey"],input[name="ssid"]',data).appendTo('#mS1');
$('#secuImg',data).appendTo('#mS1');
});
$('#PMtoUser').val(usr);
$('#pmSubject').val(tem);
$('#message').val(mess);

Где:

$.get(el.href,{},function(data) - запрос на страницу ПМ.

$('#sbm',data).appendTo('#mSb');,
$('#secuCode',data).appendTo('#mC1');,
$('input[name="seckey"],input[name="ssid"]',data).appendTo('#mS1');,
$('#secuImg',data).appendTo('#mS1'); - фильтруем и распихиваем ответ по нужным ячейкам нашей формы.

$('#PMtoUser').val(usr);,
$('#pmSubject').val(tem);,
$('#message').val(mess); - распихиваем наш контент ... тоже по нужным блокам. Исходя от ID элементов.


Собираем всё вместе


Code

function mySensForm(el){
/*Start(mySensForm)*/
var usr='Likbezz',tem=el.title||'Ваша тема';
if(/гость|заблокированные/i.test(tem.toLowerCase())){
/*Start(if)*/
var mess='Вы входите в группу пользователей, которым запрещено совершать данное действие.<br>По всем вопросам обращайтесь к <a href="/index/0-3">администратору</a> сайта.<br>Гостям запрещено просматривать данную страницу,<br> пожалуйста <a href="javascript://" rel="nofollow" onclick="new _uWnd(\'LF\',\' \',-250,-110,{autosize:0,closeonesc:1,resize:1},{url:\'/index/40\'});_uWnd.close(\'Attn\');return false;" title="Вход">войдите</a> на сайт как пользователь или <a href="/index/3">зарегистрируйтесь</a>.';
new _uWnd('Attn','Данное действие запрещено',400,110,{shadow:1,autosize:0,modal:1,close:1},mess);
}else{
var mess='Добрый!\nВот в [url='+document.location.href+']этом посте[/url] битая ссылка.\nПрошу перезалить, плизз ヅ\n\nСпасибки ...';
var cont='<style type="text/css"> #myForm legend{display:block;clear:both;} #myForm label{display:block;float:left;line-height:14px;} #myForm input{float:right;display:block;} #myForm,#myForm fieldset{overflow:hidden;} #eMessage hr{line-height:1px;display:none;}</style> <div id="myForm" style="width:400px;height:260px;margin:0 auto;"> <form method="POST" name="addform" id="addform" action="/index/" style="margin: 0pt;" onsubmit="safe(\'addform\');return false;"><fieldset><legend id="eMessage"><b>Написать администратору</b></legend><label for="PMtoUser"><b>Получатель:</b></label><input id="PMtoUser" name="s" value="" size="30" style="width:250px;" type="text" /><br clear="all" /><label for="pmSubject"><b>Тема сообщения:</b></label><input id="pmSubject" name="subject" value="" style="width:250px;" type="text" /></fieldset><fieldset id="mF1"><legend><b>Текст сообщения:</b></legend><textarea rows="5" id="message" name="message" cols="40" style="height:125px;width:380px;"></textarea></fieldset><fieldset style=""><table border="0" cellpadding="2" cellspacing="1" width="100%"><tr><td>Код: </td><td id="mC1">&nbsp;</td><td id="mS1"></td><td id="mSb"></td></tr></table><input name="a" value="18" type="hidden"></fieldset></form></div>';
new _uWnd('myForm','Обратная связь',440,320,{align:'left',fadeclosetype:1,min:1,shadow:1,header:1,max:1,resize:0, oncontent:function(){$.get(el.href,{},function(data){ $('#sbm',data).appendTo('#mSb'); $('#secuCode',data).appendTo('#mC1'); $('input[name="seckey"],input[name="ssid"]',data).appendTo('#mS1'); $('#secuImg',data).appendTo('#mS1');}); $('#PMtoUser').val(usr); $('#pmSubject').val(tem); $('#message').val(mess);}},cont);
};
/*End(if)*/
};
/*End(mySensForm)*/

/*Start(safe)*/
function safe(f){
$('#eMessage').html('<span style="color:#8B8B8B;">Идет передача данных...</span>');
_uPostForm('addform',{type:'POST',url:'/index/'});
};
/*End(safe)*/

/*Start(new_message)*/
function new_message(t){
_uWnd.alert('Сообщение успешно отправлено','Битая ссылка',{w:200,h:95,tm:6000});_uWnd.close('myForm');
};
/*End(new_message)*/


Рабочую версию, в живую, наблюдаем вот тут ..... ヅ  ... Или прямо тут ... [Битая ссылка]

Принятый пост выглядит вот так (оформлять можете, как душа пожелает ... ヅ ):


P.S.

Стили для ИЕ, несомненно требуют доработки,
но данный пост я писал не по теме оформления импутов для MSIE...
и заморачиваться особо не стал. ヅ

Всем удачи... ヅ
Flesh.

Автор: Likbezz a.k.a Flesh




Источник: Скрипт отправи личного сообщения в Аякс (Ajax) окне. Для юКоз (uCoz), Сообщение о битой ссылке,Likbezz a.k.a Flesh
Категория: JS и JQ скрипты для uCoz | Добавил: likbezz (13.08.2010)
Просмотров: 15873 | Комментарии: 7 | Теги: сообщений, юкоз, окне, PM, доступ, AJAX, личных, uWnd, UCOZ, Аякс
Всего комментариев: 7
0  
6  multik_ucoz_ua [Материал[02.10.2012]

Quote (likbezz)
Quote (multik_ucoz_ua)
Помогите мне пожалуйста, подскажите в чем проблема.

В том что вы отправляете самому себе) Написано же - на скриншоте с ошибкой )
Измените переменную:
Code
var usr='admin'

на
Code
var usr='Admin'

- на провернуть она регистрозависимая, но все равно отправляет на «admin» )


Вы меня не поняли. Раньше подобные ошибки показывались в форме с сообщением


а теперь выбрасывает на новую страницу вот такого вида
.
И при неправильной авторизации такая же фигня только вместо "Вы не можете отправлять сообщение самому себе" выдаёт что то типа "Не правильный логин или пароль"

0  
7  likbezz [Материал[02.10.2012]

Quote (multik_ucoz_ua)
И при неправильной авторизации такая же фигня только вместо "Вы не можете отправлять сообщение самому себе" выдаёт что то типа "Не правильный логин или пароль"

Это косяк юкозовского uwnd.js, наблюдается не во всех браузерах, и в зависимости от установленных дополнений.

0  
5  multik_ucoz_ua [Материал[29.09.2012]

Не могу понять!! Сначала скрипт работал отлично но потом (наверное я что то удалил) стал работать неправильно. Стал выбрасывать на страницу такого вида . Помогите мне пожалуйста, подскажите в чем проблема.

Code
<!-- ------------ Проблемма с выдео ------------------------- -->
  <noindex>
  <script>  
  function mySensForm(el){
/*Start(mySensForm)*/
var usr='admin',tem=el.title||'Ваша тема';
if(/гость|заблокированные/i.test(tem.toLowerCase())){
/*Start(if)*/
  
var mess='Гостям запрещено пользоваться данной услугой,<br> пожалуйста <a href="javascript://" rel="nofollow" onclick="new _uWnd(\'LF\',\' \',-250,-110,{autosize:0,closeonesc:1,resize:1},{url:\'/index/40\'});_uWnd.close(\'Attn\');return false;" title="Вход">войдите</a> на сайт как пользователь или <a href="/index/3">зарегистрируйтесь</a>.<br>По всем вопросам обращайтесь к <a href="/index/0-3">администратору</a> сайта.';
new _uWnd('Attn','Данное действие запрещено',400,110,{shadow:1,autosize:0,modal:1,close:1},mess);
}else{
var mess='[url='+document.location.href+']$ENTRY_TITLE$[/url] проблеммы с видео';
  var cont='<style type="text/css"> #myForm legend{display:block;clear:both;} #myForm label{display:block;float:left;line-height:14px;} #myForm input{float:right;display:block;} #myForm,#myForm fieldset{overflow:hidden;} #eMessage hr{line-height:1px;display:none;}</style> <div id="myForm" style="width:400px;height:100px;margin:0 auto;"> <form method="POST" name="addform" id="addform" action="/index/" style="margin: 0pt;" onsubmit="safe(\'addform\');return false;"><fieldset><legend id="eMessage"><b>Сообщить администратору</b></legend><label for="PMtoUser"><div style="display:none"><b>Получатель:</b></label><input id="PMtoUser" name="s" value="" size="30" style="width:250px;" type="text" /></div><br clear="all" /><label for="pmSubject"><b>Тема сообщения:</b></label><input id="pmSubject" name="subject" value="" style="width:250px;" type="text" /></fieldset><fieldset id="mF1"><legend><div style="display:none"><b>Текст сообщения:</b></legend><textarea rows="5" id="message" name="message" cols="40" style="height:125px;width:380px;"></textarea></fieldset><fieldset style=""><table border="0" cellpadding="2" cellspacing="1" width="100%"></div><tr><td>Код: </td><td id="mC1"> </td><td id="mS1"></td><td id="mSb"></td></tr></table><input name="a" value="18" type="hidden"></fieldset></form></div>';
new _uWnd('myForm','Проблема с видео',440,320,{align:'left',fadeclosetype:1,min:1,shadow:1,header:1,max:1,resize:0, oncontent:function(){$.get(el.href,{},function(data){ $('#sbm',data).appendTo('#mSb'); $('#secuCode',data).appendTo('#mC1'); $('input[name="seckey"],input[name="ssid"]',data).appendTo('#mS1'); $('#secuImg',data).appendTo('#mS1');}); $('#PMtoUser').val(usr); $('#pmSubject').val(tem); $('#message').val(mess);}},cont);
};
/*End(if)*/
};
/*End(mySensForm)*/

/*Start(safe)*/
function safe(f){
$('#eMessage').html('<span style="color:#8B8B8B;">Идет передача данных...</span>');
_uPostForm('addform',{type:'POST',url:'/index/'});
};
/*End(safe)*/

/*Start(new_message)*/
function new_message(t){
_uWnd.alert('Мы в кратчайшие сроки исправим эту ошибку.','Спасибо за помощь!',{w:200,h:95,tm:6000});_uWnd.close('myForm');
};
/*End(new_message)*/
  </script>  
  </noindex>
  <!-- ------------ конец Проблемма с выдео ------------------------- -->

[url=http://multik.ucoz.ua/load/filmy_onlajn/fantastika/sudja_dredd_judge_dredd_1995_smotret_onlajn/19-1-0-709]Ссылка[/url] на страницу.

0  
4  Макс [Материал[29.09.2012]

Как сделать что бы "Гости" тоже могли пользоваться данной услугой ? Я убрал часть кода (там где if(/гость|заблокированные.......)) в итоге при нажатии на ссылку вылетает окно с сообщением, но кнопки "отправить" и поля для ввода "Код" нету. Подскажите мне в чем причина. Спс.

0  
2  FisherLV [Материал[11.02.2011]

Да, к сожалению - то-же самое, даже на этой странице. Вот скрин - http://www.bildites.lv/images/26767e1dv0mxud6ok90h.jpg

0  
3  likbezz [Материал[15.03.2011]

Поправил.

0  
1  Витя [Материал[07.02.2011]

Пишет истёк период сессии!

Добавлять комментарии могут только зарегистрированные пользователи.
[ Регистрация | Вход ]