jQuery ajax와 콜백 callbacks 활용하기

js API/jquery 2012. 4. 30. 13:33

jQuery ajax와 $.Callback() 함수를 활용하기



$('#list').fusionAjaxRecord 를 통해 ajax 통신을 마친 후
외부 함수인 prints 로 데이타를 전송한다.


외부 함수 prints 의 obj 는 #list 를 리턴받은 값이고

외부 함수prints 의 data는 ajax를 통해 돌려받은 데이타값을 리턴받는 값이다



# @ 외부 함수인 prints 함수를 ajax 통신이 마친 후 호출 및 데이타 전송

< script type="text/javascript">
$(document).ready(function()
{
	// obj : html 아이디 및 클래스 elementTag
	function prints(obj,data){
		$.each(data, function(key,state)
		{
			// 값 처리
		});
	}
	
	$('#list').fusionAjaxRecord({
		'filename':'./modules/test_view.php',
		'data':{
                         'tname':'bbs_notice',
		         'current_record':'1'
                 }
	}, prints);
});
< /script>







@# 전체소스 /==========================================================

< script>
jQuery(function($) 
{
	/**
	@prints : 외부 함수 function prints(){}
	function prints(obj, data){
	}
	
	$('#list').fusionAjaxRecord({
		'filename':'./modules/bbs_view.php',
		'data':{
				page:1,
				uid:10
		}
	}, prints);
	*/
	$.fn.fusionAjaxRecord= function(params,callMethod)
	{
		var targetID = $(this);
		var callbacks = $.Callbacks();
		var callFunction =callMethod;

		var param = $.extend({
			filename : null,
			data : ''
		},params||{});

		$.ajax({
			type: "post",
			url: param.filename,
			cache: false,
			dataType :'text',
			data :param.data,
			success: function(data, status)
			{
				var json = eval("(" + data + ")");				
				if(typeof(json.result) != 'undefined')
				{
					if(json.result == 'false')
						alert(json.msg);
					else{
						callbacks.add(callFunction);
						callbacks.fire(targetID,json);
					}
				}
			},
			error: function(data, status, errorThrown){
				alert(data.responseText+' '+status+' '+errorThrown);
			}
		});
	}
});
< /script>