Изменяем вид добавления материала by webo4ka

Изменяем вид добавления материала by webo4ka

Изменяем вид добавления материала by webo4ka-взамен старой и не очень приглядной формы,предоставляется вот такая цветная и красивая формочка,которая порадует ваш глаз

Установка:

управления ---> Управление дизайном ---> Каталог файлов ---> Страница добавления/редактирования материала и перед вставляем данный код:

Код
<script type="text/javascript">  
var addEnt = '<div id="addEnt" style="display:none;"><span>Идёт добавление материала ...</span></div>';  
$('body').prepend(addEnt);  
function addEntry () {  
var form = $('#addEntForm');  
$('#addEnt').css('display', 'block');  
$.ajax({  
  type: 'POST',  
  url: form.attr('action'),  
  data: form.serialize(),  
  success: function (r) {  
if (~$(r).text().indexOf('успешно')) {$('#addEnt span').html('Материал успешно добавлен!'); $('#addEnt').removeClass( ).addClass('green');}  
else {$('#addEnt span').html($($(r).text()).text()); $('#addEnt').removeClass( ).addClass('red');}  
}  
});  
}  

function addEntry2 () {  
var form = $('#addEntForm');  
$('#addEnt').css('display', 'block');  
$.ajax({  
  type: 'POST',  
  url: form.attr('action'),  
  data: form.serialize(),  
  success: function (r) {  
if (~$(r).text().indexOf('успешно')) {$('#addEnt span').html('Материал успешно изменен!'); $('#addEnt').removeClass( ).addClass('green');}  
else {$('#addEnt span').html($($(r).text()).text()); $('#addEnt').removeClass( ).addClass('red');}  
}  
});  
}  

$('input[value="Добавить"]').each(function () {if ($(this).attr('onclick') && ~$(this).attr('onclick').indexOf('doSmbBt')) $(this).attr('onclick', 'addEntry()');});  
$('input[value="Сохранить"]').each(function () {if ($(this).attr('onclick') && ~$(this).attr('onclick').indexOf('doSmbBt')) $(this).attr('onclick', 'addEntry2()');});  

$('body').append('<style>.green {background:#64992b; color:#fff; font-size:12px; text-align:center; padding:5px; position:fixed; bottom:20px; right:20px; z-index:999; -moz-border-radius:3px; border-radius:3px; -webkit-border-radius:3px;} .red {background:#e74c3c; color:#fff; font-size:12px; text-align:center; padding:5px; position:fixed; bottom:20px; right:20px; z-index:999; -moz-border-radius:3px; border-radius:3px; -webkit-border-radius:3px;}</style>'); /* by webo4ka.ru*/  
</script>


Настройки:
bottom:20px; right:20px; - данный код отвечает за вывод уведомления, а именно в правом нижнем углу, если вам необходимо, пишите другой вариант который вам необходим...
bottom:20px; - низ
top:20px; - верх
right:20px; - право
left:20px; - лево
p.s. Если будете менять расположение, не забудьте, что менять bottom:20px; right:20px; два раза в коде...
Изменяем вид добавления материала by webo4ka
Файлы для скачивания отсутствуют.
Поблагодарить автора Автор: Turbo
Комментарии (0)
Добавить комментарий
class="add-comm-form clearfix add-shadow2" id="add-comm-form">
avatar