Auto populate radGrid from search textbox

[Amanda]

I want to know if this is possible - I haven't seen anything out there yet.  I have a radTextBox in the header of my radGrid.  When the user enters a letter/number for the name I want the radGrid to autopopulate based upon what is entered in the search box - could be 1 - 7 letters.  Thanks for your help.

[Shinu]

Hello,


I hope you can make use of filtering feature in RadGrid to accomplish this. Enable the filtering and hide the GridFilteringItem. Now use the filter() method to filter the grid rows based in text typed in textbox.

The documentation would helpful to get started.
Filter template


-Shinu.

[Amanda]

Instead of using the RadComboBox - can I use radTextBox?

[Amanda]

Also, is there a way when using RadTextBox out of the radGrid - can I update the radGrid based on the search as the user inputs the search.

[Tsvetina]

Hello Amanda,

You can take a look at this Code Library article to see how grid can be filtered by an external textbox control:

Filter RadGrid on external textbox key press

Regards,
Tsvetina
the Telerik team

[Amanda]

Thank for this article - I am getting an error though.  Can you please help?  I am getting this error: Microsoft JScript runtime error: 'null' is null or not an object on this $find("<%= RadAjaxManager1.ClientID %>").ajaxRequest("FilterGrid");

radgrid - top portion.
 <telerik:RadGrid ID="RadGrid1" runat="server" OnItemDataBound="RadGrid1_ItemDataBound" OnNeedDataSource="RadGrid1_NeedDataSource" Skin="Web20"
            AllowFilteringByColumn="False" ShowFilterIcon="false" GridLines="Horizontal" >

<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server" OnAjaxRequest="RadAjaxManager1_AjaxRequest">
        <AjaxSettings>
            <telerik:AjaxSetting AjaxControlID="RadGrid1">
                <UpdatedControls>
                    <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                </UpdatedControls>
            </telerik:AjaxSetting>
            <telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
                    <UpdatedControls>
                        <telerik:AjaxUpdatedControl ControlID="RadGrid1" />
                    </UpdatedControls>
                </telerik:AjaxSetting>
        </AjaxSettings>
    </telerik:RadAjaxManager>

protected void RadAjaxManager1_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e)
    {
        if (e.Argument.IndexOf("FilterGrid") != -1)
        {
            RadGrid1.Rebind();
        }
    }

[Tsvetina]

Hi Amanda,

I cannot see an obvious reason why the $find() method cannot access the manager. Can you confirm if it is on the same page/user control as the grid? If the grid is in a user control or a content page and the RadAjaxManager control is on another one (the master page for example), you can try using the GetCurrent() method:

$find("<%= RadAjaxManager.GetCurrent(Page).ClientID %>").ajaxRequest("FilterGrid");

Greetings,
Tsvetina
the Telerik team

[Amanda]

Yes, it is on the same page - it is occurring when you type in the second letter in the search box. 

[Tsvetina]

Hello Amanda,

It is hard to determine the cause of the issue without having the relevant code. Would it be possible that you open a formal support ticket and send us a runnable project demonstrating the issue that you face, so we can debug it locally and provide you with a working solution faster?

Regards,
Tsvetina
the Telerik team