Excluir linha(s) de grade, dependendo do valor com o botão
Pergunta
Eu preciso eliminar algumas linhas dependendo do valor do columnStatus.Eu tentei o código, mas nada acontece.
Por exemplo, eu tenho 6 linhas com valores (1,1,3,2,4,3) e eu quero excluir linhas com status de 2,3 e 4, resultando em apenas duas linhas para a esquerda, a linha 1 e linha 2.
ID Status
Row 1 1 1
Row 2 2 1
Row 3 3 3
Row 4 4 2
Row 5 5 4
Row 6 6 3
Gridpanel
<ext:GridPanel ID="grid" runat="server" Title= “" AutoWidth="true" AutoHeight="true"
Padding="4" StripeRows="true" Draggable="false" Selectable="true" Icon="Application">
<Store>
<ext:Store ID="Store1" runat="server">
<Reader>
<ext:ArrayReader>
<Fields>
<ext:RecordField Name=" personID " Mapping="PersonsId"/>
<ext:RecordField Name="description" Mapping="Description " />
</Fields>
</ext:ArrayReader>
</Reader>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel1" runat="server">
<Columns>
<ext:Column DataIndex="personID" Header="ID" Width="100">
</ext:Column>
<ext:Column ColumnID="columnStatus" DataIndex=" description " Header="Status" Width="130">
<Renderer Handler="return imgRenderer(value);" />
</ext:Column>
</Columns>
</ColumnModel>
<SelectionModel>
<ext:RowSelectionModel ID="RowSelectionModel1" runat="server" SingleSelect="false"/>
</SelectionModel>
</ext:GridPanel>
Botão apagar:
<ext:Panel runat="server" ID="panel" Height="0">
<TopBar>
<ext:Toolbar runat="server">
<Items>
<ext:Button ID="btnClearSelection" runat="server" Text="Delete" OnDirectClick="btnClearSelection_Clicked" Icon="Delete">
<Listeners>
<Click Handler="Delete(#{grid});" />
</Listeners>
</ext:Button>
</Items>
</ext:Toolbar>
</TopBar>
</ext:Panel>
Função de apagar:
function Delete(grid) {
alert("testing button clicked");
for (var i = 0; i < grid.store.totalLength; i++ ) {
var status = grid.store.getAt(i).data["columnStatus"];
if (status == "2"){
grid.getSelectionModel().selectRow(i ,true);
}
grid.deleteSelected();
}
}
Aqui é o imgrender função no caso, é relevante para o problema:
function imgRenderer(value) {
if (value == "1") {
return value + " "
+ "<img src='/img/flag_green.png' id='1' class='Icon' />";
}
else if (value == "2") {
return value + " "
+ "<img src='/img/flag_red.png' id='2' class='Icon' />";
}
else if (value == "3") {
return value + " "
+ "<img src='/img/flag_orange.png' id='3' class='Icon'/>";
}
else if (value == "4") {
return value + " "
+ "<img src='/img/flag_green.png' id='4' class='Icon' />";
}
}
Editar:Eu corri usando o firebug e eu recebo um erro:grelha.store.getAt(i) é indefinido
Solução
function Delete(grid) {
var i = 0;
if (grid.store.getCount() > 0) {
for (i = grid.store.getCount() - 1; i >= 0; i--) {
var status = grid.store.getAt(i).data["description"];
if (status == "2" || status == "3" || status == "4") {
grid.store.removeAt(i);
}
}
}
}
Outras dicas
Você já tentou utilizar o removeAt() o método na loja?
function Delete(grid) {
alert("testing button clicked");
if (grid.store.count() > 0) {
for (var i = grid.store.count(); i >= 0; i--) {
var status = grid.store.getAt(i).data["columnStatus"];
if (status == "2"){
grid.store.removeAt(i);
}
}
}
}
Licenciado em: CC-BY-SA com atribuição
Não afiliado a StackOverflow