RadToolBar: How to filter with a RadSearchBox on a Grid?

[Jesus]

Hi, I hope you can help me solve this question. How can I filter in RadSearchBox to find the data in the grid and later the data that is relevant in the search will be displayed? I have looked for examples but I do not understand well how they work, I hope you can explain me.

This is my code

<telerik:RadToolBar ID="rtlbMenuPrincipal" runat="server" Height="32" Width="100%" OnClientButtonClicking="validarrtlbMenuPrincipal" AutoPostBack="true">
            <Items>
                <telerik:RadToolBarButton Enabled="true" Value="1" ImageUrl="Imagenes/Botoneras/New.png" ToolTip="Nuevo" />
                <telerik:RadToolBarButton Enabled="true" Value="2" ImageUrl="Imagenes/Botoneras/Edit.png" ToolTip="Editar" />
                <telerik:RadToolBarButton Enabled="true" Value="3" ImageUrl="Imagenes/Desarrollador/Print - 01.png" ToolTip="Imprimir" />
                <telerik:RadToolBarButton Enabled="true" Value="4" ImageUrl="Imagenes/Desarrollador/Mail.png" ToolTip="Enviar a Prueba" />
                <telerik:RadToolBarButton Enabled="true" Value="5" ImageUrl="Imagenes/Desarrollador/Lock.png" ToolTip="Cerrar prueba" />

                <telerik:RadToolBarButton runat="server" Enabled="true">
                    <ItemTemplate>
                        <telerik:RadSearchBox runat="server" ID="RadSearch" Filter="Contains" Width="20%" EmptyMessage="Search" CssClass="Caja"
                            DataValueField="IdPrueba"
                            DataTextField="PruebaTitulo"
                            DataSourceID="SqlDataSource1"   >
                            <DropDownSettings Height="400" Width="300" />
                        </telerik:RadSearchBox>
                    </ItemTemplate>
                </telerik:RadToolBarButton>
            </Items>
        </telerik:RadToolBar>

        <asp:SqlDataSource ID="SqlDataSource1" runat="server"
    ConnectionString="<%$ ConnectionStrings:dbProcesoDesarrolloConnectionString %>"
    SelectCommand="SELECT * FROM [P_Pruebas]">
</asp:SqlDataSource>

        <telerik:RadGrid ID="rgrdPruebaDesarrolladores" runat="server" AutoGenerateColumns="false" AllowPaging="true" PageSize="10" data-grupovalidar="gPruebaDesarrollador" data-tipovalidador="rgrdselmult" datgridDataSourcea-msgvalidar="Seleccione un Sistema" data-nombrecampo="Seleccione un Sistema" data-placement="left">
            <MasterTableView DataKeyNames="IdPrueba">
                <Columns>
                    <telerik:GridBoundColumn AutoPostBackOnFilter="True"  DataField="Nombre_Sistema" HeaderStyle-HorizontalAlign="Center" HeaderText="Sistema"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn AutoPostBackOnFilter="True" DataField="PruebaTitulo" HeaderStyle-HorizontalAlign="Center" HeaderText="Titulo"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn AutoPostBackOnFilter="True"  DataField="Nombre" HeaderStyle-HorizontalAlign="Center" HeaderText="Responsable"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn AutoPostBackOnFilter="True" DataField="FechaPrueba" HeaderStyle-HorizontalAlign="Center" HeaderText="Fecha"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn AutoPostBackOnFilter="True"  DataField="PruebaModalidad" HeaderStyle-HorizontalAlign="Center" HeaderText="Tipo Modalidad"></telerik:GridBoundColumn>
                    <telerik:GridBoundColumn AutoPostBackOnFilter="True" DataField="PruebaStatus" HeaderStyle-HorizontalAlign="Center" HeaderText="Status"></telerik:GridBoundColumn>
                </Columns>
            </MasterTableView>
            <ClientSettings>
                <Selecting AllowRowSelect="True"></Selecting>
                <Scrolling AllowScroll="true" UseStaticHeaders="true" ScrollHeight="345px" />
            </ClientSettings>
            <PagerStyle AlwaysVisible="true" Mode="Slider" />
        </telerik:RadGrid>

        <asp:SqlDataSource ID="gridDataSource" runat="server" connectionString="Data Source=JJVICTORIO;Initial Catalog=dbProcesoDesarrollo;Integrated Security=True"
           SelectCommand="SELECT TOP 10 [IdPrueba], [PruebaTitulo] FROM [P_Pruebas]"></asp:SqlDataSource>

 

Protected Sub RadSearch_Search(sender As Object, e As SearchBoxEventArgs)
        Dim searchBox As RadSearchBox = DirectCast(sender, RadSearchBox)
        Dim IdPrueba As String = String.Empty

        If e.DataItem IsNot Nothing Then
            IdPrueba = DirectCast(e.DataItem, Dictionary(Of String, Object))("IdPrueba").ToString()

            If Not String.IsNullOrEmpty(IdPrueba) Then
                'rgrdPruebaDesarrolladores.MasterTableView.Rebind()
                Dim likeCondition As String = If(searchBox.Filter = SearchBoxFilter.Contains, "'%'", "")
                gridDataSource.SelectParameters.Clear()
                gridDataSource.SelectParameters.Add("IdPrueba", (CType(e.DataItem, Dictionary(Of String, Object)))("IdPrueba").ToString())
                gridDataSource.SelectCommand = "SELECT TOP 1 [Nombre_Sistema], [PruebaTitulo], [Nombre], [FechaPrueba], [PruebaModalidad], [PruebaStatus]  FROM [P_Pruebas] WHERE [IdPrueba] LIKE " & likeCondition & " + @IdPrueba"
            End If
        End If
    End Sub

 


I wanted to do something similar to this example but I don't know if it can be done with Telerik

https://datatables.net/

[Attila Antal]

Hi,

Can you please elaborate on this scenario? 

The OnSearch event is an AJAX call (partial postback) and cannot be used to change the DataSource for the Grid. The OnSearch method is used to fetch data from the database which can be used to return Values back to the RadSearchBox results list.

Describe what you would like to achieve (from the user's perspective) and I will show you how that can be achieved.

Regards,
Attila Antal
Progress Telerik