Автоматический сбор данных Ajax-форм

Рассмотрим полезнейшую функцию, которая собирает в строку все данные определенной формы, чтобы затем передать их в Ajax-запросе.

Наверняка многим надоело писать отдельные Ajax-обработки форм данных, мне тоже. Поэтому, не долго думая, погуглив и не найдя нужного в просторах инета и в документации jQuery, я начал писать функцию, которая делает все это сама, и вот что у меня вышло:

function AjaxData(form){
	var form_data = "";
	if(form){
		// [ специальных хак под JQuery
		var id = "";
		id = $(form).attr("id");
		if(id==""){ 
			id = "id"+Math.round(Math.random() * 1000000000);
			$(form).attr("id", id);
		}
		// специальных хак под JQuery ]
		var Elements = $("#"+id+" * ");
		for(var i=0; i < Elements.length; i++){
			var name = $(Elements[i]).attr("name");
			if(name){
				var value = $(Elements[i]).val();
				if(value && name!="" && value!="" && (Elements[i].tagName=="INPUT" || Elements[i].tagName=="TEXTAREA" || Elements[i].tagName=="SELECT") ){
					
					var type = $(Elements[i]).attr("type");
					if(Elements[i].tagName=="INPUT" && (type=="radio" || type=="checkbox") && $(Elements[i]).attr("checked")==false){
						continue;
					}
					if(Elements[i].tagName=="SELECT" && $(Elements[i]).attr("multiple")){
						$("option", Elements[i]).each(function(){
							if($(this).attr("selected")){
								form_data = form_data+"&"+ name +"="+ $(this).val();
							}
						});
					}else{
						form_data = form_data+"&"+ name +"="+ value.replace(/%/g,"%25").replace(/&/g,"%26").replace(/+/g,'%2B');
					}
				}
			}
		}
	}
	return form_data;
}

Собственно эта функция собирает в строку все данные определенной формы, чтобы затем передать их в Ajax-запросе.

К примеру, если Вашей форме присвоить id="myForm", то пример применения будет такой:

$.post("test.php", "ajax=yes"+AjaxData( $("#myForm") ) );

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

Думаю, функция поможет многим программистам, сам ей пользуюсь и другим советую, удачи!

Оцени публикацию:
  • 11,47
Оценили человек: 11
Теги : jQuery, Ajax

Похожие статьи:

Справочники и учебники:


Комментарии посетителей:
  • бхахахахаааа)))
    на jquery это делается одной строчкой.
    var formdata = $('.propereties_form').serialize();
    28 мая 2010, 15:08 коммент полезен : +7 # Гость
    • Почитай хотя бы о том, о чем ты пишешь. serialize сериализует только текстовые поля.
      28 января 2015, 14:58 коммент полезен : -1 # Alex7
  • Все об Ajax-запросе: http://jquery.page2page.ru/index.php5/%D0%9E%D0%B1%D1%81%D1%83%D0%B6%D0%B4%D0%B5%D0%BD%D0%B8%D0%B5:Ajax-%D0%B7%D0%B0%D0%BF%D1%80%D0%BE%D1%81
    04 января 2013, 09:26 коммент полезен : 0 # Lebnik (гость)
  • Форм-дата (не через сериализацию, а отдельным методом) собирает все поля, кроме файлов. Даже если написать, чтоб файлы добавлялись отдельно и сделать вариативность отправки по GET или POST, то всё одно меньше кода получится, чем вы написали. Пожалуйста, исправьте, ваш код ведь учит несмышлёных.

    Кстати, аноном невозможно пройти капчу. Пожалуйста, решите проблему.
    22 декабря 2015, 16:36 коммент полезен : 0 # Higimo
Предложения и пожелания:
Ваше имя:
Ваш E-mail:
Введите изображенные цифры:
Captcha
Главная
X

youtube.com/watch?v=7hFivbgIEqk

При полном или частичном использовании материалов данного сайта, ссылка на сайт "yapro.ru" обязательна как на источник информации.
Автоматический импорт материалов и информации с сайта запрещен.
Copyrights © 2007 - 2017 YaPro.Ru

Главная » Веб-мастеру » JavaScript »