|
Обратная связь в аякс. Автозаполнение полей скриптом. Script
|
|
| [1] likbezz [29.04.2012, 03:14] |
Спрашивает: Евгеша
Quote (Евгеша) подскажите! как сделать чтоб в почтовой форме в одной из строк автоматом вписывалась тема(например название товара) |
|
| [2] likbezz [29.04.2012, 06:18] |
Создаём форму, если нет, как обычно: ПУ » Почтовые формы » Управление почтовыми формами
Задаём поля и всё прочее.
По данной теме нас интересует атрибут «name» тех полей куда будет подставлять данные.
Для это, после того как сформировали форму, открываем шаблон и смотрим какие имена имеют нужные нам поля.
Например:
Quote (Code) <table border="0" width="100%" id="table3" cellspacing="1" cellpadding="2">
<tr><td width="35%">E-mail отправителя <font color="red">*</font>:</td><td><input type="text" name="f1" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Адрес страницы:</td><td><input type="text" name="f3" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Название страницы:</td><td><input type="text" name="f4" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Тема письма:</td><td><input type="text" name="f2" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td colspan="2" align="center"><br /><input type="submit" value="Отправить сообщение"></td></tr>
</table>
В данном шаблоне:
За название страницы - название товара или заголовок, отвечает поле f4.
За адрес поле f3.
Нашли и запомнили, лучше записали.
...
Для того что бы это всё работало, данная форма должна где нибудь быть.
У меня, например, она находится на странице обратной связи.
То бишь, если у вас созданная форма еще не размещена, создаём страницу, как обычно, через ПУ » Редактор страниц » Создать страницу, и в фору добавления вставляем следующий код:
Code <div id="msgForm3"> <p>С помощью формы обратной связи вы можете связаться с администратором сайта.</p> <br>$MFORM_3$ </div>
Где:
<div id="msgForm3"> - порядковый номер блока с вашей формой, обычно равен номеру кода вставки формы.
$MFORM_3$ - код вставки формы.
...
На этом с шаблоном формы закончили.
Далее, в шаблоне товара, или в любом другом шаблоне, или на странице, добавляем следующий скрипт:
Code <script type="text/javascript"> function mSensForm(el){ var fid=(el.rel)?el.rel:'msgForm',ftitle=(el.title)?el.title:'Обратная связь'; new _uWnd('myForm',ftitle,430,345,{align:'left',fadeclosetype:0,min:0,max:0,shadow:1,resize:0,oncontent:function(){ $.get(el.href,{},function(data){ $('#myForm').html($('#'+fid,data).html()); if(window.setTitleUrl){setTitleUrl('myForm');}; }); }},'<div id="myForm" style="width:405px;height:320px;"><img src="/_theme/_st/img/ico/ajax.gif" /></div>'); }; function setTitleUrl(cId){ if(!cId)return; $('#'+cId+' input[name="f3"]').val(window.location.href.split('?')[0].split('#')[0]); $('#'+cId+' input[name="f4"]').val(document.title); }; </script>
Или:
Code <script type="text/javascript" src="http://likbezz.ru/_source/_js/ext/mSensForm.js"></script>
<script type="text/javascript">
function setTitleUrl(cId){
if(!cId)return;
$('#'+cId+' input[name="f3"]').val(window.location.href.split('?')[0].split('#')[0]);
$('#'+cId+' input[name="f4"]').val(document.title);
};
</script>
Где:
Внимание важно
$('#'+cId+' input[name="f3"]') - ваше имя поля адреса, в данном случае «f3»
$('#'+cId+' input[name="f4"]') - ваше имя поля названия страницы, в данном случае «f4»
...
Если, данный скрипт используется часто или на многих страницах, и форма одна и та же - то бишь поля не меняются, лучше его поместить в отдельный файл и вставлять просто ссылкой:
Code <script type="text/javascript" src="http://likbezz.ru/_source/_js/ext/mSensForm_f3.js"></script>
Можете скачать, отредактировать имена полей - они должны соответствовать вашим, и пользовать )
...
Ссылка на открытие окна вставляется как обычно, по месту, в виде ссылки:
Code <p><a rel="msgForm3" title="Написать администратору" href="/index/0-3" onclick="mSensForm(this,1);return false;"><b>Написать администратору</b></a></p>
Или кнопки:
Code <p><a rel="msgForm3" title="Отправить сообщение" href="/index/0-3" onclick="mSensForm(this,1);return false;"><b><input value="Отправить сообщение" type="button" /></b></a></p>
Или картинки
Code <p><a rel="msgForm3" title="Заказать товар по почте" href="/index/0-3" onclick="mSensForm(this,1);return false;"><img src="/_example/_img/_button/but_1.png" width="161" height="23" alt="" /></a></p>
Где:
Внимание, важно
rel="msgForm3" - ID блока с формой, который вы вставляли в форму добавления на странице обратной связи.
onclick="mSensForm(this,1); - если ставите единицу, то будет выполняться функция заполнения.
onclick="mSensForm(this,0); - если ставите ноль, то не будет.
onclick="mSensForm(this); - если ничего не ставите, тоже не будет.
..
☑ Пример всего это. Вариант №1
☑ Пример всего это. Вариант №2
....
|
|
| [3] Solyt [14.05.2012, 22:38] |
|
спасибо разобрался... а почему уменя вместо названия (адреса квартиры выводит нечто другое? (предложена квартира) хотя в названии стоит адрес. |
|
| [4] likbezz [14.05.2012, 22:53] |
Solyt, Quote (Solyt) а почему уменя вместо названия (адреса квартиры выводит нечто другое? (предложена квартира) хотя в названии стоит адрес.
В названии стоит то, что прописано в теге title страницы.
... |
|
| [5] bolgarka [17.11.2012, 03:36] |
Все сделала так же, форма появляется, но при отправке запроса выкидывает на главную страницу сайта и сообщение не приходит на почту  |
|
| [6] likbezz [09.12.2012, 06:25] |
bolgarka, Все сделала так же, форма появляется, но при отправке запроса выкидывает на главную страницу сайта и сообщение не приходит на почту sad
Значит, все же вы что-то не так сделали ..
Адрес страницы с формой поможет мне узнать что именно вы сделали не так.. |
|
| [7] bolgarka [11.12.2012, 16:59] |
Значит, все же вы что-то не так сделали ..
Адрес страницы с формой поможет мне узнать что именно вы сделали не так..
Да, пожалуйста:
страница с запросом:
http://www.bulgaria.seainvest.ru/index/zolotye_peski_var_zp020/0-861
и страница с формой:
http://www.bulgaria.seainvest.ru/index/obratnaja_svjaz/0-1052
Заранее благодарю за помощь. Хотя, это не совсем то, что мне нужно. Мне бы хотелось, чтобы форма была не в отдельном окне, а прямо на странице каждой. Возможно так? |
|
| [8] likbezz [11.12.2012, 18:17] |
bolgarka, Да, пожалуйста:
страница с запросом:
Странно:
и чуть побольше сделайте окно (поправьте размеры в скрипте) а то полосы прокрутки появляются в аякс-окошке. не красиво ...
Вот эти циферки:
Quote (Code) new _uWnd('myForm',ftitle,430,345,{align:'left ...
сделайте, например, вот такими:
Quote (Code) new _uWnd('myForm',ftitle,450,350,{align:'left ...
.. или чуть больше.. можно методом тыка )
...
А.. она у вас вообще не работает.. странно.
Чуть позже гляну подробнее.
|
|
| [9] likbezz [11.12.2012, 18:29] |
Хотя, это не совсем то, что мне нужно. Мне бы хотелось, чтобы форма была не в отдельном окне, а прямо на странице каждой. Возможно так?
Да, возможно:
ПУ » Главная » Почтовые формы » Получить код - там список ваших форм. копируете код нужной (типа $MFORM_3$) и вставляете в шаблон (), туда, где требуется вывести форму)
Можно через условие.
..
|
|
| [10] bolgarka [11.12.2012, 22:40] |
Да, возможно:
ПУ » Главная » Почтовые формы » Получить код - там список ваших форм. копируете код нужной (типа $MFORM_3$) и вставляете в шаблон (), туда, где требуется вывести форму)
Хм... сделала, но тогда в ней не присутствует ссылка и название страницы |
|
| [11] likbezz [11.12.2012, 22:53] |
bolgarka, Хм... сделала, но тогда в ней не присутствует ссылка и название страницы
Логично )
Скрипт привязать теперь нужно к форме. Можно прямо в шаблоне самой формы, сразу после формы.
Code <script type="text/javascript">
function setTitleUrl(cId){
if(!cId)return;
$('#'+cId+' input[name="f3"]').val(window.location.href.split('?')[0].split('#')[0]);
$('#'+cId+' input[name="f4"]').val(document.title);
};mSensForm('msgForm3',1);
</script>
Даже вот так проще:
Code <script type="text/javascript">
$(document).ready(function(){
$('#msgForm3 input[name="f3"]').val(window.location.href.split('?')[0].split('#')[0]);
$('#msgForm3 input[name="f4"]').val(document.title);
});
</script>
Остальное - как обычно.. |
|
| [12] bolgarka [11.12.2012, 23:21] |
Вот так? Ничего не вышло 
<table border="0" width="100%" id="table1" cellspacing="1" cellpadding="2">
<tr><td width="35%">E-mail отправителя <font color="red">*</font>:</td><td><input type="text" name="f1" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Адрес страницы:</td><td><input type="text" name="f3" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Название страницы:</td><td><input type="text" name="f4" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Текст сообщения:</td><td><input type="text" name="f2" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Бюджет покупки, Евро:</td><td><input type="text" name="f4" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Ваш телефон с кодом города <font color="red">*</font>:</td><td><input type="text" name="f5" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td colspan="2" align="center"><br /><input type="submit" value="Отправить сообщение"></td></tr>
</table>
<script type="text/javascript">
function setTitleUrl(cId){
if(!cId)return;
$('#'+cId+' input[name="f3"]').val(window.location.href.split('?')[0].split('#')[0]);
$('#'+cId+' input[name="f4"]').val(document.title);
};mSensForm('msgForm3',1);
</script>Добавлено (11.12.2012, 23:21)
---------------------------------------------
А вот это я прописала в дизайне страниц:
<script type="text/javascript">
function mSensForm(el){
var fid=(el.rel)?el.rel:'msgForm',ftitle=(el.title)?el.title:'Обратная связь';
new _uWnd('myForm',ftitle,500,400,{align:'left',fadeclosetype:0,min:0,max:0,shadow:1,resize:0,oncontent:function(){
$.get(el.href,{},function(data){
$('#myForm').html($('#'+fid,data).html());
if(window.setTitleUrl){setTitleUrl('myForm');};
});
}},'<div id="myForm" style="width:450px;height:280px;"><img src="/_theme/_st/img/ico/ajax.gif" /></div>');
};
function setTitleUrl(cId){
if(!cId)return;
$('#'+cId+' input[name="f3"]').val(window.location.href.split('?')[0].split('#')[0]);
$('#'+cId+' input[name="f4"]').val(document.title);
};
</script> |
|
| [13] likbezz [12.12.2012, 00:11] |
bolgarka,
Нет..
Вы же хотели саму форму вынести на страницу.
Мне бы хотелось, чтобы форма была не в отдельном окне, а прямо на странице каждой. Возможно так?
Следовательно предыдущий скрипт убираем из шаблона, а вместо ссылки вставляем код формы - $MFORM_1$.
Правильный код вашего шаблона формы:
Code <table border="0" width="100%" id="table1" cellspacing="1" cellpadding="2">
<tr><td width="35%">E-mail отправителя <font color="red">*</font>:</td><td><input type="text" name="f1" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Адрес страницы:</td><td><input type="text" name="f3" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Название страницы:</td><td><input type="text" name="f4" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Текст сообщения:</td><td><input type="text" name="f2" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Бюджет покупки, Евро:</td><td><input type="text" name="f4" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Ваш телефон с кодом города <font color="red">*</font>:</td><td><input type="text" name="f5" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td colspan="2" align="center"><br /><input type="submit" value="Отправить сообщение"></td></tr>
</table> <script type="text/javascript">
$(document).ready(function(){
$('#table1 input[name="f3"]').val(window.location.href.split('?')[0].split('#')[0]);
$('#table1 input[name="f4"]').val(document.title);
});
</script>
... |
|
| [14] bolgarka [12.12.2012, 00:42] |
Урраааааааа! Спасибо Вам! Заработало!!! Вы просто умничка!!!
С наступающим Вас!  Добавлено (12.12.2012, 00:42)
---------------------------------------------
Так как подозреваю, что вы волшебник, хочу на всякий случай задать еще один вопросик. Может существует какой-нибудь прием, который позволит визуально скрыть в форме строчки с названием страницы и ссылкой, но при этом приходить на почту они мне будут?  Прошу прощения за наглость ))) |
|
| [15] likbezz [12.12.2012, 01:16] |
bolgarka,
Спаибочки ) и вас тоже с наступающим )
Может существует какой-нибудь прием, который позволит визуально скрыть в форме строчки с названием страницы и ссылкой, но при этом приходить на почту они мне будут?
Можно)
Вот код шаблона:
Code <table border="0" width="100%" id="table1" cellspacing="1" cellpadding="2">
<tr><td width="35%">E-mail отправителя <font color="red">*</font>:</td><td><input type="text" name="f1" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Текст сообщения:</td><td><input type="text" name="f2" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Бюджет покупки, Евро:</td><td><input type="text" name="f4" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Ваш телефон с кодом города <font color="red">*</font>:</td><td><input type="text" name="f5" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td colspan="2" align="center"><br /><input type="submit" value="Отправить сообщение">
<input type="hidden" name="f3"><input type="hidden" name="f4"></td></tr>
</table>
<script type="text/javascript">
$(document).ready(function(){
$('#table1 input[name="f3"]').val(window.location.href.split('?')[0].split('#')[0]);
$('#table1 input[name="f4"]').val(document.title);
});
</script>
- должен работать, не проверял ) отпишитесь если все Ok
Добавлено (12.12.2012, 01:56:21)
---------------------------------------------
А что это вы под текст так мало места дали?
Вот так будет в три строки:
Code <table border="0" width="100%" id="table1" cellspacing="1" cellpadding="2">
<tr><td width="35%">E-mail отправителя <font color="red">*</font>:</td><td><input type="text" name="f1" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Текст сообщения:</td><td><textarea style="width: 95%; overflow:auto;" cols="30" name="f2" rows="3"></textarea> </td></tr>
<tr><td>Бюджет покупки, Евро:</td><td><input type="text" name="f4" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td>Ваш телефон с кодом города <font color="red">*</font>:</td><td><input type="text" name="f5" size="30" style="width:95%;" maxlength="70"> </td></tr>
<tr><td colspan="2" align="center"><br /><input type="submit" value="Отправить сообщение">
<input type="hidden" name="f3"><input type="hidden" name="f4"></td></tr>
</table> <script type="text/javascript">
$(document).ready(function(){
$('#table1 input[name="f3"]').val(window.location.href.split('?')[0].split('#')[0]);
$('#table1 input[name="f4"]').val(document.title);
});
</script>
- типа чуть побольше, в три раза в высоту поля.
Где:
Quote (Code) <textarea style="width: 95%; overflow:auto;" cols="30" name="f2" rows="3"></textarea>
кол-во строк. В данном случае, три.
|
|
