Hi,
I am implementing a combobox in which I need to make each row change backcolor when mouse is over the row. I use a table inside item template to define item row with <tr class="div_row"> . I then write two jquery in the header section with class selector and event $(.div_row).mouseover and $(.div_row).mouseout. I get no response from the jquery. Using firebug to trace, I find out the script rendered back to the browser changed dramatically, the javascript code functions are completely missing. I had same problem with data pager control but that one was caused by the ajaxmanager. This time I don't have any ajax updates and still get the same error. Is there anything I have to take care when using jquery and radcontrols ? Could you please kindly explain and advice how to enable jquery in telerik ajax environment. I would appreciate it very much since we are going to use a lot of jquery in our development.
Thank you. Attach the script I used.
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="SearchBox.aspx.cs" Inherits="iBOOKSTORE.SearchBox" %><%@ 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></title> <script src="Scripts/jquery-1.4.1.js" type="text/javascript"></script> <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"> <script type="text/javascript"> function clientItemsRequesting(sender, e) { // var context = e.get_context(); // using jQuery to get the checked item and pass it to the server // context["QString"] = sender.get_text(); var comboInput = $find("<%= cmbInput.ClientID %>"); var istr = comboInput.get_text(); if (istr.length == 0 || istr.substr(istr.length - 1, 1) == ':' || istr.substr(istr.length - 1, 1) == ':') { e.set_cancel(true); comboInput.hideDropDown(); } } function clientDropdownOpening(sender, e) { var istr = sender.get_text(); if (istr.length == 0 || istr.substr(istr.length - 1, 1) == ':' || istr.substr(istr.length - 1, 1) == ':') { e.set_cancel(true); } } function clientDropdownClosing(sender, e) { var comboInput = $find("<%= cmbInput.ClientID %>"); var istr = comboInput.get_value(); if (istr.length == 0) { e.set_cancel(true); } } function indexChanged_handler(sender, e) { var comboInput = $find("<%= cmbInput.ClientID %>"); var txt = comboInput.get_text(); if (txt.length > 0) txt += ','; comboInput.set_text(txt + sender.get_value()); var input = comboInput.get_inputDomElement(); input.focus(); } var backcolor; $(document).ready(function () { $(".div_row").mouseover(function () { backcolor = $(this).css("backgound-color"); $(this).css("background-color", "yellow"); }) }) $(document).ready(function () { $(".div_row").mouseout(function () { $(this).css("background-color", backcolor); }) }) </script> </telerik:RadCodeBlock></head><body> <form id="form1" runat="server"> <asp:ScriptManager ID="ScriptManager1" runat="server"> </asp:ScriptManager> <div> <telerik:RadComboBox ID="cmbMode" Runat="server" Width="66px" OnClientSelectedIndexChanged="indexChanged_handler"> <Items> <telerik:RadComboBoxItem runat="server" Text="录入书名" ToolTip="录入书名查询条件" Value="书名:" /> <telerik:RadComboBoxItem runat="server" Text="录入作者" ToolTip="录入作者查询条件" Value="作者:" /> <telerik:RadComboBoxItem runat="server" Text="出版机构" ToolTip="录入出版社名称查询条件" Value="出版社:" /> <telerik:RadComboBoxItem runat="server" Text="关键词句" ToolTip="录入关键词查询条件" Value="关键词:" /> <telerik:RadComboBoxItem runat="server" Text="图书分类" ToolTip="录入图书分类名称查询条件" Value="类别:" /> <telerik:RadComboBoxItem runat="server" Text="读者人群" ToolTip="录入读者人群查询条件" Value="读者:" /> <telerik:RadComboBoxItem runat="server" Text="丛书系列" ToolTip="录入丛书系列查询条件" Value="丛书:" /> </Items> </telerik:RadComboBox> <telerik:RadComboBox ID="cmbInput" Runat="server" AllowCustomText="True" LoadingMessage="读取数据..." DataTextField="TITLE" DataValueField="TITLE" OnClientDropDownClosing="clientDropdownClosing" OnClientItemsRequesting="clientItemsRequesting" OnClientDropDownOpening ="clientDropdownOpening" EnableLoadOnDemand="True" Skin="Windows7" DropDownWidth="526px" Height="400px" MaxHeight="400px" AutoPostBack="true" onitemsrequested="cmbInput_ItemsRequested" Width="500px" onselectedindexchanged="cmbInput_SelectedIndexChanged"> <ItemTemplate> <table width="500" style="border-style: solid; border-width: thin"> <tr class="div_row"> <td style="width: 200px;"><%# Eval("TITLE") %></td> <td style="width: 50px;"><%# Eval("AUTHOR") %></td> <td style="width: 50px;"><%# Eval("PUBNAME") %></td> <td style="width: 60px;"><%# Eval("CLSNAME") %></td> <td style="width: 40px;"><%# Eval("KEYWDS") %></td> <td style="width: 40px;"><%# Eval("SERIES") %></td> <td style="width: 40px;"><%# Eval("READER") %></td> </tr> </table> </ItemTemplate> <HeaderTemplate> <table width="500" style="border-style: solid; border-width: thin"> <tr> <td style="width: 200px;">书名</td> <td style="width: 50px;">作者</td> <td style="width: 50px;">出版社</td> <td style="width: 60px;">图书分类</td> <td style="width: 40px;">关键词</td> <td style="width: 40px;">丛书名</td> <td style="width: 40px;">读者群</td> </tr> </table> </HeaderTemplate> </telerik:RadComboBox> </div> </form></body></html>
resource.Attributes.Add("StartTime", "08:00"); resource.Attributes.Add("EndTime", "16:00");
var startTime = scheduler.get_resources().getResource(0).get_attributes().getAttribute("StartTime");If I attempt to retrieve the attributes from the event arguments using the following code, the attributes don't exist:
var startTime = eventArgs.get_targetSlot().get_resource().get_attributes().getAttribute("StartTime");If I call the following function, I am able to get the resource correctly, it's just the attributes that are blank:
var resource = eventArgs.get_targetSlot().get_resource();Is there any way i can retrive my resource attributes successfully from the event arguments or from the scheduler.get_resources() based on the resource key? Optionally, how can i find the index of a resource from the resource collection by the resource key so I can use the getResource(index) function?
I'm using version 2011.1.413.40.
Thanks
<telerik:RadComboBox ID="rcbNonStock" CausesValidation="false" AutoPostBack="true" EmptyMessage="Search Non Stock Item..." ShowMoreResultsBox="true" runat="server" LoadingMessage="Loading..." AppendDataBoundItems="true" Width="300px" Height="350px" DropDownWidth="725px" HighlightTemplatedItems="true" Filter="Contains" EnableLoadOnDemand="true" OnSelectedIndexChanged="rcbNonStock_SelectedIndexChanged" EnableVirtualScrolling="true" OnItemsRequested="rcbNonStock_ItemsRequested" ZIndex="3000" AllowCustomText="True" >
<HeaderTemplate>
<table style="width: 700px">
<tr>
<td style="width: 80px; text-align: left">
Item Category:</td>
<td style="width: 200px; text-align: left">
<telerik:RadComboBox ID="rcbNonStockCategory" runat="server" CausesValidation="false" AutoPostBack="true" EnableLoadOnDemand="true" HighlightTemplatedItems="true" OnItemsRequested="rcbNonStockCategory_ItemsRequested" DataTextField = "Item Category Code" DataValueField ="Item Category Code" Width="200px" Height="350px" OnSelectedIndexChanged="rcbNonStockCategory_SelectedIndexChanged" ZIndex="4000" ></telerik:RadComboBox> </td>
<td style="width: 100px;"> </td>
<td style="width: 40px;"></td>
<td style="width: 80px; text-align: left">
Product Group: </td>
<td style="width: 200px; text-align: left">
<telerik:RadComboBox ID="rcbNonStockProduct" runat="server" CausesValidation="false" AutoPostBack="true" EnableLoadOnDemand="true"
DataTextField = "Product Group Code" DataValueField ="Product Group Code" OnItemsRequested="rcbNonStockProduct_ItemsRequested"
OnSelectedIndexChanged="rcbNonStockProduct_SelectedIndexChanged" EnableScreenBoundaryDetection ="true" Width="200px" Height="350px" ZIndex="4000"></telerik:RadComboBox> </td>
</tr>
</table>
<table style="width: 700px" cellpadding="0" cellspacing="0">
<tr></tr>
<tr></tr>
<tr style="border-style: solid; border-width: 5px">
<td style="width: 75px; text-align: left">
No </td>
<td style="width: 300px; text-align: left">
Description
</td>
<td style="width: 150px; text-align: left">
Brand Name
</td>
<td style="width: 150px; text-align: left">
Catalogue ID
</td>
</tr>
</table>
</HeaderTemplate>
<ItemTemplate>
<table style="width: 700px" cellpadding="0" cellspacing="0">
<tr>
<td style="width: 75px; text-align: left">
<%# DataBinder.Eval(Container,"Value") %>
</td>
<td style="width: 300px; text-align: left">
<%# DataBinder.Eval(Container, "Attributes['Description']")%>
</td>
<td style="width: 150px; text-align: left">
<%# DataBinder.Eval(Container, "Attributes['Brand Name']")%>
</td>
<td style="width: 150px; text-align: left">
<%# DataBinder.Eval(Container, "Attributes['Catalogue ID']")%>
</td>
</tr>
</table>
</ItemTemplate>
<FooterTemplate >
</FooterTemplate>
</telerik:RadComboBox>
RadAjaxManager.Redirect. Why this script error is getting?.. I found that 'remove_initializeRequest' is a function of the Ajax js file MicrosoftAjaxWebForms.debug.js. Please reply
<telerik:RadGrid ID="GuestTabsGrid" runat="server" OnNeedDataSource="GuestTabsGrid_NeedDataSource" OnInsertCommand="TabsGrid_InsertCommand" OnUpdateCommand="TabsGrid_UpdateCommand" AutoGenerateColumns="false" AllowFilteringByColumn="false" AllowSorting="false" AllowPaging="true"> <PagerStyle Mode="NextPrevAndNumeric" /> <GroupingSettings CaseSensitive="false" /> <MasterTableView TableLayout="Fixed" CommandItemDisplay="Top" ClientDataKeyNames="Id,Name,IsSystem,IsPublished" DataKeyNames="Id" EditMode="PopUp"> <Columns> <telerik:GridBoundColumn UniqueName="GuestNameCol" HeaderText="Tab Name" DataField="Name"/> <telerik:GridTemplateColumn UniqueName="GuestSystemCol" HeaderText="Is System Tab?" DataField="IsDefault"> <ItemTemplate> <asp:Label runat="server" Text='<%# Convert.ToBoolean(Eval("IsSystem")) == true? "Yes" : "No" %>' /> </ItemTemplate> </telerik:GridTemplateColumn> <telerik:GridTemplateColumn UniqueName="GuestPortletsCol" HeaderText="Portlets" DataField="LearningStudioPortletsXml"> <ItemTemplate> <asp:Label runat="server" Text='' /> </ItemTemplate> </telerik:GridTemplateColumn> <telerik:GridBoundColumn UniqueName="GuestSortOrderCol" HeaderText="Sort Order" DataField="SortOrder"/> </Columns> <EditFormSettings UserControlName="..\Controls\TabDetailsControl.ascx" EditFormType="WebUserControl" InsertCaption="Add new tab" CaptionFormatString="Edit Tab: {0}" CaptionDataField="Name" PopUpSettings-Width="750px" PopUpSettings-Modal="true"> <EditColumn ButtonType="ImageButton" InsertText="Insert Order" UpdateText="Update record" UniqueName="EditCommandColumn1" CancelText="Cancel edit"> </EditColumn> <FormTableButtonRowStyle HorizontalAlign="Right" CssClass="EditFormButtonRow"></FormTableButtonRowStyle> </EditFormSettings> </MasterTableView> <ClientSettings> <Selecting AllowRowSelect="true" /> <ClientEvents OnPopUpShowing="PopUpShowing" /> <ClientEvents OnRowContextMenu="TabRowContextMenu" /> </ClientSettings></telerik:RadGrid><telerik:RadContextMenu ID="TabGridMenu" runat="server" OnItemClick="TabGridMenu_ItemClick" EnableRoundedCorners="true" EnableShadows="true"> <Items> <telerik:RadMenuItem Text="Edit" Value="Edit" /> <telerik:RadMenuItem Text="Delete" Value="Delete" /> <telerik:RadMenuItem Text="Set as default" Value="SetDefault" /> <telerik:RadMenuItem Text="Publish" Value="Publish" /> <telerik:RadMenuItem Text="Unpublish" Value="Unpublish" /> </Items></telerik:RadContextMenu>function TabRowContextMenu(sender, eventArgs) { var menu = $find("<%=TabGridMenu.ClientID %>"); var evt = eventArgs.get_domEvent(); var clickedGridId = sender.get_id(); if (evt.target.tagName == "INPUT" || evt.target.tagName == "A") { return; } if (clickedGridId != "<%=GuestTabsGrid.ClientID %>" || clickedGridId == "<%=SignInTabsGrid.ClientID %>" || clickedGridId == "<%=SignedInTabsGrid.ClientID %>") ) { return; } var publish = menu.findItemByValue("Publish"); var unpublish = menu.findItemByValue("Unpublish"); var setDefault = menu.findItemByValue("SetDefault"); publish.set_visible(false); unpublish.set_visible(false); setDefault.set_visible(false); var itemIsPublished = eventArgs.getDataKeyValue("IsPublished") == "True"; var itemIsDefault = eventArgs.getDataKeyValue("IsSystem") == "True"; var dataItem = eventArgs.get_gridDataItem(); var index = eventArgs.get_itemIndexHierarchical(); document.getElementById("<%=radGridClickedRowIndex.ClientID %>").value = index; document.getElementById("<%=radGridClicked.ClientID %>").value = clickedGridId; sender.get_masterTableView().selectItem(sender.get_masterTableView().get_dataItems()[index].get_element(), true); if (itemIsPublished) { unpublish.set_visible(true); } else { publish.set_visible(true); } if (!itemIsDefault) { setDefault.set_visible(true); } menu.show(evt); evt.cancelBubble = true; evt.returnValue = false; if (evt.stopPropagation) { evt.stopPropagation(); evt.preventDefault(); }}</script><telerik:RadGrid runat="server" ID="TabAvailablePortlets" OnNeedDataSource="grdPendingOrders_NeedDataSource" AllowPaging="false" Width="150px" OnRowDrop="grdPendingOrders_RowDrop" AllowMultiRowSelection="false" AutoGenerateColumns="false"> <MasterTableView DataKeyNames="Id,Name,IsSystem,IsPublished,Content" TableLayout="Fixed"> <Columns> <%--<telerik:GridDragDropColumn HeaderStyle-Width="18px" Visible="false" />--%> <telerik:GridBoundColumn UniqueName="TANameCol" HeaderText="Portlet Name" DataField="Name"/> </Columns> </MasterTableView> <ClientSettings AllowRowsDragDrop="True" AllowColumnsReorder="true" ReorderColumnsOnClient="true"> <Resizing AllowColumnResize="true" /> <Selecting AllowRowSelect="True" EnableDragToSelectRows="false"/> <ClientEvents OnRowDropping="onRowDropping" /> <Scrolling AllowScroll="true" UseStaticHeaders="true"/> </ClientSettings> <PagerStyle Mode="NumericPages" PageButtonCount="4" /></telerik:RadGrid><telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="LoadingPanel1" EnableAJAX="false"> <telerik:RadRotator runat="server" ID="RadRotator1" Skin="Black" RotatorType="Buttons" DataSourceID="ObjectDataSource2" Width="850px" Height="520px" ScrollDirection="Right,Left " SlideShowAnimation-Type="Fade" EnableAjaxSkinRendering="true" WrapFrames="true" OnClientItemShown="ItemShown_handler" OnItemClick="RadRotator1_ItemClick" OnItemDataBound="RadRotator1_ItemDataBound"> <ItemTemplate> <div> <%#SetInitialIndex(Container) %> <telerik:RadBinaryImage runat="server" ID="RadBinaryImage1" ResizeMode="Fit" DataValue='<%#Eval("Data") %>' Style="padding-left: 5px; padding-right: 5px;" /> <asp:Label runat="server" ID="lblTinyURL" Visible="true" ToolTip='<%#Eval("TinyURL") %>' ForeColor="Black" Font-Size="XX-Small"></asp:Label> </div> </ItemTemplate> </telerik:RadRotator> </telerik:RadAjaxPanel> <telerik:RadAjaxPanel ID="RadAjaxPanel2" runat="server" LoadingPanelID="LoadingPanel1" EnableAJAX="false"> <div> <script src="//platform.twitter.com/widgets.js" type="text/javascript"></script> <table> <tr> <td> <div id="fbDiv"> </div> </td> <td> <div id="gp1Div"> </div> </td> <td> <div id="twitterDiv"> </div> </td> </tr> </table> </div> </telerik:RadAjaxPanel> <telerik:RadCodeBlock runat="server" ID="RadCodeBlock1"> <script type="text/javascript"> function ItemShown_handler(sender, args) { var ItemIndex = sender.get_currentItem().get_index(); // Get the wraper element ; var wrapper = getWrapperElement(args.get_item()); // Find an asp control var aspLabelLink_InsideTemplate = findAspControl("lblLink", wrapper); var aspLabelTinyUrl_InsideTemplate = findAspControl("lblTinyURL", wrapper); var fb = aspLabelTinyUrl_InsideTemplate.outerHTML; var gp1 = aspLabelTinyUrl_InsideTemplate.outerHTML; var twitter = aspLabelTinyUrl_InsideTemplate.outerHTML; if (fb.length > 0 && fb.indexOf("title=") > -1) fb = fb.substring(fb.indexOf("title=") + 6, fb.indexOf("></SPAN>")); if (gp1.length > 0 && gp1.indexOf("title=") > -1) gp1 = gp1.substring(gp1.indexOf("title=") + 6, gp1.indexOf("></SPAN>")); if (twitter.length > 0 && twitter.indexOf("title=") > -1) twitter = twitter.substring(twitter.indexOf("title=") + 6, twitter.indexOf("></SPAN>")); //var fbDiv = findHtmlElement("fbDiv", wrapper); fbDiv.innerHTML = "<div class=\"fb-like\" data-href=\"" + fb + "\" data-send=\"true\" data-width=\"450\" data-show-faces=\"true\" data-colorscheme=\"dark\"></div>"; //var gp1Div = findHtmlElement("gp1Div", wrapper); gp1Div.innerHTML = "<div class=\"g-plusone\" data-href=\"" + gp1 + "\"></div><span itemprop=\"description\"></span>"; //var twitterDiv = findHtmlElement("twitterDiv", wrapper); var firstPartUrl = "<a href=\"https://twitter.com/share\" class=\"twitter-share-button\" data-url=\"" + twitter; var restOfUrl1 = "\" data-text=\"Nice!!!\" data-count=\"horizontal\">Tweet</a>"; twitterDiv.innerHTML = firstPartUrl + restOfUrl1; //$find("<%= RadAjaxManager1.ClientID %>").ajaxRequest(ItemIndex); } function findHtmlElement(id, wrapperElement) { // Get the image ; var image = $get(id, wrapperElement); return image; } function findAspControl(id, wrapperElement) { // Get the control ; var control = $get(wrapperElement.id + "_" + id, wrapperElement); return control; } function getWrapperElement(rotatorItem) { var itemElem = rotatorItem.get_element(); var wrapper = itemElem.firstChild; return wrapper; } </script> </telerik:RadCodeBlock>