Sep 04, 2014, 11:19 AM
[CLOSED] Grid Filter disable in edit mode
Hi,
We are not able to disable the Grid Filter while click of Edit button in a Grid. Below is the sample to reproduce the same.
Please guide us to the solution!
We are not able to disable the Grid Filter while click of Edit button in a Grid. Below is the sample to reproduce the same.
<%@ Page Language="C#" %>
<%@ Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html>
<script runat="server">
private class Data
{
private int _id = 0;
public int ID { get { return _id; } set { this._id = value; } }
public string Name { get; set; }
public string Description { get; set; }
}
private void BindData(List<Data> datalist)
{
//Actually data retrive from database only, for this sample i used datalist
storeGrid.DataSource = datalist;
storeGrid.DataBind();
}
int maxID = 0;
protected void storeGrid_BeforeChanged(object sender, BeforeStoreChangedEventArgs e)
{
List<Data> savedData = new List<Data>();
string json = e.DataHandler.JsonData;
StoreDataHandler dataHandler = new StoreDataHandler(json);
List<Data> dataContainer = dataHandler.ObjectData<Data>();
maxID = 1;
foreach (Data data in dataContainer)
{
if (e.Action == StoreAction.Create)
{
data.ID = maxID;
//Call Save Method to save the data
//For this sample i used a temporary list to add object to the list. This list is used to rebind the grid.
savedData.Add(data);
maxID++;
}
}
//For this sample i passed temporary list
BindData(savedData);
this.ResourceManager1.AddScript("editMode = false;");
}
protected void storeGrid_AfterRecordInserted(object sender, AfterRecordInsertedEventArgs e)
{
e.Keys.Add("ID", maxID);
}
protected void RowSelection(object sender, DirectEventArgs e)
{
string JSONValue = e.ExtraParams["Values"].ToString();
var dataObject = JSON.Deserialize<List<Data>>(JSONValue);
int idValue = 0;
if (dataObject != null && dataObject.Count > 0)
idValue = Convert.ToInt32(dataObject[0].ID);
}
</script>
<html xmlns="http://www.w3.org/1999/xhtml">
<head id="Head1" runat="server">
<title></title>
</head>
<body>
<form id="form1" runat="server">
<ext:ResourceManager ID="ResourceManager1" runat="server" Namespace="Sample" />
<div>
<ext:GridPanel ID="gridpanel" runat="server" Border="false"
Width="500" Height="400">
<Store>
<ext:Store ID="storeGrid" runat="server" IgnoreExtraFields="true" OnBeforeStoreChanged="storeGrid_BeforeChanged" OnAfterRecordInserted="storeGrid_AfterRecordInserted">
<Model>
<ext:Model ID="Model1" runat="server" IDProperty="ID">
<Fields>
<ext:ModelField Name="ID" />
<ext:ModelField Name="Name" />
<ext:ModelField Name="Description" />
</Fields>
</ext:Model>
</Model>
<Listeners>
<Write Handler="Ext.Msg.alert('Write', 'The data successfully saved');" />
</Listeners>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModel2" runat="server">
<Columns>
<ext:Column ID="Name" ColumnID="Name" runat="server" DataIndex="Name" Text="Name" Width="150">
<PrepareCommand Args="grid,command,record,row,col,value" FormatHandler="False" Handler="" />
<Editor>
<ext:TextField ID="txtName" runat="server" StyleSpec="text-transform:uppercase;"
MaxLength="50" EnableKeyEvents="true">
<Listeners>
<Show Handler="this.focus.defer(50, this);" />
<KeyUp Handler="if (e.keyCode >= 65 && e.keyCode <= 90) this.setValue(this.getValue().toUpperCase());" />
</Listeners>
</ext:TextField>
</Editor>
</ext:Column>
<ext:Column ID="Description" ColumnID="Description" runat="server" DataIndex="Description" Text="Description" Width="250">
<PrepareCommand Args="grid,command,record,row,col,value" FormatHandler="False" Handler="" />
<Editor>
<ext:TriggerField ID="txtDesc" runat="server" StyleSpec="text-transform:uppercase;"
MaxLength="50" EnableKeyEvents="true" TriggerIcon="Search">
<Listeners>
<Show Handler="this.focus.defer(50, this);" />
<KeyUp Handler="if (e.keyCode >= 65 && e.keyCode <= 90) this.setValue(this.getValue().toUpperCase());" />
</Listeners>
</ext:TriggerField>
</Editor>
</ext:Column>
<ext:Column ID="ID" ColumnID="ID" runat="server" DataIndex="ID">
</ext:Column>
</Columns>
</ColumnModel>
<Features>
<ext:GridFilters runat="server">
<Filters>
<ext:StringFilter DataIndex="Name">
</ext:StringFilter>
<ext:StringFilter DataIndex="Description">
</ext:StringFilter>
</Filters>
</ext:GridFilters>
</Features>
<Plugins>
<ext:CellEditing ID="CellEditing1" runat="server">
</ext:CellEditing>
</Plugins>
<SelectionModel>
<ext:CheckboxSelectionModel ID="CheckboxSelectionModel1" Mode="Single" runat="server">
<Listeners>
<BeforeSelect Fn="ValidRow">
</BeforeSelect>
</Listeners>
<DirectEvents>
<Select OnEvent="RowSelection" ShowWarningOnFailure="false" Timeout="120000" Single="false">
<ExtraParams>
<ext:Parameter Name="Values" Value="Ext.encode(#{gridpanel}.getRowsValues({selectedOnly: true, visibleOnly: false, dirtyRowsOnly: false, currentPageOnly: true}))"
Mode="Raw" />
</ExtraParams>
</Select>
</DirectEvents>
</ext:CheckboxSelectionModel>
</SelectionModel>
<Buttons>
<ext:Button ID="btn_add1" runat="server" AutoPostBack="false" Text="Add Row">
<Listeners>
<Click Delay="1" Handler="newRow();" />
</Listeners>
</ext:Button>
<ext:Button ID="btn_save1" runat="server" AutoPostBack="false" Text="Save">
<Listeners>
<Click Delay="1" Handler="#{storeGrid}.sync();" />
</Listeners>
</ext:Button>
<ext:Button ID="Btn_Edit" runat="server" Text="Edit">
<Listeners>
<Click Handler="EnableDisableFilters();"></Click>
</Listeners>
</ext:Button>
<ext:Button ID="Btn_Cancel1" runat="server" Text="Cancel">
</ext:Button>
</Buttons>
</ext:GridPanel>
</div>
</form>
<script>
var editMode = false;
var alert = '';
function ValidRow() {
return !editMode;
}
function newRow() {
editMode = true;
var rowIndex = Sample.gridpanel.store.getCount();
Sample.gridpanel.store.insert(rowIndex, {});
}
function EnableDisableFilters() {
var i;
for (i = 1; i < Sample.gridpanel.columns.length; i++) {
Sample.gridpanel.columns[i].sortable = false;
Sample.gridpanel.columns[i].menuDisabled = true;
}
}
</script>
</body>
</html>
The below mentioned code which is used to disable the Grid Filter, works fine in 1x version but not in 2x version.
function EnableDisableFilters() {
var i;
for (i = 1; i < Sample.gridpanel.columns.length; i++) {
Sample.gridpanel.columns[i].sortable = false;
Sample.gridpanel.columns[i].menuDisabled = true;
}
}
var i;
for (i = 1; i < Sample.gridpanel.columns.length; i++) {
Sample.gridpanel.columns[i].sortable = false;
Sample.gridpanel.columns[i].menuDisabled = true;
}
}
Last edited by Daniil; Sep 16, 2014 at 10:53 AM.
Reason: [CLOSED]