2010-03-02 8 views
5

jqGrid에서 자체 삭제 기능을 구현하고 싶습니다. 현재 기본 제공 UI (행 선택, 꼬리표의 휴지통 버튼 확인, 확인)를 사용하고 있지만 각 행에 삭제 버튼이 있고 확인을 위해 자체 UI를 구현하는 것을 선호합니다.jqGrid의 사용자 정의 삭제 버튼

API에 서버에 대한 삭제를 실행할 수있는 항목이 없습니다. 단지 클라이언트에서 삭제하는 delRowData 만 있습니다. 이 작업을 수행 할 수 있습니까?

(나는 ASP.NET component, FWIW를 사용하고 있습니다).

답변

2

@Erik이 올바른 경로에서 나를 잡았습니다. 그의 솔루션은 효과가 있지만 기존의 의사 모달 팝업 확인 UI는 보존하고 있습니다.

또한 JqGrid ASP.NET component이 제공하는 서비스를 이용하지 않습니다. 이 구성 요소는 제대로 구성된 데이터 소스 (ObjectDataSource, SqlDataSource 등)에 연결되어있는 한 모든 CRUD 작업을 실제로 처리합니다.

나를 위해 누락 된이 조각은 구성 요소의 CRUD 작업의 메커니즘입니다. 피들러와 주변의 파고에 의해 나는 그것이 쿼리 문자열에있는 jqGrid 객체의 클라이언트 ID와 같은 페이지에 관련 데이터를 게시합니다 것을 볼 수 있었다 : 삭제

MyPage.aspx?jqGridID=ctl00_ctl00_Content_Content_MyJqGrid

, 게시물의 내용은 @ 같다 에릭 설명 : 또 다른 솔루션 프로그램입니다

$(".DeleteButton", grid).click(function(e) { 
    var rowID = getRowID(this); 
    $(grid).setSelection(rowID, false); 
    if (confirm('Are you sure you want to delete this row?')) { 
     var url = window.location + '?jqGridID=' + grid[0].id; 
     var data = { oper: 'del', id: rowID }; 
     $.post(url, data, function(data, textStatus, XMLHttpRequest) { 
      $(grid).trigger("reloadGrid"); 
     }); 
    } else { 
     $(grid).resetSelection(); 
    } // if 
}); // click 

getRowID = function(el) { 
    return $(el).parents("tr").attr("id"); 
}; 
10

서버 측 삭제를 처리하는 기본 jqGrid 구성 요소는 없습니다. 내장 삭제를 사용하더라도 서버 측을 제거하지 않아도 직접 처리해야합니다.

Array 
(
    [oper] => del 
    [id] => 88 
) 

이 ID가 분명히 어디

// your custom button is #bDelete 
$("#bDelete").click(function(){ 

    // Get the currently selected row 
    toDelete = $("#mygrid").jqGrid('getGridParam','selrow'); 

    // You'll get a pop-up confirmation dialog, and if you say yes, 
    // it will call "delete.php" on your server. 
    $("#mygrid").jqGrid(
     'delGridRow', 
     toDelete, 
      { url: 'delete.php', 
      reloadAfterSubmit:false} 
    ); 
}); 

다음 정보는 POST를 통해 과거이 삭제 URL이다 : 그러나 여기 그래서 스크립트는 누군가가 사용자 정의 버튼을 삭제 클릭 할 때 호출을 설정하는 방법 이 경우 함수에 전달 된 ID는 toDelete입니다.

질문을보기 전에 실제로 어떻게하는지에 대해 모호한 생각이 있었지만 실제로는 내 프로젝트에이 작업을 수행했습니다. 그래서 ... 내가 그것에 도착하게 해줘서 고마워!

+0

@Erik - 올바른 방향으로 날 가리키는 주셔서 감사합니다. ASP.NET 구성 요소는 실제로 올바르게 구성된 SqlDataSource (업데이트, 삽입 및 선택을 처리)에 연결되어있는 경우 삭제를 수행합니다. –

1

:

oper=del&id=18

그래서 나는 모든 과정을 완벽하게 제어를 유지할 수 있도록 내 자신의 작업을 복제 할 수있었습니다 삭제 아이콘 (있는 경우)을 수학적으로 클릭하십시오. 삭제 아이콘 (실제로 div)의 ID는 "del_ [GridId]"입니다. ID 명명을 변경할 수 있기 때문에 이것은 완전히 단단한 해결책이 아닐 수 있습니다. 그러나 당신은 정확히 같은 행동을합니다 (그리고 더 좋은 모달을 확인하십시오).

예 :

$('#MyButton').click(function() { $('#del_' + gridId).click(); }); 
관련 문제