반응형

인원수가증가하거나
입력값이 불특정하게 증감할수있을시
추가삭제버튼으로 배열로 넘기기도한다
상당히 귀찮은 작업이고 db도 배열로 넣고해야되서 귀찮..

일단은 javascript 로 클론처리해서 넣는데
가끔 클릭작동이나 배열안넘어갈때 동적 컨텐츠? 그 체크도 해주고 삭제할때도 인덱스 체크도해주고..
여튼 스크립트는 이런식이다

parent로 상위 골라서 마지막 부분에추가. 삭제버튼활성화
맨처음은 삭제버튼 비활성화

추가버튼은 맨첫번째에만 넣어뒀다 아래로 차곡차곡 추가되는방식

// 항목추가 버튼 클릭시
$(".add_btn").click(function(){
var clickedRow = $(this).parent();
var cls = clickedRow.attr("class");

// tr 복사해서 마지막에 추가
var newrow = clickedRow.clone();
newrow.find("li:eq(0)").remove();
newrow.find('input').val('');
newrow.find('.del_btn').removeClass('d-none');
newrow.find('.add_btn').addClass('d-none');
newrow.insertAfter($(".ap_con ."+cls+":last"));

});

// 삭제버튼 클릭시
$(document).on('click','.del_btn',function(){

var clickedRow = $(this).parent();
var cls = clickedRow.attr("class");

// 각 항목의 첫번째 row를 삭제한 경우 다음 row에 td 하나를 추가해 준다.
if( clickedRow.find("li:eq(0)").attr("rowspan") ){
    return false;
}

clickedRow.remove();

resizeRowspan(cls);

});

728x90
반응형

+ Recent posts