각 열에 ID를 제공하는 PHP를 사용하여 동적으로 테이블을 만듭니다. 내가하고 싶은 것은 버튼 클릭으로 트리거 된 ajax 호출 후 ID에 대한 클래스를 변경하는 것입니다. ajax 부분은 잘 작동하지만 성공하면 선택한 행 열에서 클래스를 변경하는 방법에 대해 고심하고 있습니다. 버튼 클릭이 ajax 호출을 시작한 후 다음 요소의 클래스를 class = 'active'에서 class = 'inactive'로 변경하고 싶습니다. 물론 수십 개의 행이있을 수 있습니다.
테이블의 HTML은 다음과 같습니다.
<tr>
<div id='divID4'>
<td id='col14' class='active'>S-2016-000700</td>
<td id='col24' class='active'>48.0137.000</td>
<td id='col34' class='active'>SCHOELL PETER W</td>
<td id='col44' class='active'>S-2016-000700 DLQ DRINKING WATER FEE</td>
<td id='col54' align='center' class='active'>1</td>
<td id='col64' align='right' class='active' style='padding-right:22px;'> $ 2.29</td>
<td><input type='text' id='fld4' class='postData' name='S-2016-000700|48.0137.000' value='300.00' /></td>
<td><input type='button' id='del4' value='X' /></td>
</div>
그리고 내가 작업하려는 jQuery 스크립트 (전혀 최적화되지 않음)는 다음과 같습니다.
<!-- This ajax function Voids a line. Update DB and change font to strike-through -->
<script>
$(".voidData").each(function() {
$(this).click(function() {
var pID = ($(this).attr('id')); /* id */
var pName = ($(this).attr('name')); /* Assessment Code | Parcel */
// ajax call to add amounts to temp file
$.ajax({
url: "void.php",
type: "POST",
data: {id : pName},
success: function(data){
pID = pID.substr(3);
var c1 = 'col1' + pID
$('#' + c1).removeClass('active').addClass('inavctive');
var c2 = 'col2' + pID
$('#' + c2).removeClass('active').addClass('inavctive');
var c3 = 'col3' + pID
$('#' + c3).removeClass('active').addClass('inavctive');
var c4 = 'col4' + pID
$('#' + c4).removeClass('active').addClass('inavctive');
var c5 = 'col5' + pID
$('#' + c5).removeClass('active').addClass('inavctive');
var c6 = 'col6' + pID
$('#' + c6).removeClass('active').addClass('inavctive');
console.log(c1 + " -- " + c2);
},
error: function(){
console.log("ERROR");
}
});
});
});
</script>
내 생각 과정은 '인덱스'행을 제공하는 버튼 클릭 (var pID)의 ID를 얻는 것입니다. 즉, 클릭 한 버튼의 ID는 'del4'이므로 'del'부분을 제거합니다. get (pID = 4). 이제 변경할 열 ID가 col14, col24, col34 등임을 알고 있습니다.
qJuery .removeClass 및 .addClass 함수에서 사용할 열 ID에 대한 변수 (즉 : var c1 = 'col1'+ pID)로 생성하려고합니다. 이런 식으로 '동적'변수 ID를 만들 수 있는지 확실하지 않습니다.
누군가 내가 이것을 어떻게 할 수 있는지에 대한 아이디어를 줄 수 있습니까? 나는 아마 모든 것을 잘못하고 있거나 적어도 어려운 방법으로하고 있지만, 그것을 성취하기 위해 생각할 수있는 유일한 방법입니다.
다음과 같이 JS에 번호를 전달할 수 있습니까?
function strike(idNum){
//Setting the classList to "inactive" removes the active class 'active'
document.getElementById("col"+idNum).classList = "inactive";
}
이 기사는 인터넷에서 수집됩니다. 재 인쇄 할 때 출처를 알려주십시오.
침해가 발생한 경우 연락 주시기 바랍니다[email protected] 삭제
몇 마디 만하겠습니다