Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 28.12.2013, 03:21
Интересующийся
Отправить личное сообщение для Aligatro Посмотреть профиль Найти все сообщения от Aligatro
 
Регистрация: 03.12.2013
Сообщений: 15

setTimeout в ajax
Доброго времени суток, многоуважаемые форумчане =) В общем редактируя скриптик для ajax комментирования наткнулся на проблему, не могу поставить setTimeout внутри ajax функции перед ошибкой.

function ajx_submitCommentSettings()
{
	jQuery('#commentform').live('submit', function(e){  
		e.preventDefault();  

			if(jQuery("#Processing").length == 0 )
			var $message=jQuery('<span class="errorComments" id="Processing"></span>').appendTo("#commentform");			
		 jQuery.ajax({
			 beforeSend:function(){ 
				jQuery("#Processing").html('Комментарий скоро будет добавлен. Пожалуйста подождите...').show(0).delay(3000).hide(0);
				return
			 },
			 type:'post',
			 url:jQuery(this).attr('action'),
			 data:jQuery(this).serialize(),
			 dataType:'html',
			 /*Задержка должна начинаться где то в этом месте =)*/
			 error: function (xhr) {
			 			if(jQuery("#Processing1").length == 0 )
			var $message=jQuery('<span class="errorComments" id="Processing1"></span>').appendTo("#commentform");
			 if(xhr.status==500){
				  jQuery("#Processing1").html(xhr.responseText.split('<p>')[1].split('</p>')[0]).delay(5000).hide(0); 
				 }
				 else if(xhr.status=='timeout'){ 
				  jQuery("#Processing1").html('Error:Server time out,try again!').delay(5000).hide(0); 
				 }
				 else{ 
				  jQuery("#Processing1").html('too fast error').delay(5000).hide(0); //too fast error
				 }
				
			 },
			
 		

		success:function(data){ 

				var link = document.location.href;

				jQuery.ajax({

				   type: "GET",
				   cache: false,
				   url: link, 
				   success: function(data){ 
						var oneval =jQuery(data).find('#comments');
						jQuery('#comments').html(oneval.html());						
				   }
				  }).done(function(){ 
				});

				//ajx_submitCommentSettings();
			if(jQuery("#AddComment").length == 0 )
			var $message=jQuery('<span class="errorComments" id="AddComment"></span>').appendTo("#commentform");
				jQuery("#AddComment").html('thank you'); //thank you 
				}
		});//end of ajax
		 return false;

	 });
}

Сделать это я пытался 4 разными способами. И ни один из них не сработал, то ошибка синтаксиса, хотя там ее нет. То undefined функция, хотя имена совпадали =(
В принципе мне необязательно setTimeout, мне просто нужно сделать так, что бы текст "Ваш комментарий скоро будет добавлен. Пожалуйста подождите" не перекрывался ошибкой о невозможности добавить коммент.

В общем если поможете подправить или поясните как это сделать, буду очень вам благодарен.

Кстати, меня еще интересует, можно ли в скрипт вставить стили для элементов вида <style></style>, а то не очень хочется плодить http запросы ради файла css в пару строк =)

P.s.s Если что, вот стили =)

#Processing {
position: fixed;
top: 0;
padding: 10px 50px 10px 50px;
left: 35%;
background: rgba(73, 71, 71, 0.54);
border-radius: 5px;
margin-top: 5px;
color: #fff;
font-weight: 600;}

#AddComment {
position: fixed;
top: 0;
padding: 10px 50px 10px 50px;
left: 35%;
background: rgba(80, 138, 52, 0.56);
border-radius: 5px;
margin-top: 5px;
color: #fff;
font-weight: 600;}

#Processing1 {
position: fixed;
top: 0;
padding: 10px 50px 10px 50px;
left: 35%;
background: rgba(185, 52, 52, 0.64);
border-radius: 5px;
margin-top: 5px;
color: #fff;
font-weight: 600;}

Последний раз редактировалось Aligatro, 28.12.2013 в 03:24.
Ответить с цитированием
  #2 (permalink)  
Старый 28.12.2013, 08:36
Профессор
Отправить личное сообщение для Rise Посмотреть профиль Найти все сообщения от Rise
 
Регистрация: 07.11.2013
Сообщений: 456

Вообще-то чего то ты перемудрил, вот тебе минимум:
<style>
#processComment {
	display: none;
	position: fixed;
	padding: 10px;
	background: #ccc;
	text-align: center;
}
</style>

<div id="processComment"></div>
<textarea id="textComment" name="textComment"></textarea>
<button id="addComment">Добавить</button>
<div id="allComments"></div>

<script>
$('#addComment').click(function() {  
	var process = $('#processComment');
	$.ajax({
		type: 'post',
		url: 'comment.php',
		data: $('#textComment').serialize(),
		dataType: 'html',
		beforeSend: function() { 
			process.text('Добавляется...').fadeIn();
		},
		error: function() {
			process.text('Ошибка! Не добавлен').delay(5000).fadeOut();
		},
		success: function(data) { 
			$('#allComments').prepend(data);
			process.text('Спасибо! Добавлен').delay(5000).fadeOut();
		}
	});
});
</script>

$_POST['textComment']
Ответить с цитированием
  #3 (permalink)  
Старый 28.12.2013, 16:43
Интересующийся
Отправить личное сообщение для Aligatro Посмотреть профиль Найти все сообщения от Aligatro
 
Регистрация: 03.12.2013
Сообщений: 15

Rise,
1 - Большое спасибо, что откликнулись и помогли =) Нет, скрипт работает абсолютно корректно и на все 100% выполняет свои функции. Просто в том случае если ему нужно вывести текст ошибки, этот текст ошибки на 2 сек перекрывает текст ожидания. Поэтому мне либо нужно как-то разорвать скрипт, либо поставить timeout между ошибкой и и текстом ожидания.

2 - Да, я безусловно могу вынести это в свой основной css файл, но так как это все это происходит на wordpress, то я хочу дописать пару строк вызова этого скрипта, админку по изменению селекторов и сложить себе в виде запакованного плагина.

3 - Ваш код классный и компактный, но боюсь, что на wp он не сработает =)

P.s Прошу принять во внимание, что я абсолютный новичок в js и до недавнего времени жутко боялся этого языка =) Посему, на данный момент в арсенале моих знаний разве что минимальное знание семантики и разметки, да и то не факт =)
Ответить с цитированием
  #4 (permalink)  
Старый 28.12.2013, 17:40
Интересующийся
Отправить личное сообщение для Aligatro Посмотреть профиль Найти все сообщения от Aligatro
 
Регистрация: 03.12.2013
Сообщений: 15

Проблему с setTimeout решил, получился конечно быдло код (как в принципе и в оригинале), но зато работает. Вдруг кто с поиска забежит, выложу свое решение.

jQuery.ajax({
			 beforeSend:function(){ 
				if(jQuery("#ajx-processing").length == 0 )
				var $message=jQuery('<span id="ajx-processing"></span>').appendTo("#commentform");
				jQuery("#ajx-processing").html('Комментарий скоро будет добавлен. Пожалуйста подождите...').show(0).delay(2000).hide(0);
				return
			 },
			 type:'post',
			 url:jQuery(this).attr('action'),
			 data:jQuery(this).serialize(),
			 dataType:'html',
			 error: function (xhr) {
			 if(xhr.status==500){
				  setTimeout(function(){
				  if(jQuery("#ajx-error").length == 0 )
					var $message=jQuery('<span id="ajx-error"></span>').appendTo("#commentform");
					jQuery("#ajx-error").html(xhr.responseText.split('<p>')[1].split('</p>')[0]).delay(4000).hide(0);
					}, 1500); 
				 }
				 else if(xhr.status=='timeout'){
					setTimeout(function(){
					var $message=jQuery('<span id="ajx-error"></span>').appendTo("#commentform");
				  jQuery("#ajx-error").html('Error:Server time out,try again!').delay(4000).hide(0); 
					}, 1500);
				 }
				 else{ 
				  jQuery("#ajx-error").html('too fast error').delay(4000).hide(0); //too fast error
				 }
				
			 },


К сожалению, я еще так и не смог найти инфо о том как в js можно было бы вставить стили вида <style></style>, если вообще можно -)
Ответить с цитированием
  #5 (permalink)  
Старый 17.02.2014, 18:37
Новичок на форуме
Отправить личное сообщение для AlexKats Посмотреть профиль Найти все сообщения от AlexKats
 
Регистрация: 08.02.2014
Сообщений: 2

У меня похожая беда. Необходимо вывести сообщение, что идет процесс обработки при запуске синхронного Ajax.
вот код:
if (document.Myform.nomKonk2.value!="0"){
      document.getElementById("smsKonk").firstChild.nodeValue="Загрузка";
      window.setTimeout(PriceOtherCargo(document.Myform.nomKonk2.value,2), 0);}


В итоге сообщение "Загрузка" появляется только после того, как полностью выполниться PriceOtherCargo(), а этот процесс занимает несколько секунд. Помогите вывести сообщение до завершения процесса.

Спасибо.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
После события checked запустить ajax, выходит: Сначала ajax потом checked??? Андрей Лебедев Элементы интерфейса 0 09.02.2013 13:07
Проблема с AJAX Dim@ AJAX и COMET 4 16.09.2012 22:52
Ajax таблица gofkane Работа 1 26.09.2011 18:26
Ajax таблица gofkane Работа 0 25.09.2011 11:53
Ajax разбор метода mycoding jQuery 14 21.05.2010 10:57