지난 주에 Code Igniter를 접하고, DB 연결부터 기본적인 튜토리얼 따라서 어느 정도 화면은 만들어 냈는데,
Ajax 부분은 제가 필요한 예제를 접할 수가 없어서 엄청나게 헤매고 있습니다.
기능은 매우 단순한데..
View에 있는 Radio 버튼을 클릭하면 'Y' 인지 'N' 인지 즉시 판단해서
View 화면 하단에 있는 <div id="chk_message"></div> 에 "A메세지" or "B메세지"를 뿌려주는 겁니다.
Code를 보여 드리면, View는 아래와 같이 작성했구요
<script src="<?php echo base_url(); ?>application/js/jquery-1.7.2.js" type="text/javascript"></script>
<script src="<?php echo base_url(); ?>application/js/securityreport.js" type="text/javascript"></script>
<?php echo validation_errors();?>
<?php echo form_open('c=SecurityClearanceReport'); ?>
<table class="check_tbl">
<tr><th class ="c1">번호</th><th>내용</th><th width="100px">점검결과</th></tr>
<tr><td class ="c1">1</td><td class="c2">내용 </td><td class="c1"><input type="radio" id="chk_1" name="chk_1" value="Y" /><?php echo form_radio('chk_1','Y')?>네<?php echo form_radio('chk_1','N',TRUE)?>아니오</td></tr>
<tr><td class ="c1">2</td><td class="c2">내용 </td><td class="c1"><?php echo form_radio('chk_2','Y')?>네<?php echo form_radio('chk_2','N',TRUE)?>아니오</td></tr>
<tr><td class ="c1">3</td><td class="c2">내용 </td><td class="c1"><?php echo form_radio('chk_3','Y')?>네<?php echo form_radio('chk_3','N',TRUE)?>아니오</td></tr>
<tr><td class ="c1">4</td><td class="c2">내용 </td><td class="c1"><?php echo form_radio('chk_4','Y')?>네<?php echo form_radio('chk_4','N',TRUE)?>아니오</td></tr>
<tr><td class ="c1">5</td><td class="c2">내용 </td><td class="c1"><?php echo form_radio('chk_5','Y')?>네<?php echo form_radio('chk_5','N',TRUE)?>아니오</td></tr>
<tr><td class ="c1">6</td><td class="c2">내용 </td><td class="c1"><?php echo form_radio('chk_6','Y')?>네<?php echo form_radio('chk_6','N',TRUE)?>아니오</td></tr>
<tr><td class ="c1">6-1</td><td class="c2">내용 </td><td class="c1"><?php echo form_radio('chk_7','Y')?>네<?php echo form_radio('chk_7','N',TRUE)?>아니오</td></tr>
<tr><td class ="c1">6-2</td><td class="c2">내용 </td><td class="c1"><?php echo form_radio('chk_8','Y')?>네<?php echo form_radio('chk_8','N',TRUE)?>아니오</td></tr>
<tr><td class ="c1">6-3</td><td class="c2">내용 </td><td class="c1"><?php echo form_radio('chk_9','Y')?>네<?php echo form_radio('chk_9','N',TRUE)?>아니오</td></tr>
<tr><td class ="c1">6-4</td><td class="c2">내용 </td><td class="c1"><?php echo form_radio('chk_10','Y')?>네<?php echo form_radio('chk_10','N',TRUE)?>아니오</td></tr>
<tr><td class ="c1">7</td><td class="c2">내용 </td><td class="c1"><?php echo form_radio('chk_11','Y')?>네<?php echo form_radio('chk_11','N',TRUE)?>아니오</td></tr>
</table>
Controller는 이렇게
public function ChkSecurity() {
$chkResult = trim($_POST['chk_flag']);
if ($chkResult == 'Y'){
echo '데이터 수신!!';
} else {
echo '데이터 수신2!!';
}
스크립트는 이렇게 튜토리얼 보고 만들고 있습니다...
$(document).ready(function() {
$('input[name=chk_1]:radio').click(function() {
// if (this.val == 'Y') {
//alert('확인!');
// $('#security_result').text("메세지1");
// } else {
// alert('확인!')
// $('#security_result').text("메세지2");
// }
var chk_flag = this.val();
//event.preventDefault();
});
/*
$.post('/index.php/SecurityClearanceReport/ChkSecurity',
{ 'chk_flag':chk1_value },
// when the Web server responds to the request
function(result) { }
);
*/
$.ajax({
url:"/index.php/SecurityClearanceReport/ChkSecurity"+chk_flag;
});
});
이 구조들에 대해서 이해만 하면... 크게 어렵지 않을 것 같은데, 아직 CI Framework와 JQuery 라는 생소한 두 가지를 접하면서 제가 원하는 기능이 있는 튜토리얼을 못찾으니 쉽지가 않네요.
고수님들의 도움 부탁드립니다.
지면상 자세한 설명은 생략 하겠습니다. ^^
http://api.jquery.com/load/