backgrid.js에서 "select-all"및 "select-row"를 삭제하는 방법은 무엇입니까?

Question

js와 나는 그것의 새로운 오전 나는 그리드에 쇼 데이터로 끝났어, 이제 select-row 셀과 셀을 select-row로 추가한다. 서버에서 체크 된 행을 삭제하는 방법을 얻지 못하고 어떻게 html을 만들 수 있는가? 델 버튼이야. 연결시킬거야? 여기

내가 사용하고 내 자바 스크립트입니다 : -

<%= stylesheet_link_tag "bootstrap.min" %> 
     <%= stylesheet_link_tag "backgrid" %> 
     <%= stylesheet_link_tag "backgrid-filter" %> 
     <%= stylesheet_link_tag "backgrid-paginator" %> 
     <%= stylesheet_link_tag "backgrid-select-all.min" %> 
<%= javascript_include_tag "jquery-1.4.2.min.js"%> 
    <%= javascript_include_tag "underscore.js"%> 
    <%= javascript_include_tag "backbone.js"%> 
    <%= javascript_include_tag "lunr.js"%> 
    <%= javascript_include_tag "backgrid.js"%> 
    <%= javascript_include_tag "backbone-pageable.js"%> 
    <%= javascript_include_tag "backgrid-filter.js"%> 
    <%= javascript_include_tag "backgrid-paginator.js"%>   
    <%= javascript_include_tag "backgrid-select-all.min.js"%> 

및 backgrid 모달 그리드 코드 : -

var Territory = Backbone.Model.extend({}); 

var PageableTerritories = Backbone.PageableCollection.extend({ 
    model: Territory, 
    url: urlvariable, 
    state: { 
    pageSize: 15 
    }, 
    mode: "client" // page entirely on the client side 
}); 




var pageableTerritories = new PageableTerritories(); 
var columns = [{ 

    // name is a required parameter, but you don't really want one on a select all column 
    name: "", 

    // Backgrid.Extension.SelectRowCell lets you select individual rows 
    cell: "select-row", 

    // Backgrid.Extension.SelectAllHeaderCell lets you select all the row on a page 
    headerCell: "select-all", 

    },{ 
    name: "FirstName", 
    label: "First Name", 
    // The cell type can be a reference of a Backgrid.Cell subclass, any Backgrid.Cell subclass instances like *id* above, or a string 
    cell: "string" // This is converted to "StringCell" and a corresponding class in the Backgrid package namespace is looked up 
}, { 
    name: "LastName", 
    label: "Last Name", 
    cell: "string" // An integer cell is a number cell that displays humanized integers 
}, { 
    name: "PatientId", 
    label: "Patient Id", 
    cell: "uri" // A cell type for floating point value, defaults to have a precision 2 decimal numbers 
}, { 
    name: "RoomNumber", 
    label: "Room Number", 
    cell: "string" // A cell type for floating point value, defaults to have a precision 2 decimal numbers 
}, { 
    name: "AdmissionDate", 
    label: "Admission Date", 
    cell: "date" // A cell type for floating point value, defaults to have a precision 2 decimal numbers 
}, { 
    name: "DischargeDate", 
    label: "Discharge Date", 
    cell: "date" // A cell type for floating point value, defaults to have a precision 2 decimal numbers 
}, { 
    name: "MeasureCategory", 
    label: "MeasureCategory", 
    cell: "string" // A cell type for floating point value, defaults to have a precision 2 decimal numbers 
}]; 
// Set up a grid to use the pageable collection 
var pageableGrid = new Backgrid.Grid({ 
    columns: columns, 
    collection: pageableTerritories 
}); 

// Render the grid 
$("#grid").empty(); 

var $example2 = $("#grid"); 

$example2.append(pageableGrid.render().$el) 

// Initialize the paginator 
var paginator = new Backgrid.Extension.Paginator({ 
    collection: pageableTerritories 
}); 

// Render the paginator 
$example2.append(paginator.render().$el); 

// Initialize a client-side filter to filter on the client 
// mode pageable collection's cache. 
var filter = new Backgrid.Extension.ClientSideFilter({ 
    collection: pageableTerritories.fullCollection, 
    fields: ['FirstName'] 
}); 

// Render the filter 
$example2.prepend(filter.render().$el); 

// Add some space to the filter and move it to the right 
filter.$el.css({float: "right", margin: "20px"}); 

// Fetch some data 
pageableTerritories.fetch({reset: true}); 
} 

Answer 1

backgrid.js를 사용하는 경우 현재 선택된 세포를 얻을 수 및 선택 열 확장을 사용하면 다음 코드를 호출해야합니다.

var selectedModels = pageableGrid.getSelectedModels(); 
_.each(selectedModels, function (model) { 
    model.destroy(); 
}); 

버튼 요소 som을 만들 수 있습니다 페이지에 ewhere를 추가하고 click 이벤트 핸들러를 바인딩 한 다음 위 코드를 호출하십시오. 거친 jQuery 코드는 다음과 같습니다.

$('#delete-button').click(function() { 
    var selectedModels = pageableGrid.getSelectedModels(); 
    _.each(selectedModels, function (model) { 
    model.destroy(); 
    }); 
});