Dear Sir,

I am trying to implement grid panel quick search.

My code is as follows. 

<ext:XScript ID="XScript123" runat="server">
        <script type="text/javascript">
                         
            var applyFilter = function (field) {                
                var store = #{grdStdWeekPlan}.getStore();
                
                store.suspendEvents();
                store.filterBy(getRecordFilter());                                
                store.resumeEvents();
                #{grdStdWeekPlan}.getView().refresh(false);                                              
            };
             
             var clearFilter = function () {
                #{txtsearchplanname}.reset();
                #{txtsearchplantype}.reset();
                
                #{Storeweekplan}.clearFilter();
            
            }

            var filterString = function (value, dataIndex, record) {
                var val = record.get(dataIndex);
                
                if (typeof val != "string") {
                    return value.length == 0;
                }
                
                return val.toLowerCase().indexOf(value.toLowerCase()) > -1;
            };
 
            var getRecordFilter = function () {
                var f = [];
 
                f.push({
                    filter: function (record) {                         
                        return filterString(#{txtsearchplanname}.getValue()||"", "PlanName", record);
                    }
                });
                 
                 f.push({
                    filter: function (record) {                         
                        return filterString(#{txtsearchplantype}.getValue(), "PlanType", record);
                    }
                });

                var len = f.length;
                 
                return function (record) {
                    for (var i = 0; i < len; i++) {
                        if (!f[i].filter(record)) {
                            return false;
                        }
                    }
                    return true;
                };
            };
        </script>
    </ext:XScript>



<ext:GridPanel ID="grdStdWeekPlan" runat="server" TrackMouseOver="false" Title="Standard Week Plans"
            Collapsible="true" Border="true" Width="784" Height="450">
            <ColumnModel ID="ColumnModel1" runat="server">
                <Columns>
                    <ext:Column Width="200" ColumnID="PlanName" Header="Plan Name" DataIndex="PlanName" />
                    <ext:Column Width="150" Header="PlanType" DataIndex="PlanType" />
                </Columns>
            </ColumnModel>
            <Store>
                <ext:Store ID="Storeweekplan" runat="server">
                    <Reader>
                        <ext:JsonReader IDProperty="StandardPlanID">
                            <Fields>
                                <ext:RecordField Name="StandardPlanID" />
                                <ext:RecordField Name="PlanName" />
                                <ext:RecordField Name="PlanType" />
                            </Fields>
                        </ext:JsonReader>
                    </Reader>
                </ext:Store>
            </Store>
           
            <SelectionModel>
                <ext:CheckboxSelectionModel ID="RowCheckboxselection1" runat="server" SingleSelect="true">
                </ext:CheckboxSelectionModel>
                
            </SelectionModel>
            
            <View>
                <ext:GridView ID="GridView1" runat="server" ForceFit="true">
                    <HeaderRows>
                        <ext:HeaderRow>
                            <Columns>
                                <ext:HeaderColumn>
                                </ext:HeaderColumn>
                               
                                <ext:HeaderColumn Cls="x-small-editor">
                                    <Component>
                                        <ext:TextField ID="txtsearchplanname" runat="server" EnableKeyEvents="true">
                                            <Listeners>
                                                <KeyUp Handler="applyFilter(this);" Buffer="250" />
                                            </Listeners>
                                        </ext:TextField>
                                    </Component>
                                </ext:HeaderColumn>
                                <ext:HeaderColumn Cls="x-small-editor">
                                    <Component>
                                        <ext:TextField ID="txtsearchplantype" runat="server" EnableKeyEvents="true">
                                            <Listeners>
                                                <KeyUp Handler="applyFilter(this);" Buffer="250" />
                                            </Listeners>
                                        </ext:TextField>
                                    </Component>
                                </ext:HeaderColumn>
                            </Columns>
                        </ext:HeaderRow>
                    </HeaderRows>
                    <%--<Listeners>
                        <BeforeRefresh Fn="clean" />
                    </Listeners>--%>
                </ext:GridView>
            </View>
           
        </ext:GridPanel>
this code is in usercontrol.
I tried without #{} in Xscript. but search is not working.

Thanks
Rupesh