JQuery
JQuery - input & button Event
HiroDaegu
2022. 1. 5. 21:24
728x90
SMALL
<!DOCTYPE html>
<html lang="ko">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<script src="https://code.jquery.com/jquery-1.12.4.min.js"></script>
<script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js?client=ca-pub-4544051457126963"
crossorigin="anonymous"></script>
</head>
<body>
<table class="type_2">
<colgroup>
<col width="10%">
<col width="10%">
<col width="10%">
<col width="15%">
<col width="46%">
<col width="10%">
</colgroup>
<thead>
<tr>
<th>No</th>
<th>A</th>
<th>B</th>
<th>C</th>
<th>D/th>
<th>E</th>
</tr>
</thead>
<tbody>
<tr>
<td>1</td>
<td>X</td>
<td>Y</td>
<td>Z</td>
<td>
<span class="memo_span">XYZ</span>
<input type="text" style="display: none;" name="cs_memo" id="memo_input" value="<?=$row['cs_memo']?>">
<input type="hidden" name="cs_idx" id="memo_idx" value="<?=$row['cs_idx']?>">
</td>
<td>
<button style="width : 100px; height: 40px;" type="button" class="cs_btn orange_btn_f63 memo_write">수정</button>
<button style="width : 100px; height: 40px; background-color: #cc3433; display: none;" type="button" class="cs_btn orange_btn_f63 memo_save">저장</button>
</td>
</tr>
</tbody>
</table>
<script>
$(function(){
// 상담 메모 수정
$(".memo_write").click(function(event) {
$(this).parent().parent().find('#memo_input').css('display','block');
$(this).parent().parent().find('.memo_span').css('display','none');
$(this).parent().parent().find('.memo_write').css('display','none');
$(this).parent().parent().find('.memo_save').css('display','block');
// $('#memo_input')
// $('.memo_span').css('display','none');
// $('.memo_write').css('display','none');
// $('.memo_save').css('display','block');
});
// 상담메모 저장
$(".memo_save").click(function(event) {
var db_idx = "<?=$_GET['db_idx']?>";
var cs_idx = $(this).parent().parent().find('#memo_idx').val();
var cs_memo = $(this).parent().parent().find('#memo_input').val();
$.post('/경로', {db_idx: db_idx,cs_idx: cs_idx,cs_memo: cs_memo}, function(data, textStatus, xhr) {
alert(data.returnMsg);
location.reload();
});
});
});
</script>
</body>
</html>728x90
LIST