[Solved] How to Implement textbox in grid's toolbar

[Prashanth]

Hi

I have a requirement of adding a textbox on the toolbar of the Telerik Grid. This textbox i have to use for filtering a column . I am able to place the textbox but i am not able to do the filtering. Please see the attachment.The code i used to place the textbox is as follows

@{Html.Telerik().Grid(Model)
        .Name("Grid")
         .ToolBar(toolBar => toolBar.Template(
         @<text>
    <label class="firm-label" for="Firmname-input">
        Enter Firm names to filter:
    </label>
   
    <input type="text" id="filterText" class="text-label" for="Firmnametext-input" style="width :100px" onkeyup='test()'/>
       
        </text>))
        .HtmlAttributes(new { @style = "width:900;" })
        .Footer(true)
        .Sortable()
        .Groupable()
        .Filterable()
        .Selectable()
        .Columns(columns =>
        {
            columns.Bound(firm => firm.fmFirmId)
                .ClientTemplate("<input type='checkbox' name='checkedRecords' value='<#= fmFirmId #>'/>")
                .Title("").Width(36)
                .HtmlAttributes(new { style = "text-align:center" }).Filterable(false);

            columns.Bound(firm => firm.fmName).Width(700).Title("Firm Name");
            columns.Bound(firm => firm.fmFirmId).Visible(false);
            columns.Bound(firm => firm.fmType).Width(200).Title("Firm Type (custom filter)");
        }).ClientEvents(e => e.OnRowSelected("rowSelected"))
            .ClientEvents(e => e.OnLoad("getFilter('Firm Type')"))
        .DataBinding(dataBinding => dataBinding.Ajax().Select("AjaxBinding", "Home").Enabled(true)).Render();
        }

From the attached file you can see the Firm Name column and i want to filter this column with the data entered on the textbox added on Grid's toolbar.Please help me with an example code or give me a proper suggestion.

Thanks
Prashanth

[Dimo]

Hello Prashanth,

Please use the following demo and our documentation as a starting point to implement your scenario.

Grid Toolbar template - filtering combobox
http://demos.telerik.com/aspnet-mvc/grid/customtoolbar

Grid client API - filtering
http://www.telerik.com/help/aspnet-mvc/telerik-ui-components-grid-client-api-and-events.html#filter

All the best,
Dimo
the Telerik team