<%@ Page Language="C#" AutoEventWireup="true" CodeFile="DefaultCS.aspx.cs" Inherits="SearchBox_Examples_PropertyExplorer_DefaultCS" %>
<%@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>
<%@ Register TagPrefix="qsf" Namespace="Telerik.QuickStart" %>
<!DOCTYPE html>
<html xmlns='http://www.w3.org/1999/xhtml'>
<head runat="server">
<title>Telerik ASP.NET Example</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<form id="form1" runat="server">
<telerik:RadScriptManager runat="server" ID="RadScriptManager1" />
<telerik:RadSkinManager ID="RadSkinManager1" runat="server" ShowChooser="true" />
<telerik:RadScriptBlock ID="ScriptBlock1" runat="server">
<script type="text/javascript">
function buttonCommand(sender, args) {
var radToolTip = $find("<%= RadToolTip1.ClientID %>"),
contentElement = radToolTip.get_contentElement(),
parentElement = contentElement ? contentElement : radToolTip.get_element(),
theCommandButton,
textBox;
if (args.get_commandName() == "Globe") {
theCommandButton = sender.get_buttons().getButton(0);
}
else {
theCommandButton = sender.get_buttons().getButton(1);
}
radToolTip.set_targetControl(theCommandButton.get_element());
textBox = $telerik.findControl(parentElement, "TextBox1");
textBox.set_value(args.get_commandArgument());
setTimeout(function () {
radToolTip.show();
}, 20);
}
</script>
</telerik:RadScriptBlock>
<telerik:RadAjaxPanel ID="AjaxPanel1" runat="server">
<div class="demo-container size-thin">
<telerik:RadSearchBox RenderMode="Lightweight" runat="server" ID="RadSearchBox1"
DataSourceID="SqlDataSource1"
DataKeyNames="UnitPrice"
DataValueField="ProductId"
DataTextField="ProductName"
EnableAutoComplete="true"
Width="310"
OnSearch="RadSearchBox1_Search"
OnClientButtonCommand="buttonCommand">
<Buttons>
<telerik:SearchBoxButton ImageUrl="../images/icon_globe.png" CommandName="Globe"
CommandArgument="globe" Position="Left" AlternateText="globe" />
<telerik:SearchBoxButton ImageUrl="../images/icon_favourites.png" CommandName="Favorites"
CommandArgument="favorites" Position="Right" AlternateText="favorites" />
</Buttons>
<DropDownSettings Width="300" Height="300px" />
</telerik:RadSearchBox>
<br />
<asp:Literal ID="result" runat="server" Visible="false" />
</div>
<telerik:RadToolTip RenderMode="Lightweight" runat="server" ID="RadToolTip1" HideEvent="ManualClose"
ShowEvent="FromCode" Width="280px" RelativeTo="Element" Position="BottomCenter">
<asp:Label ID="Label1" CssClass="theLabelClass" Text="Show tooltip for button:" runat="server"></asp:Label>
<telerik:RadTextBox RenderMode="Lightweight" ID="TextBox1" runat="server" Width="90px"></telerik:RadTextBox>
</telerik:RadToolTip>
</telerik:RadAjaxPanel>
<asp:SqlDataSource ID="SqlDataSource1" runat="server"
ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
SelectCommand="SELECT * FROM [Products]"></asp:SqlDataSource>
<qsf:ConfiguratorPanel runat="server" ID="ConfigurationPanel1">
<Views>
<qsf:View>
<qsf:ConfiguratorColumn ID="ConfiguratorColumn1" runat="server" Size="Medium">
<ul class="fb-group">
<li>
<span class="checkbox">
<asp:CheckBox runat="server" ID="CheckBoxDefaultButton" AutoPostBack="true" Checked="true" Text="Default button" />
</span>
</li>
<li>
<span class="checkbox">
<asp:CheckBox runat="server" ID="CheckBoxEnableAutoComplete" AutoPostBack="true" Checked="true" Text="Enable AutoComplete" />
</span>
</li>
<li>
<qsf:DropDownList runat="Server" ID="FilterComboBox" AutoPostBack="true" Label="Filter" Size="Medium">
<Items>
<telerik:DropDownListItem Text="Contains" Value="Contains" />
<telerik:DropDownListItem Text="StartsWith" Value="StartsWith" />
</Items>
</qsf:DropDownList>
</li>
<li>
<qsf:DropDownList runat="Server" ID="FilterLength" AutoPostBack="true" Label="MinFilterLength" Size="Medium">
<Items>
<telerik:DropDownListItem Text="1" Value="1" />
<telerik:DropDownListItem Text="2" Value="2" />
<telerik:DropDownListItem Text="4" Value="4" />
</Items>
</qsf:DropDownList>
</li>
<li>
<qsf:DropDownList runat="Server" ID="MaxResultsCount" AutoPostBack="true" Label="MaxResultsCount" Size="Medium">
<Items>
<telerik:DropDownListItem Text="10" Value="10" />
<telerik:DropDownListItem Text="20" Value="20" />
</Items>
</qsf:DropDownList>
</li>
</ul>
</qsf:ConfiguratorColumn>
</qsf:View>
</Views>
</qsf:ConfiguratorPanel>
</form>
</body>
</html>