A-jax 관련 질문입니다.
본문
안녕하세요.
최근에 php공부하면서 이것저것 만들어보고 있는 초보입니다.
그누보드 없이 이것저것 만들어보려고 하니 좀 어렵네요 ㅎ;
DB에 등록된 컨텐츠를 목록으로 만들고 체크박스를 만들어서 사용/미사용 스위치처럼 사용할수 있게 A-jax 를 사용해서 만들어보고있는데요. 처음이다보니 궁금한게 많네요;
<?php
if($result != null){//---- 검색된 내용이 없을 경우
for ($i=0; $row = mysqli_fetch_array($result); $i++){
?>
<tr>
<td id="seq"><?php echo $row['pc_idx'] ?></td>
<td onclick="location.href='./portfolio_category_view.php?pc_idx=<?=$row['pc_idx']?>'" style="cursor:pointer"><?php echo $row['pc_title'] ?></td>
<td>
<?php if($row['pc_active'] == '1') { ?> <!--사용여부 "사용" 이면 체크박스 체크-->
<input id="on_off" name="on_off" type="checkbox" checked >
<?php } else { ?> <!--사용여부 "미사용" 이면 체크박스 해제-->
<input id="on_off" name="on_off" type="checkbox">
<?php } ?>
</td>
<td><?php echo $row['pc_ranking'] ?></td>
<td><?php echo $row['pc_rgstdate'] ?></td>
</tr>
<?php
$num--;
}
}
?>
[/cdoe]
이부분은 목록을 뿌려주는쪽 입니다.
[code]
<script>
$(document).ready(function() {
$('input[type=checkbox][name=on_off]').change(function() {
if ($(this).is(':checked')) {
var active = '1'; // 1은 사용 0은 미사용
}
else {
var active = '0';
}
$.ajax({
url : "./portfolio_ajax.php",
method : "POST",
data : {active : active},
success : function(data){
document.location.href = document.location.href;
alert(data);
}
});
});
});
</script>
이건 A-jax 부분인데요, 체크박스를 체크/해제하면 작동은 됩니다만 시퀀스가 없다보니 전체가변경이되고있습니다.
각 체크박스를 체크했을때 해당 체크박스의 시퀀스번호를 A-jax로 보낼수있는방법이 있을까요?
조언 주시면 감사하겠습니다.
!-->답변 3
이렇게 바꿔보세요
<?php
if($result != null){//---- 검색된 내용이 없을 경우
for ($i=0; $row = mysqli_fetch_array($result); $i++){
?>
<tr>
<td id="seq"><?php echo $row['pc_idx'] ?></td>
<td onclick="location.href='./portfolio_category_view.php?pc_idx=<?=$row['pc_idx']?>'" style="cursor:pointer"><?php echo $row['pc_title'] ?></td>
<td>
<!--수정--->
<input id="on_off" name="on_off" type="checkbox" <?php echo $row['pc_active'] == '1'?'checked':''?> data-pc-idx="<?php echo $row['pc_idx']?>" >
<!--수정--->
</td>
<td><?php echo $row['pc_ranking'] ?></td>
<td><?php echo $row['pc_rgstdate'] ?></td>
</tr>
<?php
$num--;
}
}
?>
<script>
$(document).ready(function() {
$('input[type=checkbox][name=on_off]').change(function() {
var active = '0';
var pc_idx = $(this).data('pc-idx');
if ($(this).is(':checked')) {
active = '1'; // 1은 사용 0은 미사용
}
$.ajax({
url : "./portfolio_ajax.php",
method : "POST",
data : {active : active,pc_idx:pc_idx},
success : function(data){
document.location.href = document.location.href;
alert(data);
}
});
});
});
</script>
체크박스에 data-id="고유번호" 하시고 ajax 넘어갈때 data-id 값을 가지고 와서 보내주시면 될거 같습니다.
1. document.location.href = document.location.href;
새로고침 하시려면
location.reload( true)를 사용하실 수 있습니다.
2. 새로고침 하면 ajax를 쓰는 의미가 덜 합니다. 굳이 하실 필요 없어 보입니다.
답변을 작성하시기 전에 로그인 해주세요.