Ajax
-
[CodeIgniter] 9. AJAX 구현: jQueryWeb/CodeIgniter 2015. 8. 28. 10:49
8장에서 XMLHttpRequest 객체를 이용해 댓글 쓰기, 삭제를 구현헀습니다. 9장에서는 jQuery를 이용해 구현해보도록 하겠습니다. AJAX를 구현하기 위해 복잡한 과정을 거치고 DOM 스크립팅을 이용해 개발했는데 9장에서 jQuery를 이용해 개발한 소스를 비교해보면 jQuery가 단순하고 간결하게 프로그래밍할 수 있습니다. 9.1 댓글 쓰기 AJAX로 구현 컨트롤러와 모델 부분은 수정하지 않고 뷰만 DOM 스크립팅에서 jQuery를 이용한 방식으로 수정하면 됩니다. * bbs/application/views/board/view_v.php 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748..
-
[CodeIgniter] 8. AJAX 구현: XMLHttpRequestWeb/CodeIgniter 2015. 8. 26. 15:32
8장에서는 AJAX(Asynchronous Javascript And XML) 방식을 이용해 게시판의 댓글을 구현해보곘습니다. jQuery 같은 자바스크립트 프레임워크를 사용하지 않고 XMLHttpRequest 를 이용해 구현합니다. 들어가기 전에 AJAX에 대해 조금 알아보면 기존 방식의 사이트는 다음과 같습니다. - 웹 브라우저가 웹 서버에 요청을 전송 - 웹 서버는 JSP/PHP/ASP 등 서버측 애플리케이션을 이용해 사용자의 요청을 처리한 뒤, 처리 결과를 HTML로 웹 브라우저에 전송 - 웹 브라우저는 응답으로 받은 HTML을 화면에 출력 AJAX 방식은 아래와 같습니다. - 사용자가 마우스 클릭 같은 이벤트를 발생시키면 자바스크립트는 DOM을 이용해서 필요한 정보를 구한 뒤, XMLHttpRe..
-
[PHP] 55. AJAX Poll - PHP 강좌, PHP5Web/PHP 2015. 6. 13. 14:16
PHP Example - AJAX Poll 1. AJAX Poll 아래 예제는 리로드 없이 투표 결과를 보이는 예제입니다. 2. Example Explained - The HTML Page 12345678910111213141516171819202122232425262728293031323334function getVote(int) { if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, Safari xmlhttp=new XMLHttpRequest(); } else { // code for IE6, IE5 xmlhttp=new ActiveXObject("Microsoft.XMLHTTP"); } xmlhttp.onreadystatec..
-
[PHP] 54. AJAX RSS Reader - PHP 강좌, PHP5Web/PHP 2015. 6. 13. 14:15
PHP Example - AJAX RSS Reader RSS 리더는 RSS 피드를 읽을 때 사용됩니다. 1. AJAX RSS Reader 아래 예제는 웹페이지 리로드 없이 RSS-피드를 불러오는 예제입니다. 2. Example Explained - The HTML Page 1234567891011121314151617181920212223242526272829303132333435363738function showRSS(str) { if (str.length==0) { document.getElementById("rssOutput").innerHTML=""; return; } if (window.XMLHttpRequest) { // code for IE7+, Firefox, Chrome, Opera, S..
-
[PHP] 53. AJAX 실시간 검색 ( AJAX Live Search) - PHP 강좌, PHP5Web/PHP 2015. 6. 13. 14:15
PHP Example - AJAX Live Search AJAX는 좀 더 사용자 친화적이고 상호작용적 검색을 만드는데 사용됩니다. 1. AJAX Live Search 아래 예제는 사용자가 타이핑하는 동안 실시간 검색을 할 수 있게 보여줍니다. 실시간 검색(Live Search)는 기본 검색과 비교했을 때 많은 장점을 갖습니다: - 타이핑과 동시에 결과 보여줌 - 타이핑하는 동안 작은 결과창 보여줌 2. Example Explained - The HTML Page 123456789101112131415161718192021222324252627282930313233343536 function showResult(str) { if (str.length==0) { document.getElementById("..
-
[PHP] 52. AJAX 와 XML ( AJAX and XML) - PHP 강좌, PHP5Web/PHP 2015. 6. 13. 14:14
PHP Example - AJAX and XML 1. AJAX XML Example 위 예제는 AJAX로 XML로부터 웹페이지에서 정보를 어떻게 불러오는지에 대한 예제입니다. 2. Example Explained - The HTML Page 사용자가 리스트박스의 CD를 선택할 때, showCD() 함수가 실행됩니다. 123456789101112131415161718192021222324252627282930313233343536373839function showCD(str) { if (str=="") { document.getElementById("txtHint").innerHTML=""; return; } if (window.XMLHttpRequest) { // code for IE7+, Firefox..
-
[PHP] 51. AJAX 와 MySQL ( AJAX and MySQL) - PHP 강좌, PHP5Web/PHP 2015. 6. 13. 14:13
PHP - AJAX and MySQL 1. AJAX Database Example 아래 예제는 AJAX를 이용하여 웹페이지에서 데이터베이스로부터 정보를 어떻게 가져오는지에 대한 예제입니다. 2. Example Explained - The MySQL Database 데이터 베이스 테이블은 아래와 같습니다. idFirstNameLastNameAgeHometownJob1PeterGriffin41QuahogBrewery2LoisGriffin40NewportPiano Teacher3JosephSwanson39QuahogPolice Officer4GlennQuagmire41QuahogPilot 3. Example Explained 예제는 리스트 박스를 사용자가 클릭 했을 때, showUser()를 호출하게 하는 예..
-
[PHP] 50. AJAX 와 PHP(AJAX and PHP) - PHP 강좌, PHP5Web/PHP 2015. 6. 13. 14:12
PHP - AJAX and PHP AJAX는 좀 더 상호적인 어플리케이션을 만들기 위해 사용됩니다. 1. AJAX PHP Example 아래 예제는 사용자가 입력 필드에 문자를 타이핑하는 동안 웹 페이지와 웹 서버가 어떻게 통신을 하는가를 보이는 예제입니다. 1234567891011121314151617181920212223242526272829function showHint(str) { if (str.length == 0) { document.getElementById("txtHint").innerHTML = ""; return; } else { var xmlhttp = new XMLHttpRequest(); xmlhttp.onreadystatechange = function() { if (xmlhtt..