In Ext.Net while using Filters item under ext:GridFilters
I am getting Filters is not supported under ext:GridFilters. Please suggest how to resolve this issue
Aspx Page
<%# Page Language="C#" %>
<%# Import Namespace="System.Collections.ObjectModel" %>
<%# Import Namespace="System.Collections.Generic" %>
<%# Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<script runat="server">
protected void Page_Load(object sender, EventArgs e)
{
if (!X.IsAjaxRequest)
{
this.Store1.DataSource = FiltersTestData.Data;
this.Store1.DataBind();
}
}
protected void SetFilter(object sender, DirectEventArgs e)
{
StringFilter sf = (StringFilter)GridFilters1.Filters[1];
sf.SetValue("xyz");
sf.SetActive(true);
}
</script>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>GridPanel with Local Filtering, Sorting and Paging - Ext.NET Examples</title>
<link href="../../../../resources/css/examples.css" rel="stylesheet" type="text/css" />
</head>
<body>
<ext:ResourceManager runat="server" DirectEventUrl="default.aspx" />
<h1>GridPanel with Local Filtering, Sorting and Paging</h1>
<p>Please see column header menu for apllying filters</p>
<ext:Store runat="server" ID="Store1">
<Reader>
<ext:JsonReader IDProperty="StudentNo">
<Fields>
<ext:RecordField Name="StudentNo" Type="Int" />
<ext:RecordField Name="StudentName" Type="String" />
<ext:RecordField Name="StudentSurname" Type="String" />
</Fields>
</ext:JsonReader>
</Reader>
<SortInfo Field="StudentSurname" Direction="ASC" />
</ext:Store>
<ext:Window
ID="Window1"
runat="server"
Width="700"
Height="400"
Closable="false"
Collapsible="true"
Title="Example"
Maximizable="true"
Layout="Fit">
<Items>
<ext:GridPanel runat="server" ID="GridPanel1" Border="false" StoreID="Store1">
<ColumnModel runat="server">
<Columns>
<ext:Column Header="StudentNo" DataIndex="StudentNo" />
<ext:Column Header="StudentName" DataIndex="StudentName" />
<ext:Column Header="StudentSurname" DataIndex="StudentSurname" />
</Columns>
</ColumnModel>
<LoadMask ShowMask="true" />
<Plugins>
<ext:GridFilters runat="server" ID="GridFilters1" Local="true">
<Filters>
<ext:NumericFilter DataIndex="StudentNo" />
<ext:StringFilter DataIndex="StudentName" />
<ext:StringFilter DataIndex="StudentSurname" />
</Filters>
</ext:GridFilters>
</Plugins>
<BottomBar>
<ext:PagingToolbar ID="PagingToolBar1" runat="server" PageSize="10">
<Items>
<ext:ToolbarSeparator runat="server" />
<ext:Button runat="server" Text="Find 'xyz'">
<DirectEvents>
<Click OnEvent="SetFilter" />
</DirectEvents>
</ext:Button>
</Items>
</ext:PagingToolbar>
</BottomBar>
</ext:GridPanel>
</Items>
</ext:Window>
</body>
</html>
cs page:
using System;
using System.Collections.Generic;
public class FiltersTestData
{
public static List<object> Data
{
get
{
var StudentInfo = new List<object>
{
new
{
StudentNo = 1,
StudentName = "xy",
StudentSurname = "xyz"
},
new
{
StudentNo = 2,
StudentName = "AB",
StudentSurname = "ABC"
},
new
{
StudentNo = 3,
StudentName = "pq",
StudentSurname = "pqr"
}
};
return StudentInfo;
}
}
}
please try this code.
this solution works fine for me:
<ext:GridPanel ID="GridPanelDatiAssociati" runat="server" Title="Dati associati" Stateful="true">
<Store>
<ext:Store ID="StoreDatiAssociati" runat="server" PageSize="6">
<Model>
<ext:Model ID="ModelDatiAssociati" runat="server" IDProperty="ID">
<Fields>
<ext:ModelField Name="ID" />
<ext:ModelField Name="PARAMETRO" />
<ext:ModelField Name="DESCRIZIONE" />
<ext:ModelField Name="UNITA" />
<ext:ModelField Name="VALORE" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<ColumnModel ID="ColumnModelDatiAssociati" runat="server">
<Columns>
<ext:Column ID="ColumnID_DATI_ASSOCIATI" runat="server" Text="ID" DataIndex="ID" Width="100" Hidden = "true" >
</ext:Column>
<ext:Column ID="ColumnPARAMETRO" runat="server" Width="100" Text="Parametro" DataIndex="PARAMETRO">
<Filter>
<ext:StringFilter />
</Filter>
</ext:Column>
<ext:Column ID="ColumnUNITA" runat="server" Width="170" Text="Unità " DataIndex="UNITA">
<Filter>
<ext:DateFilter>
<DatePickerOptions runat="server" TodayText="Now" />
</ext:DateFilter>
</Filter>
</ext:Column>
<ext:Column ID="ColumnVALORE" runat="server" Width="170" Text="Valore" DataIndex="VALORE">
<Filter>
<ext:DateFilter>
<DatePickerOptions runat="server" TodayText="Now" />
</ext:DateFilter>
</Filter>
</ext:Column>
</Columns>
</ColumnModel>
<Plugins>
<ext:GridFilters ID="GridFiltersDatiAssociati" runat="server">
</ext:GridFilters>
</Plugins>
</ext:GridPanel>
Related
Using Ext.NET combobox.
<ext:ComboBox runat="server"
ID="ComboBoxCategorizedList"
QueryMode="Local"
ValueField="Id"
EmptyText="Type to begin search..."
TypeAhead="false"
DisplayField="Name"
Width="500"
NoteAlign="Down" EnableKeyEvents="true"
Note="Press 'Search' icon or Press ENTER for more results"
RemoveClearTrigger="true">
<%--Note="Type '*' for a full list"--%>
<HtmlBin>
<ext:XScript runat="server">
<script type="text/javascript">
$(window).on("__refresh__", function () {
#{ StoreComboBoxCategorizedList }.reload();
});
</script>
</ext:XScript>
</HtmlBin>
<Store>
<ext:Store runat="server" ID="StoreComboBoxCategorizedList" OnReadData="ComboBoxCategorizedList_ReadData">
<Proxy>
<ext:PageProxy />
</Proxy>
<Model>
<ext:Model Id="ModelCategorizedComboBox" runat="server" IDProperty="Id">
<Fields>
<ext:ModelField Name="Id" />
<ext:ModelField Name="Name" />
<ext:ModelField Name="Type" />
<ext:ModelField Name="RefId" />
<ext:ModelField Name="Description" />
</Fields>
</ext:Model>
</Model>
<Listeners>
<Update Handler="#{ComboBoxCategorizedList}.expand();" />
<EndUpdate Handler="categorizedList();" />
</Listeners>
<Parameters>
<ext:StoreParameter Mode="Raw" Name="filter" Value="#{ComboBoxCategorizedList}.getValue()" />
</Parameters>
</ext:Store>
</Store>
<Triggers>
<ext:FieldTrigger Icon="Clear"/>
<ext:FieldTrigger Icon="Search"></ext:FieldTrigger>
</Triggers>
<Listeners>
<SpecialKey Fn="enterKeyPressHandler" />
<Expand Handler="categorizedList();" Delay="100" />
<BeforeSelect Fn="onBeforeSelect" />
<KeyPress Handler="#{ComboBoxCategorizedList}.getTrigger(1).onClick();" Buffer="1000" />
<Change Handler="filterComboxBoxFunction(#{StoreComboBoxCategorizedList}, #{ComboBoxCategorizedList}.getValue()); #{ComboBoxCategorizedList}.expand(); categorizedList();" Delay="100" />
</Listeners>
Not asking for debugging help, but I want to know if an Ext.NET or Extjs dev has a generic solution: Very simply ... I want to initiate a remote search only when the local search returns no records. So I am looking for the best way to wire this up to the combobox. I've looked at using the Expand event and BeforeQuery event but this seems to come up short.
I'm looking for best practices so i can add a "OnLocalQuery" event to my comboboxes; and then take action if the local query returns 0 matches.
I use this function and it works fine .. and without QueryMode="Local":
<ext:ComboBox ID="cmb_name" runat="server" FieldLabel="ComboBox" EmptyText="-Select-" HideTrigger="true" TriggerAction="All" SelectOnFocus="true" DisplayField="Name" ValueField="Id" Editable="true" TabIndex="11">
<Store>
<ext:Store ID="str_ComboBox" runat="server" PageSize="10">
<Model>
<ext:Model ID="mdl_ComboBox" runat="server">
<Fields>
<ext:ModelField Name="Id" />
<ext:ModelField Name="Name" />
<ext:ModelField Name="Type" />
<ext:ModelField Name="RefId" />
<ext:ModelField Name="Description" />
</Fields>
</ext:Model>
</Model>
</ext:Store>
</Store>
<Listeners>
<Change Fn="fn_filter" />
</Listeners>
</ext:ComboBox>
<script type="text/javascript">
var fn_filter = function (_this, newValue, oldValue, eOpts) {
var n = 0;
if (_this.lastQuery == undefined || _this.lastQuery == null) {
_this.lastQuery = "";
}
_this.getStore().clearFilter(true);
_this.getStore().load();
_this.store.filter(function (item) {
if (item.get('Name').includes(_this.getRawValue())) {
n = n + 1;
return true;
}
else {
return false;
}
});
_this.expand();
if (n == 0) {
//returns no records
//enter code here Callback
}
}
</script>
Good day
I have made a new Grid to show data from INTran(PX.Objects.IN.INTran)
I see there is a LotSerialNbr in the INTran DAC. But when I make a new PXSelect I don't see it in the "ADD DATA FIELDS" on my page.
I add the Lot/Serial Nbr(LotSerialNbr) when loading stock on the Inventory Receipts.
I have also checked INRegister and INTranSplit both not show the Lot Serial Nbr?
using System;
using PX.Data;
using PX.Objects.IN;
using PX.Objects.SO;
namespace Test
{
public class StockTransfer : PXGraph<StockTransfer>
{
public PXSave<MasterTable> Save;
public PXCancel<MasterTable> Cancel;
public PXFilter<MasterTable > MasterView;
public PXFilter<INTran> DetailsView;
[Serializable]
public class MasterTable : IBqlTable
{
}
[Serializable]
public class DetailsTable : IBqlTable
{
}
public PXSelect<INRegister> Register;
public PXSelect<INTran> INTran;
public PXSelect<INTranSplit > INTranSplit ;
}
}
How can I get the Lot Serial number to show on the grid?
edit here is the ASPX:
<%# Page Language="C#" MasterPageFile="~/MasterPages/FormDetail.master" AutoEventWireup="true" ValidateRequest="false" CodeFile="ABIT1111.aspx.cs" Inherits="Page_ABIT1111" Title="Untitled Page" %>
<%# MasterType VirtualPath="~/MasterPages/FormDetail.master" %>
<asp:Content ID="cont1" ContentPlaceHolderID="phDS" Runat="Server">
<px:PXDataSource ID="ds" runat="server" Visible="True" Width="100%"
TypeName="JVDLocationTransfer.TransferGrap"
PrimaryView="MasterView"
>
<CallbackCommands>
</CallbackCommands>
</px:PXDataSource>
</asp:Content>
<asp:Content ID="cont2" ContentPlaceHolderID="phF" Runat="Server">
<px:PXFormView ID="form" runat="server" DataSourceID="ds" DataMember="MasterView" Width="100%" Height="100px" AllowAutoHide="false">
<Template>
<px:PXLayoutRule ID="PXLayoutRule1" runat="server" StartRow="True"></px:PXLayoutRule>
<px:PXTextEdit runat="server" ID="CstPXTextEdit1" DataField="UsrFROMLocation" />
<px:PXTextEdit runat="server" ID="CstPXTextEdit2" DataField="UsrInventoryID" />
<px:PXTextEdit runat="server" ID="CstPXTextEdit3" DataField="UsrInventoryItemDescription" />
<px:PXTextEdit runat="server" ID="CstPXTextEdit4" DataField="UsrQty" />
<px:PXTextEdit runat="server" ID="CstPXTextEdit5" DataField="UsrReasonCode" />
<px:PXTextEdit runat="server" ID="CstPXTextEdit6" DataField="UsrSKU" />
<px:PXTextEdit runat="server" ID="CstPXTextEdit7" DataField="UsrUOM" /></Template>
</px:PXFormView>
</asp:Content>
<asp:Content ID="cont3" ContentPlaceHolderID="phG" Runat="Server">
<px:PXGrid ID="grid" runat="server" DataSourceID="ds" Width="100%" Height="150px" SkinID="Details" AllowAutoHide="false">
<Levels>
<px:PXGridLevel DataMember="INTran">
<Columns>
<px:PXGridColumn DataField="InventoryID" Width="70" />
<px:PXGridColumn DataField="LotSerialNbr" ></px:PXGridColumn></Columns>
</px:PXGridLevel>
</Levels>
<AutoSize Container="Window" Enabled="True" MinHeight="150" />
<ActionBar >
</ActionBar>
</px:PXGrid>
</asp:Content>
The screen graph JVDLocationTransfer.TransferGrap declared in ASPX doesn't match the target StockTransfer graph. Also inexistent columns are declared on dataview like MasterView which points to empty DACs like MasterTable. Wizards functionality such as Add Data Field won't work properly in that context.
I would like to change panel width size from javascript.
Here my code but don't work:
Javascript code:
<script type="text/javascript">
var ExtraExpandMAP = function (pannello) {
pannello.setWidth = 920;
};
</script>
Asp.Net code:
<ext:Panel ID="PanelLazyMAP" runat="server"
Region="East"
Width="460"
Title="Mappa"
Layout="Fit"
Floatable="false"
Resizable="true"
Collapsed="true"
Collapsible="true"
AutoScroll="false"
BodyStyle="background-color:#ffffff;"
MarginSpec="84 0 0 0" AnimCollapse ="false">
<HeaderConfig>
<Items>
<ext:Button ID="btnExpandExtraMAP" runat="server" Icon="RewindGreen">
<Listeners>
<Click Handler="ExtraExpandMAP(#{PanelLazyMAP});">
</Click>
</Listeners>
</ext:Button>
</Items>
</HeaderConfig>
</ext:Panel>
The problem is:
pannello.setWidth = 920;
instead of:
pannello.setWidth(920);
I have a grid panel which display two TimeSpans in two columns and all is well when I load the page but when I go server side the validation on my editors always fail. I don't understand why the store can display the TimeSpans but cannot return it after...
Here my code :
<ext:GridPanel ID="WeekParams" runat="server" >
<Store>
<ext:Store runat="server">
<Reader>
<ext:JsonReader IDProperty="GUID">
<Fields>
<ext:RecordField Name="Day" Type="String" />
<ext:RecordField Name="UATNumber" Type="int" />
<ext:RecordField Name="From" Type="Date" />
<ext:RecordField Name="To" Type="Date" />
</Fields>
</ext:JsonReader>
</Reader>
</ext:Store>
</Store>
<ColumnModel>
<Columns>
<ext:Column ColumnID="Day" DataIndex="Day" />
<ext:NumberColumn ColumnID="UATNumber" DataIndex="UATNumber" Format="0" />
<ext:DateColumn ColumnID="From" DataIndex="From" Format="dd/MM/yyyy" >
<Renderer Format="Date" FormatArgs="'HH:mm'" />
<Editor>
<ext:TimeField runat="server" />
</Editor>
</ext:DateColumn>
<ext:DateColumn ColumnID="To" DataIndex="To" Format="dd/MM/yyyy" >
<Renderer Format="Date" FormatArgs="'HH:mm'" />
<Editor>
<ext:TimeField runat="server" />
</Editor>
</ext:DateColumn>
</Columns>
</ColumnModel>
<Plugins>
<ext:EditableGrid runat="server" />
</Plugins>
</ext:GridPanel>
And here the result when I'm going to the server side :
I'm gonna create an Ext.Net's TreeGrid with custom nodes.
e.g :
All of TreeGrid's nodes should have a textbox at the front of itself and users should write a number at it.
See the below image :
Also, I have to get each nodes' textbox values in code behind at postback.
Could you please guide me, how I can create it with Ext.net and C# ?
Thanks.
Unfortunately, implementing these features with the current release of <ext:TreeGrid> in Ext.NET (v1.x) is annoyingly difficult. The <ext:TreeGrid> is just not setup for this type of rendering.
There's help coming in the next Ext.NET release (v2), although at this point it has not been released.
Here's a basic sample to help get you started with rendering the <input> fields.
Example
<%# Page Language="C#" %>
<%# Register Assembly="Ext.Net" Namespace="Ext.Net" TagPrefix="ext" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>TreeGrid - Ext.NET Examples</title>
<link href="../../../../resources/css/examples.css" rel="stylesheet" type="text/css" />
<script type="text/javascript">
var formatHours = function (v) {
if (v || v === 0) {
return "Number : <input class=\"x-form-text x-form-field\" type=\"text\" value=\"" + v + "\" />";
}
return "";
};
</script>
</head>
<body>
<form runat="server">
<ext:ResourceManager runat="server" />
<ext:TreeGrid
ID="TreeGrid1"
runat="server"
Title="Projects"
Width="500"
Height="300"
NoLeafIcon="true"
EnableDD="true">
<Columns>
<ext:TreeGridColumn Header="Task" Width="230" DataIndex="task" />
<ext:TreeGridColumn Header="Score" Width="200" DataIndex="duration" Align="Center" SortType="AsFloat">
<XTemplate runat="server">
<Html>
{duration:this.formatHours}
</Html>
<Functions>
<ext:JFunction Name="formatHours" Fn="formatHours" />
</Functions>
</XTemplate>
</ext:TreeGridColumn>
</Columns>
<Root>
<ext:TreeNode Text="Tasks">
<Nodes>
<ext:TreeNode Icon="Folder" Expanded="true">
<CustomAttributes>
<ext:ConfigItem Name="task" Value="Project: Shopping" Mode="Value" />
</CustomAttributes>
<Nodes>
<ext:TreeNode Icon="Folder" Expanded="true">
<CustomAttributes>
<ext:ConfigItem Name="task" Value="Remodeling" Mode="Value" />
</CustomAttributes>
<Nodes>
<ext:TreeNode Icon="Folder">
<CustomAttributes>
<ext:ConfigItem Name="task" Value="Paint bedroom" Mode="Value" />
</CustomAttributes>
<Nodes>
<ext:TreeNode Leaf="true">
<CustomAttributes>
<ext:ConfigItem Name="task" Value="Ceiling" Mode="Value" />
<ext:ConfigItem Name="duration" Value="1.25" />
</CustomAttributes>
</ext:TreeNode>
<ext:TreeNode Leaf="true">
<CustomAttributes>
<ext:ConfigItem Name="task" Value="Walls" Mode="Value" />
<ext:ConfigItem Name="duration" Value="1.5" />
</CustomAttributes>
</ext:TreeNode>
</Nodes>
</ext:TreeNode>
<ext:TreeNode Leaf="true">
<CustomAttributes>
<ext:ConfigItem Name="task" Value="Decorate living room" Mode="Value" />
<ext:ConfigItem Name="duration" Value="12" />
</CustomAttributes>
</ext:TreeNode>
<ext:TreeNode Leaf="true">
<CustomAttributes>
<ext:ConfigItem Name="task" Value="Fix lights" Mode="Value" />
<ext:ConfigItem Name="duration" Value="0" />
</CustomAttributes>
</ext:TreeNode>
<ext:TreeNode Leaf="true">
<CustomAttributes>
<ext:ConfigItem Name="task" Value="Reattach screen door" Mode="Value" />
<ext:ConfigItem Name="duration" Value="142" />
</CustomAttributes>
</ext:TreeNode>
<ext:TreeNode Leaf="true">
<CustomAttributes>
<ext:ConfigItem Name="task" Value="Retile kitchen" Mode="Value" />
<ext:ConfigItem Name="duration" Value="96" />
</CustomAttributes>
</ext:TreeNode>
</Nodes>
</ext:TreeNode>
</Nodes>
</ext:TreeNode>
</Nodes>
</ext:TreeNode>
</Root>
</ext:TreeGrid>
</form>
</body>
</html>
I could found the answer :
<ext:TreeGrid ID="KnowledgeFieldsTreeGridWithTextBox1" runat="server" Title="Fileds "
Icon="Plugin" Height="300" AutoHeight="true" AutoExpandColumn="KnowledgeFiled">
<TopBar>
<ext:Toolbar ID="KnowledgeFieldsTreeGridWithTextBoxToolbar1" runat="server">
<Items>
<ext:ToolbarFill ID="KnowledgeFieldsTreeGridWithTextBoxToolbarFill1" runat="server" />
<ext:ToolbarTextItem ID="KnowledgeFieldsTreeGridWithTextBoxTextItem1" runat="server"
Text=" Filter : " />
<ext:TriggerField ID="KnowledgeFieldsTreeGridWithTextBox_TriggerField1" runat="server" EnableKeyEvents="true">
<Triggers>
<ext:FieldTrigger Icon="Clear" />
</Triggers>
<Listeners>
<KeyUp Fn="KnowledgeFieldsTreeGridWithTextBox_KeyUp" Buffer="250" />
<TriggerClick Fn="KnowledgeFieldsTreeGridWithTextBox_ClearFilter" />
</Listeners>
</ext:TriggerField>
</Items>
</ext:Toolbar>
</TopBar>
<Columns>
<ext:TreeGridColumn Header="Filed Name" DataIndex="KnowledgeFiledName" Width="100" Align="Center" />
<ext:TreeGridColumn Header="Score" DataIndex="KnowledgeScore" Width="200" Align="Right">
<XTemplate runat="server">
<Html>
<tpl if="values.leaf">
<input type="text" style="width:30px; text-align:left;" maxlength="5" value="{KnowledgeFiledScore}"></input>
</tpl>
</Html>
</XTemplate>
</ext:TreeGridColumn>
</Columns>
<Root>
</Root>
<Listeners>
<BeforeClick Handler="return !Ext.fly(e.getTarget()).is('input[type=text]');" />
</Listeners>
</ext:TreeGrid>