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

Jquery is not working when using with RadTabStrip

1 Answer 117 Views
General Discussions
This is a migrated thread and some comments may be shown as answers.
Vincent
Top achievements
Rank 1
Vincent asked on 14 Jul 2008, 03:39 AM
Hi

I have a RadTabStrip control on the page, inside page, I just jquery to add css
to highlight several fields, but it seems not working at all. here is my code
snippet

JS code:

        $(document).ready(function() {
            $("#<%=btnSaveDefaultReply.ClientID%>").hover(
              function () {
                $(".btnSaveDefaultReply").addClass("actionhighlight");
              },
              function () {
                $(".btnSaveDefaultReply").removeClass("actionhighlight");
              }
            )           
        });

Html code:

            <telerik:RadPageView ID="pMisc" runat="server">
                <br />
                <table border="0" cellpadding="5" cellspacing="5" width="450px">
                    <tr>
                        <td colspan="3">
                            <strong>Default Reply Name and Email</strong>
                        </td>
                    </tr>
                    <tr class="dd btnSaveDefaultReply" id="test">
                        <td class="label">
                            Default Reply Email:
                        </td>

.......

1 Answer, 1 is accepted

Sort by
0
Kevin Babcock
Top achievements
Rank 1
answered on 14 Jul 2008, 03:27 PM
Hello Vincent,

I was able to get your JQuery script to work properly inside the RadPageViews of a RadTabStrip. Could you possibly have a problem with your CSS? Either way, here is the code I got working:

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="RadTabStrip.aspx.cs" Inherits="RadTabStrip" %> 
 
<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %> 
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
 
<html xmlns="http://www.w3.org/1999/xhtml"
<head runat="server"
    <title>Untitled Page</title> 
    <script src="JavaScript/jquery-1.2.6.js" type="text/javascript" ></script
    <style type="text/css"
        .btnSaveDefaultReply 
        { 
            /* Insert CSS here */ 
        } 
         
        .actionhighlight 
        { 
            background-color: Yellow; 
        } 
    </style> 
</head> 
<body> 
    <form id="form1" runat="server"
        <telerik:RadScriptManager ID="RadScriptManager1" runat="server" /> 
         
        <telerik:RadScriptBlock ID="RadScriptBlock1" runat="server"
            <script type="text/javascript"
                 $(document).ready(function() { 
                    $("#<%=btnSaveDefaultReply.ClientID%>").hover( 
                      function () { 
                        $(".btnSaveDefaultReply").addClass("actionhighlight"); 
                      }, 
                      function () { 
                        $(".btnSaveDefaultReply").removeClass("actionhighlight"); 
                      } 
                    )            
                }); 
            </script> 
        </telerik:RadScriptBlock> 
         
        <telerik:RadTabStrip ID="RadTabStrip1" runat="server" MultiPageID="RadMultiPage1"
            <Tabs> 
                <telerik:RadTab PageViewID="RadPageView1" runat="server" Text="RadTab One" /> 
                <telerik:RadTab PageViewID="RadPageView2" runat="server" Text="RadTab Two" /> 
            </Tabs> 
        </telerik:RadTabStrip> 
         
        <telerik:RadMultiPage ID="RadMultiPage1" runat="server"
            <telerik:RadPageView ID="RadPageView1" runat="server" Width="100%"
                <table border="0" cellpadding="5" cellspacing="5" width="450px"
                    <tr> 
                        <td colspan="3"
                            <strong>Default Reply Name and Email</strong> 
                        </td> 
                    </tr> 
                    <tr class="dd btnSaveDefaultReply" id="test"
                        <td class="label"
                            Default Reply Email: 
                        </td> 
                        <td> 
                            <telerik:RadTextBox ID="RadTextBox1" runat="server" /> 
                        </td> 
                        <td> 
                            <asp:Button ID="btnSaveDefaultReply" runat="server" 
                                Text="Click Me" /> 
                        </td> 
                    </tr> 
                </table> 
            </telerik:RadPageView> 
            <telerik:RadPageView ID="RadPageView2" runat="server" Width="100%"
                ... 
            </telerik:RadPageView> 
        </telerik:RadMultiPage> 
                 
    </form> 
</body> 
</html> 
 


I hope this helps. Please let me know if you continue to have trouble.

Sincerely,
Kevin Babcock
Tags
General Discussions
Asked by
Vincent
Top achievements
Rank 1
Answers by
Kevin Babcock
Top achievements
Rank 1
Share this question
or