This is a migrated thread and some comments may be shown as answers.

Capturing Enter key for each RadPanelItem?

1 Answer 54 Views
PanelBar
This is a migrated thread and some comments may be shown as answers.
Software
Top achievements
Rank 1
Software asked on 06 Oct 2008, 06:04 PM
I've got a RadPanelBar with four different RadPanelItem's.  Each one has a different type of search form with it's own search button.  The whole thing is contained within a master page.  What I'd like to do is capture the Enter key within each RadPanel so that it executes the click on the correct button, depending on where the cursor is.

Here's a quick example of what my code looks like:
<telerik:RadPanelBar ID="RadPanelBar1" runat="server" Width="260px" ExpandMode="SingleExpandedItem">  
    <Items> 
        <telerik:RadPanelItem runat="server" Text="Login">  
            <Items> 
                <telerik:RadPanelItem runat="server">  
                    <ItemTemplate> 
                        <div style="line-height: 16px; padding: 4px; width:230px;">  
                            <div class="LoginBox">  
                                <div style="float: left; width: 80px; padding-top:3px;">  
                                    Username:</div> 
                                <div style="margin-top: 4px;">  
                                    <asp:TextBox runat="server" ID="txtUsername" Text="" Width="70px"></asp:TextBox></div>  
                                <div style="float: left; clear: both; width: 80px; ">  
                                    Password:</div> 
                                <asp:Button runat="server" ID="btnLogin" Text="Login" Style="float: right; margin: 5px 5px 10px 0px; clear: both" 
                                    OnClick="btnLogin_Click" /> 
                            </div> 
                        </div> 
                    </ItemTemplate> 
                </telerik:RadPanelItem> 
            </Items> 
        </telerik:RadPanelItem> 
        <telerik:RadPanelItem runat="server" Text="CH Search" Value="CHSearch">  
            <Items> 
                <telerik:RadPanelItem runat="server" Value="CHSearchContent">     
                    <ItemTemplate> 
                        <div style="line-height:16px; padding:7px;">  
                              
                            <div style="float:left; width:70px;">ID: </div> 
                            <div style="float:left; vertical-align: middle"><asp:TextBox Width="130px" runat="server" ID="txtCHID"></asp:TextBox></div>  
                              
                            <div style="float:left; clear:both; width:70px;">Reason: </div> 
                            <div style="float:left; vertical-align: middle"><asp:TextBox Width="130px" runat="server" ID="txtCHReason"></asp:TextBox></div>  
                              
                            <div style="clear:both; float: left; text-align:left; margin-left:34px; padding-bottom:10px; vertical-align: middle">  
                                <asp:Button runat="server" ID="btnCHSubmit" Text="Search" OnClick="btnCHSearch_Click" /> 
                            </div> 
                        </div> 
                    </ItemTemplate> 
                </telerik:RadPanelItem> 
            </Items> 
        </telerik:RadPanelItem> 
        <telerik:RadPanelItem runat="server" Text="WP Search" Value="WPSearch">  
            <Items> 
                <telerik:RadPanelItem runat="server" Value="WPSearchContent">  
                    <ItemTemplate> 
                        <div class="wpSearchForm">  
                              
                            <div style="float:left; clear:both; width:70px;">First Name: </div> 
                            <div style="float:left; vertical-align: middle">  
                                <asp:TextBox runat="server" ID="txtWPFname" Width="130px"></asp:TextBox></div>  
                              
                            <div style="float:left; clear:both; width:70px;">Last Name: </div> 
                            <div style="float:left; vertical-align: middle"><asp:TextBox runat="server" Width="130px" ID="txtWPLname"></asp:TextBox></div>  
                              
                            <div style="clear:both; float:left; width:70px;">Sex: </div> 
                            <div style="float:left; vertical-align: middle">  
                                <asp:DropDownList runat="server" ID="drpWPSex">  
                                    <asp:ListItem Text="" Value=""></asp:ListItem> 
                                    <asp:ListItem Text="M" Value="M"></asp:ListItem> 
                                    <asp:ListItem Text="F" Value="F"></asp:ListItem> 
                                </asp:DropDownList> 
                            </div> 
                              
                            <div style="float: left; clear: both; width: 70px;">Password: </div> 
                            <div style="float:left; vertical-align: middle"><asp:TextBox runat="server" Width="130px" ID="txtWPPassword" TextMode="password"></asp:TextBox></div>  
                              
                            <div style="clear:both; float: left; text-align:left; margin-left:34px; padding-bottom:10px; vertical-align: middle">  
                                <asp:Button runat="server" ID="btnWPSubmit" Text="Search" OnClick="btnWPSearch_Click" /> 
                            </div> 
                        </div> 
                    </ItemTemplate> 
                </telerik:RadPanelItem> 
            </Items> 
        </telerik:RadPanelItem> 
    </Items> 
</telerik:RadPanelBar> 
 

One minor twist: the master page has a quick search field in it and the enter key is captured there using the "defaultbutton" attribute on the form tag... 

Thanks for the help!

Eddie

1 Answer, 1 is accepted

Sort by
0
Paul
Telerik team
answered on 07 Oct 2008, 12:45 PM
Hi Eddie,

Please find below a sample code snippet that shows the needed approach.

ASPX:
<form id="form1" runat="server" defaultbutton="btnDefault1">  
    <asp:ScriptManager ID="ScriptManager1" runat="server">  
    </asp:ScriptManager> 
    <asp:Button runat="server" ID="btnDefault1" Text="Default" OnClick="btnDefault1_Click" /> 
    <telerik:RadPanelBar ID="RadPanelBar1" runat="server" Width="260px" ExpandMode="SingleExpandedItem" OnItemClick="RadPanelBar1_ItemClick">  
        <Items> 
            <telerik:RadPanelItem runat="server" Text="Login">  
                <Items> 
                    <telerik:RadPanelItem runat="server" Value="LoginContent">  
                        <ItemTemplate> 
                            <div style="line-height: 16px; padding: 4px; width: 230px;">  
                                <div class="LoginBox">  
                                    <div style="float: left; width: 80px; padding-top: 3px;">  
                                        Username:</div> 
                                    <div style="margin-top: 4px;">  
                                        <asp:TextBox runat="server" ID="txtUsername" Text="" Width="70px"></asp:TextBox></div>  
                                    <div style="float: left; clear: both; width: 80px;">  
                                        Password:</div> 
                                    <asp:Button runat="server" ID="btnLogin" Text="Login" Style="float: right; margin: 5px 5px 10px 0px; clear: both" OnClick="btnLogin_Click" /> 
                                </div> 
                            </div> 
                        </ItemTemplate> 
                    </telerik:RadPanelItem> 
                </Items> 
            </telerik:RadPanelItem> 
            <telerik:RadPanelItem runat="server" Text="CH Search" Value="CHSearch">  
                <Items> 
                    <telerik:RadPanelItem runat="server" Value="CHSearchContent">  
                        <ItemTemplate> 
                            <div style="line-height: 16px; padding: 7px;">  
                                <div style="float: left; width: 70px;">  
                                    ID:  
                                </div> 
                                <div style="float: left; vertical-align: middle">  
                                    <asp:TextBox Width="130px" runat="server" ID="txtCHID"></asp:TextBox></div>  
                                <div style="float: left; clear: both; width: 70px;">  
                                    Reason:  
                                </div> 
                                <div style="float: left; vertical-align: middle">  
                                    <asp:TextBox Width="130px" runat="server" ID="txtCHReason"></asp:TextBox></div>  
                                <div style="clear: both; float: left; text-align: left; margin-left: 34px; padding-bottom: 10px; vertical-align: middle">  
                                    <asp:Button runat="server" ID="btnCHSubmit" Text="Search" OnClick="btnCHSearch_Click" /> 
                                </div> 
                            </div> 
                        </ItemTemplate> 
                    </telerik:RadPanelItem> 
                </Items> 
            </telerik:RadPanelItem> 
            <telerik:RadPanelItem runat="server" Text="WP Search" Value="WPSearch">  
                <Items> 
                    <telerik:RadPanelItem runat="server" Value="WPSearchContent">  
                        <ItemTemplate> 
                            <div class="wpSearchForm">  
                                <div style="float: left; clear: both; width: 70px;">  
                                    First Name:  
                                </div> 
                                <div style="float: left; vertical-align: middle">  
                                    <asp:TextBox runat="server" ID="txtWPFname" Width="130px"></asp:TextBox></div>  
                                <div style="float: left; clear: both; width: 70px;">  
                                    Last Name:  
                                </div> 
                                <div style="float: left; vertical-align: middle">  
                                    <asp:TextBox runat="server" Width="130px" ID="txtWPLname"></asp:TextBox></div>  
                                <div style="clear: both; float: left; width: 70px;">  
                                    Sex:  
                                </div> 
                                <div style="float: left; vertical-align: middle">  
                                    <asp:DropDownList runat="server" ID="drpWPSex">  
                                        <asp:ListItem Text="" Value=""></asp:ListItem> 
                                        <asp:ListItem Text="M" Value="M"></asp:ListItem> 
                                        <asp:ListItem Text="F" Value="F"></asp:ListItem> 
                                    </asp:DropDownList> 
                                </div> 
                                <div style="float: left; clear: both; width: 70px;">  
                                    Password:  
                                </div> 
                                <div style="float: left; vertical-align: middle">  
                                    <asp:TextBox runat="server" Width="130px" ID="txtWPPassword" TextMode="password"></asp:TextBox></div>  
                                <div style="clear: both; float: left; text-align: left; margin-left: 34px; padding-bottom: 10px; vertical-align: middle">  
                                    <asp:Button runat="server" ID="btnWPSubmit" Text="Search" OnClick="btnWPSearch_Click" /> 
                                </div> 
                            </div> 
                        </ItemTemplate> 
                    </telerik:RadPanelItem> 
                </Items> 
            </telerik:RadPanelItem> 
        </Items> 
    </telerik:RadPanelBar> 
</form> 

Code-behind:
using System;  
using System.Data;  
using System.Configuration;  
using System.Collections;  
using System.Web;  
using System.Web.Security;  
using System.Web.UI;  
using System.Web.UI.WebControls;  
using System.Web.UI.WebControls.WebParts;  
using System.Web.UI.HtmlControls;  
using Telerik.Web.UI;  
 
public partial class _Default : System.Web.UI.Page  
{  
    protected void Page_Load(object sender, EventArgs e)  
    {  
        foreach (RadPanelItem myRootItem in RadPanelBar1.GetAllItems())  
        {  
            if (myRootItem.Level == 0)  
            {  
                myRootItem.PostBack = true;  
            }  
            else 
            {  
                myRootItem.PostBack = false;  
            }  
        }  
    }  
    protected void btnLogin_Click(object sender, EventArgs e)  
    {  
        Response.Write("login");  
    }  
    protected void btnCHSearch_Click(object sender, EventArgs e)  
    {  
        Response.Write("CHSearch");  
    }  
    protected void btnWPSearch_Click(object sender, EventArgs e)  
    {  
        Response.Write("WPSearch");  
    }  
    protected void RadPanelBar1_ItemClick(object sender, RadPanelBarEventArgs e)  
    {  
        switch (e.Item.Text)  
        {  
            case "Login":  
                Button mybutton1 = (Button)RadPanelBar1.FindItemByValue("LoginContent").FindControl("btnLogin");  
                form1.DefaultButton = mybutton1.UniqueID;  
                break;  
 
            case "CH Search":  
                Button mybutton2 = (Button)RadPanelBar1.FindItemByValue("CHSearchContent").FindControl("btnCHSubmit");  
                form1.DefaultButton = mybutton2.UniqueID;  
                break;  
 
            case "WP Search":  
                Button mybutton3 = (Button)RadPanelBar1.FindItemByValue("WPSearchContent").FindControl("btnWPSubmit");  
                form1.DefaultButton = mybutton3.UniqueID;  
                break;  
        }  
    }  
    protected void btnDefault1_Click(object sender, EventArgs e)  
    {  
        Response.Write("Default1");  
    }  
}  
 


Greetings,
Paul
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.
Tags
PanelBar
Asked by
Software
Top achievements
Rank 1
Answers by
Paul
Telerik team
Share this question
or