Показать сообщение отдельно
  #1 (permalink)  
Старый 03.02.2014, 16:55
Новичок на форуме
Отправить личное сообщение для Sema Посмотреть профиль Найти все сообщения от Sema
 
Регистрация: 25.12.2013
Сообщений: 2

Динамическое обновление таблицы
Доброго времени суток. Столкнулся с такой проблемой. У меня есть реализована модель CRUD и все замечательно работает. Решил усовершенствовать ее чтоб все действия происходили без перезагрузки страницы. С первым этапом справился а именно с добавлением.Тобиш есть таблица юзеров и кнопка "creat new user", открывается диалоговое окно вносятся все данные и сохраняются в БД без перезагрузки. И тут у меня начался ступор. после добавления нужно обновить таблицу с юзерами также аяксом. а как? может кто подскажет.. вот кидаю код...

/*Init form submit events*/
	function initDialogEvents($container){
		var $form = $container.find("form");
		//var $submitButton = $form.find(".submit_button");
		
		$form.on("submit", function(e, data){
				e.preventDefault();
				
				$.ajax({
                    url:      $form.attr('action'), //Адрес подгружаемой страницы
                    type:     "POST", //Тип запроса
                    dataType: "json", //Тип данных
                    data: $form.serialize(), 
                    success: function(data) { //Если все нормально
						console.info(data);
                    	//$container.html(response);
						//initDialogEvents($container);
						$container.dialog("close");											
						addUserToTable(data);
						
                	},
               		error: function(response) { //Если ошибка
               			$container.append("fuckin' shit. JSON has wrong format");
                	}
				});
				//return false;//
		});		
	}
	
	function addUserToTable(data){
		var $usersTable = $("#users tbody");
		var $row = $("tr#user-" + data.id);
		
				
		if (!$row.length){ // if it's a new user - tr is not created yet
			$row = $("<tr/>").attr("id", data.id);	//let's create new one
			
		}
		
		
		$row.append($("<td/>").text(data.name))
		    .append($("<td/>").text(data.lastname))
			.append($("<td/>").text(data.email))
			.append($("<td/>").text(data.age))
			.append($("<td/>").text(data.male))
			.append($("<td/>").text(data.city))
			.append($("<td/>"));
		

	   $usersTable.append($row);
       
				
	}
	

		
});

Последний раз редактировалось Sema, 03.02.2014 в 17:15.
Ответить с цитированием