JS 는 체크 상자 의 전체 선택 과 일괄 삭제 기능 을 실현 합 니 다 (phop 백 엔 드)

기능 설명: 전체 선택 을 선택 할 때 모든 상품 을 선택 하고 전체 선택 을 취소 할 때 모든 물품 의 선택 을 취소 합 니 다.대량 삭 제 를 클릭 하면 선택 한 상품 을 삭제 합 니 다.

<td align="center" width="12%" >
    <input type="checkbox" id="allChecks"  onclick="ckAll()" />  /   
    td>

//  
    function ckAll(){
        var flag=document.getElementById("allChecks").checked;
        var cks=document.getElementsByName("check");
        for(var i=0;i

선택 상자 에 onclick 이벤트 추가.이 콤 보 상 자 를 클릭 할 때마다 datadel 이벤트 가 실 행 됩 니 다.datadel () 방법 에서 저 희 는 먼저 allChecks 의 현재 체크 상 태 를 얻 은 다음 에 다른 상품 의 체크 상자 로 할당 하면 됩 니 다.이 단계 의 실현 은 매우 간단 하 다.복잡 한 것 은 어떻게 상품 의 대량 삭 제 를 실현 하 는가 이다.처음에 나 는 콤 보 상 자 는 하나의 구성 요소 일 뿐 인 데 어떻게 해 야 상품 의 번호 (메 인 키) 와 관계 가 있 을 수 있 는 지 계속 생각 했다.체크 상자 구성 요소 에 value 의 값 이 있 는 것 을 본의 아니 게 발 견 했 습 니 다. 저 는 상품 의 번 호 를 value 에 할당 한 다음 에 대량으로 삭제 할 때 value 의 값 을 얻 을 수 있 습 니 다. get 요청 을 통 해 servlet 에 전송 할 수 있 습 니 다.이 문 제 를 성공 적 으로 해결 했다.코드 는 다음 과 같 습 니 다:

<td><input type="checkbox" value="{$vo.id}" name="check">td>

전단 js 코드

 /*  -    */
    function datadel() {
        layer.confirm('            ？', {
            btn: ['  ','  '] //  
        }, function() {
            var cks=document.getElementsByName("check");
            var str="";
            //     id
            for(var i=0;iif(cks[i].checked){
                    str+=cks[i].value+"&";
                }
            }
            //        ‘&’
            str=str.substring(0, str.length-1);
                $.ajax({
                    url: "{:url('artical/delall')}",
                    type: "POST",
                    data: {"str": str},
                    dataType: "json",
                    success: function (result) {
//  console.log(data);
                        if(result.status == 0) {
                            return dialog.error(result.message);

                        }
                        if(result.status == 1) {
                            return dialog.success(result.message, "{:url('artical/_list')}");
                        }
                        if(result.status == 2) {
                            return dialog.error(result.message);

                        }
                    }
                });


            }
        )



    }
    }

배경 tp5 프레임 컨트롤 러 코드

public function  delall()
{
    $str = input ('str');
    //        
    if ($str!=="") {
        $id = explode ('&', $str);//         
        $user = newsmodel::destroy ($id);
        if ($user) {
            $result = array(
                'status' => '1',
                'message' => '    ！'
            );
            return json ($result);
        } else {
            $result = array(
                'status' => '0',
                'message' => '    ！'
            );
            return json ($result);
        }
    } else {
        $result = array(
            'status' => '2',
            'message' => '     ！'
        );
        return json ($result);

    }
}