Learn jQuery Day 25,26,27,28


Day25
그동안 입력, 수정페이지를 오래 작업해서인지 이전 강좌들보다 오늘의 강의가 훨씬 친숙하게 느껴진다.
헌데 중간에 나타난 serialize 부분을 따라하다보니 얘를 쓰려면 반드시 name 속성이 정의되어 있어야 한댄다.
id, name 같은 값을 중복하는것도 싫고 귀찮고 해서 그냥 id로 실습하다보니 serialize 함수에서 못찾아버리네 😡

For a form element’s value to be included in the serialized string, the element must have a name attribute.

Day26, 27
PHP와 jQuery 조합으로 기본 CRUD 페이지를 만들어냄… 패스:)

Day28
Deferred?

Deferreds are a relatively new addition (as of version 1.5) to jQuery that allow us to register multiple callbacks for any number of asynchronous actions

뭔가… 중간에 Pub/Sub대신 요런걸 사용한다는데 약간 … 낯설다

Deferred 객체를 만들어 resolve() > promise() > done() 을 타거나 reject() > promise() > fail() 을 탈 수 있고 마치 trycatch 문의 finally 처럼 마지막 done, fail이 아니어도 결과값만 있으면 항상 뭔가를 실행할 수 있는 always()도 존재한다.

첨에 우려한바로는 done 이든 fail 이든 always 든 pub/sub 처럼 여러개의 listener를 등록하지 못하는게 아닐까 싶었는데 그냥 같은 구문을 여러번 써줘도 차레대로 실행하는것을 확인했고 마구 섞어 사용해도 기본적인 흐름을 따라 마지막까지 잘 실행되는것을 확인했다.

$.searchTwitter = function( search ) {
	var dfd = $.Deferred();

	$.ajax({
		url: 'http://search.twitter.com/search.json',
		data: { q:search },
		dataType: 'jsonp',
	 	success: dfd.resolve,
	 	error: dfd.reject
	});

	return dfd.promise();
};

var outer = $.searchTwitter('cats');

outer.then(
	function( results ) {   // done
		console.log(results);
	},
	function( results ) {   // fail
		console.log( 'YOU FAIL!!' );
	}
);

outer.fail(function() {
	console.log('something else..');
});

더군다나 아래처럼 promise() 까지 붙여 return 해버리면 성공시 resolve, 실패시 reject를 알아서 반환해 코드는 간결해지고 흐름은 그대로 유지할 수 있는 장점이 있다. 그밖에 강좌에 나오는 each, when 메서드 역시 실행 후 바로 callback 으로 done() 메서드를 붙일 수 있음 😉

$.searchTwitter = function( search ) {
	return $.ajax({
		url: 'http://search.twitter.com/search.json',
		data: { q:search },
		dataType: 'jsonp'
	}).promise();
};

http://learnjquery.tutsplus.com
http://api.jquery.com/serialize/
http://api.jquery.com/jQuery.post/
http://api.jquery.com/category/deferred-object/

%d bloggers like this: