jQuery Ajax Debugging


ข้อเสียอย่างหนึ่งเวลาใช้ Ajax คือ เวลามี error อะไร user จะไม่ทราบอะไรเลย เพราะว่าเป็นการโหลดแบบเบื้องหลัง บางทีโหลดเกือบจะเสร็จแล้ว แต่เห็นหน้านิ่งๆ เลย refresh ใหม่ซะเลย ความจริง jQuery มี event onErrors ไว้สำหรับจัดการเวลาใช้ Ajax แล้วมีปัญหาอยู่แล้ว แต่การที่จะต้องมาเขียนกำหนดให้ทุกตัวที่เรียกใช้ Ajax ก็ไม่สดวกเลย จึงมี $.ajaxSetup ไว้ให้สามารถกำหนดคุณสมบัติที่เป็นส่วนกลางให้คำสั่ง Ajax ต่างๆ ทั้ง $.Ajax, $.get, $.json, $.post ใช้ร่วมกัน แค่ประกาศใช้ $.ajaxSetup เอาไว้ล่วงหน้า

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>jQuery.ajaxSetup</title>
</head>

<body>
<script src="assets/jQuery/jquery.min.js"></script> 
<script>
$.ajaxSetup({
	"cache": false,
	"error": function(jqXHR, exception)
	{
		if(jqXHR.status === 0)
		{
			alert('Not connect.\n Verify Network.');
		}
		else if(jqXHR.status == 404)
		{
			alert('Requested page not found. [404]');
		}
		else if(jqXHR.status == 500)
		{
			alert('Internal Server Error [500].');
		}
		else if(exception === 'parsererror')
		{
			alert('Requested JSON parse failed.');
		}
		else if(exception === 'timeout')
		{
			alert('Time out error.');
		}
		else if(exception === 'abort')
		{
			alert('Ajax request aborted.');
		}
		else
		{
			alert('Uncaught Error.\n' + jqXHR.responseText);
		}
	},
	"scriptCharset": "utf-8",
	"timeout": 60000
});

$.post('nofile.php', function(data){
	alert(data);
});
</script>
</body>
</html>

เรื่องที่เกี่ยวข้อง

About plusmagic

PHP lover in thailand

Posted on 2013/04/15, in javaScript, jQuery and tagged , , . Bookmark the permalink. 1 ความเห็น.

ใส่ความเห็น

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / เปลี่ยนแปลง )

Twitter picture

You are commenting using your Twitter account. Log Out / เปลี่ยนแปลง )

Facebook photo

You are commenting using your Facebook account. Log Out / เปลี่ยนแปลง )

Google+ photo

You are commenting using your Google+ account. Log Out / เปลี่ยนแปลง )

Connecting to %s

%d bloggers like this: