Questions on UI for ASP.NET AJAX Forum

1 answer

91 views

$find when using Ajax Manager coming back null?

I have a radContextMenu inside an ajax manager (i have also tried an updatePanel too) and when I try to fire the $find after an ajax postback I get a script error that the menu is null. Here is my code (i am not including hte declarations):

    
            <asp:Content ID="Content2" ContentPlaceHolderID="pageContent" Runat="Server">  
        
                <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">  
        
                    <AjaxSettings> 
        
                        <telerik:AjaxSetting AjaxControlID="btnSearch">  
        
                            <UpdatedControls> 
        
                                <telerik:AjaxUpdatedControl ControlID="tbCityStateZip" /> 
        
                                <telerik:AjaxUpdatedControl ControlID="rdMenuNarrowSearch" /> 
        
                            </UpdatedControls> 
        
                        </telerik:AjaxSetting> 
        
                    </AjaxSettings> 
        
                </telerik:RadAjaxManager> 
        
            <script type="text/javascript">  
        
                    function showMenu() {  
        
                        var contextMenu = $find("<%#rdMenuNarrowSearch.ClientID %>");  
        
                        var xy = findPos(document.getElementById('<%#Me.tbCityStateZip.ClientID %>'));  
        
                        contextMenu.showAt(xy[0], xy[1]);  
        
                    }  
        
                    function findPos(obj) {  
        
                        var curleft = curtop = 0;  
        
                        if (obj.offsetParent) {  
        
                            do {  
        
                                curleft += obj.offsetLeft;  
        
                                curtop += obj.offsetTop;  
        
                            } while (objobj = obj.offsetParent);  
        
                            return [curleft, curtop];  
        
                        }  
        
                    }  
        
                </script> 
        
                <div style="width: 410px; height: 300px; background: #f3f7fe; margin-top: 10px; float: left;">  
        
                <div style="padding-top: 10px; padding-left: 10px;  width: 375px; "> <span style="font-family:'Trebuchet MS', Arial, Helvetica, sans-serif; font-size: 24px; font-weight: bold; color: #6684b3; padding-left: 3px;">Property Search</span> 
        
                  <hr style="height: 0; border: 0; border-top: 1px solid #069; margin-top: 2px; "/>  
        
                </div> 
        
                <div style="padding-left: 10px;">  
        
                  <table width="375" border="0" cellspacing="0" cellpadding="0" > 
        
                    <tr> 
        
                      <td colspan="2"><span class="propertySearchHeadings"> City &amp; State or Zip  
        
                          </span> 
        
                          <br /> 
        
                          <asp:TextBox   
        
                              ID="tbCityStateZip" runat="server" Width="362px" CssClass="textBoxes"></asp:TextBox> 
        
                          </td> 
        
                    </tr> 
        
                    <tr> 
        
                      <td width="50%"><span class="propertySearchHeadings">Price</span> 
        
                      <br /> 
        
                          <asp:DropDownList ID="DropDownList1" runat="server" Width="175px" CssClass="dropDowns">  
        
                          <asp:ListItem Text=" -- Any Price --" Value="0">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="< $50,000" Value="< 50000">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="$50,000 - $100,000" Value="50000 - 100000">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="$100,000 - $150,000" Value="100000 - 150000">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="$150,000 - $200,000" Value="150000 - 200000">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="$200,000 - $250,000" Value="200000 - 250000">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="$250,000 - $300,000" Value="250000 - 300000">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="$300,000 - $350,000" Value="300000 - 350000">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="$350,000 - $400,000" Value="350000 - 400000">   
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="$400,000 - $450,000" Value="400000 - 450000">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="$450,000 - $500,000" Value="450000 - 500000">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="$500,000 - $550,000" Value="500000 - 550000">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="> $550,000" Value="> 550000">            
        
                          </asp:ListItem> 
        
                          </asp:DropDownList> 
        
                      </td> 
        
                      <td width="50%"><span class="propertySearchHeadings">Beds</span> 
        
                      <br /> 
        
                      <asp:DropDownList ID="DropDownList2" runat="server" Width="175px" CssClass="dropDowns">  
        
                          <asp:ListItem Text=" -- Any Beds --" Value="0">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="1" Value="1">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="2" Value="2">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="3" Value="3">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="4" Value="4">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="5" Value="5">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="6" Value="6">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="7" Value="7">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="8" Value="8">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="9" Value="9">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="10" Value="10">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="> 10" Value="> 10">            
        
                          </asp:ListItem> 
        
                          </asp:DropDownList> 
        
                      </td> 
        
                    </tr> 
        
                    <tr> 
        
                      <td><span class="propertySearchHeadings">Baths</span> 
        
                      <br /> 
        
                      <asp:DropDownList ID="DropDownList3" runat="server" Width="175px" CssClass="dropDowns">  
        
                          <asp:ListItem Text=" -- Any Baths --" Value="0">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="1" Value="1">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="1.5" Value="1.5">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="2" Value="2">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="2.5" Value="2.5">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="3" Value="3">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="3.5" Value="3.5">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="4" Value="4">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="4.5" Value="4.5">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="5" Value="5">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="5.5" Value="5.5">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="6" Value="6">            
        
                          </asp:ListItem> 
        
                          <asp:ListItem Text="6.5" Value="6.5">            
        
                          </asp:ListItem> 
        
                          </asp:DropDownList> 
        
                      </td> 
        
                      <td>&nbsp;</td> 
        
                    </tr> 
        
                    <tr> 
        
                      <td colspan="2" align="center">  
        
                          <br /> 
        
                      <asp:ImageButton ID="btnSearch" runat="server" ImageUrl="~/images/UserAccount/buttons/btn_Search.png" /> 
        
                          </td> 
        
                    </tr> 
        
                  </table> 
        
                </div> 
        
              </div> 
        
              <div style="width: 410px; height: 300px; background: #f3f7fe; margin-top: 10px; float: right;">  
        
                <div style="padding-top: 10px; padding-left: 10px;  width: 375px; "> <span style="font-family:'Trebuchet MS', Arial, Helvetica, sans-serif; font-size: 24px; font-weight: bold; color: #6684b3; padding-left: 3px;">Find SpinStitch On:</span> 
        
                  <hr style="height: 0; border: 0; border-top: 1px solid #069; margin-top: 2px; "/>  
        
                </div> 
        
              </div> 
        
              <telerik:RadContextMenu ID="rdMenuNarrowSearch" runat="server" Skin="Office2007">  
        
                <Items> 
        
                    <telerik:RadMenuItem Text="Narrow Search" Enabled="false"></telerik:RadMenuItem> 
        
                </Items> 
        
                </telerik:RadContextMenu> 
        
              <%--<div style="padding-top: 25px; clear: both"/>  
        
              <div style="clear: both; width: 900px; height: 29px; background:url(images/SSToursHeading/backgroundMenuBar.jpg);  "> <span style="font-family:'Trebuchet MS', Arial, Helvetica, sans-serif; font-size: 24px; font-weight: bold; color: #036; padding-left: 12px;">Recent Tours</span> </div>--%> 
        
            <asp:RequiredFieldValidator ID="valCityStateZip" runat="server" ErrorMessage="Please Enter A City & State or Zip Code." 
        
                        SetFocusOnError="true" ControlToValidate="tbCityStateZip" Display="None"></asp:RequiredFieldValidator> 
        
                    <cc1:ValidatorCalloutExtender ID="valEXCityStateZip" runat="server" TargetControlID="valCityStateZip">  
        
                    </cc1:ValidatorCalloutExtender> 
        
            </asp:Content>

Code behind:

    
            Partial Class PropertySearch  
        
                    Inherits System.Web.UI.Page  
        
                    Private _city As String = String.Empty  
        
                    Private _state As String = String.Empty  
        
                    Private _zipCode As String = String.Empty  
        
                    Private _stateSet As DataSet = Nothing 
        
                    Protected Sub btnSearch_Click(ByVal sender As Object, ByVal e As System.Web.UI.ImageClickEventArgs) Handles btnSearch.Click  
        
                        If Not _stateSet Is Nothing AndAlso Not _stateSet.Tables Is Nothing AndAlso _stateSet.Tables(0).Rows.Count > 1 Then 
        
                            For Each zipRow As DataRow In _stateSet.Tables(0).Rows  
        
                                Dim contextMenuItem As New Telerik.Web.UI.RadMenuItem  
        
                                contextMenuItem.Text = zipRow("CITY") & ", " & zipRow("ABBR")  
        
                                contextMenuItem.ToolTip = zipRow("CITY") & ", " & zipRow("ABBR")  
        
                                Me.rdMenuNarrowSearch.Items.Add(contextMenuItem)  
        
                            Next 
        
                            ScriptManager.RegisterClientScriptBlock(Me.Page, Me.Page.GetType, "showContextMenu", "showMenu();", True)  
        
                        End If 
        
                    End Sub 
        
                End Class

If I take the menu out of an updatePanel or ajax manager, the menu will show, but does not get updated. Any thoughts?

Daniel

Menu

answered on 14 Jun 2009

3 answers

464 views

import telerik.quickstart

Is this needed when using the loading panels as it doesn't seem to find it when I try to import telerik.quickstart or telerik.quickstart.xhtmlpage

Ajax

answered on 14 Jun 2009

3 answers

179 views

Base Stylesheet Always Appears on Page

I am using the latest Telerik controls Q1 2009 (not SP1) and no matter what I do the base stylesheet is always embedded on the page.

I implement a custom skin for a RadMenu. In the skin file I have the following:

    
            <telerik:RadMenu runat="server" Skin="Default" EnableEmbeddedBaseStylesheet="false" /> 
        
            <telerik:RadMenu runat="server" Skin="Subnav" SkinID="Subnav" EnableEmbeddedSkins="false" EnableEmbeddedBaseStylesheet="false" />

I only have ONE RadMenu throughout the entire solution, and it is on a Masterpage. The declaration for the menu on the page is the following:

    
            <telerik:RadMenu runat="server" ID="navigationMenu" SkinID="Subnav" EnableEmbeddedBaseStylesheet="false">......

Somehow the base stylesheet is still being embedded on the page. I am also using some other Telerik controls on the page such as: TreeView, Grid, Tabstrip...

The main thing I need to fix is the way menus float left by default:

    
            .RadMenu { 
        
            float:left; 
        
            position:relative; 
        
            whitewhite-space:nowrap; 
        
            }

I really just want it to appear as a block-level element. Any suggestions or ideas on how to overcome this? Thanks.
----

Edit: I've actually just removed every RadMenu from this project and the base stylesheet for RadMenu is still included on the page. Is this being referenced by another Telerik control somehow?

Menu

answered on 13 Jun 2009

2 answers

132 views

Layout of hierarchical tab

I have a hierarchical tab with 3 levels, I want to have a custom layout for my tab structure.

I want my tab structure this way, the first and second levels in horizontal direction,and the third level in vertical direction.

Tab1 Tab2 Tab3 Tab4
Tab1.1 Tab1.2 Tab1.3 Tab1.4 Tab1.5
Tab1.1.1
Tab1.1.2
Tab1.1.3
Tab1.1.4

Could anyone please help me on this.

Thanks,
Sharon Johnson

TabStrip

answered on 13 Jun 2009

2 answers

135 views

[Solved] access FileBrowserContentProvider from HttpHandler ProcessRequest

Hello,

I am building a customization of FIleBrowserContentProvider.

From within HttpHandler's ProcessRequest, is there a way to access the instance of FileBrowserContentProvider that "initiated" the http request, so that I can access some data that I need to get the file contents to serve?

Thanks.

Editor

answered on 12 Jun 2009

1 answer

282 views

[Solved] colorpicker not shown correctly within ModalPopup

hello Telerik,

I am currently developing an application which requires a color picker control. it must be shown within a modal popup with ShowIcon=true. The problem is that the color selection list isn't shown under the dropdown. It is shown in a wrong place.

the following code is my popup usercontrol

    
            <asp:Button runat="server" ID="hiddenTargetControlForModalPopup" Style="display: none" /> 
        
            <asp:Panel ID="selectPanel" runat="server" CssClass="popup" Style="display: none">  
        
                color:<telerik:RadColorPicker runat="server" ID="colorValue" ShowIcon="true" 
        
                    ShowEmptyColor="false">  
        
                </telerik:RadColorPicker> 
        
            </asp:Panel> 
        
            <ajaxToolkit:ModalPopupExtender ID="selectModalPopupExtender" runat="server" TargetControlID="hiddenTargetControlForModalPopup" 
        
                BackgroundCssClass="modalCover" BehaviorID="selectBackgroundPropertyModal" PopupControlID="selectPanel" 
        
                DropShadow="false">  
        
            </ajaxToolkit:ModalPopupExtender>

and here is the css

    
            .popup   
        
                {  
        
                    font-size:11px;  
        
                    background-color:#77235B;  
        
                    padding:10px;  
        
                    color:#FFFFFF;  
        
                    height:500px;     
        
                    width:500px;      
        
                }  
        
            .modalCover  
        
                {  
        
                    filter: progid:DXImageTransform.Microsoft.Alpha(opacity=50);  
        
                    opacity: 0.5;  
        
                    Z-INDEX: 100;  
        
                    LEFT: 0px;  
        
                    POSITION: absolute;  
        
                    TOP: 0px;  
        
                    background-color: #ffffff;  
        
                }

I hope you guys could help me with this. Thanks.

cheers,

Thomas

ColorPicker

answered on 12 Jun 2009

3 answers

100 views

ClicktoOpen Question

I just purchased the RadControls for Ajax and have a question concerning the ClicktoOpen option for the menu control. Is it possible to have the ClicktoOpen only at the root level, then mouse over for all of the children ?

Thanks.

Scott B

Menu

answered on 12 Jun 2009

1 answer

83 views

No date selected on postback - .Net 2.0 VS2005

I've got to be doing something stupid here. I have a DatePicker on a form. I can enter a date into the textbox or select a date from the popup, but when I click a button that does a postback, the .SelectedDate, .DateInput.Text, and DbSelectedDate properties are all null.
Here's how the DatePicker is defined:

    
            <telerik:RadDatePicker ID="radCancellationEffectiveDate" runat="server" Calendar-EnableMultiSelect="false" Calendar-EnableViewSelector="false" Skin="Office2007" Width="110px" > 
        
                <Calendar Skin="Office2007" UseColumnHeadersAsSelectors="False" UseRowHeadersAsSelectors="False" ShowRowHeaders="false" 
        
                                                ViewSelectorText="x" ShowOtherMonthsDays="true"> 
        
                </Calendar> 
        
                <DateInput DateFormat="MM/dd/yyyy" LabelCssClass="" MaxLength="10" Width="" ValidationGroup="Cancellation"> 
        
                </DateInput> 
        
            </telerik:RadDatePicker>

I'm not doing anything on the client or server to initialize or otherwise mess up the control.

Thanks,

Bob

Calendar

answered on 12 Jun 2009

10 answers

255 views

Slider display incorrect in Firefox

I have a slider that does not display properly in Firefox, though it displays correctly in Microsoft Internet Explorer.

I took snapshots of the IE and Firefox sliders, but there's no provision for attaching images in the forums, so I'll simulate it in text...
'<' and '>' are the arrows on the ends. === is the thick line to the left, || is the slider indicator, and --- is the clear line to the right of the indictor.

In IE, the slider looks like this:

<===============||--------------------------->

The same renders like this in Firefox:
<====||-------- >

In Firefox, the RadSliderTrack_slideImages <span> element has a width of 98px. In IE, the same element has a width of 200px.

What am I missing? Is there a bug for calculating the slider width for Firefox?

Thanks,
Rod Early

Slider

answered on 12 Jun 2009

1 answer

71 views

Recurrent Appointments question

Well i use the radscheduler to show some events from the database.. (actually i try to show the records of the Dotnetnuke Events module).
I have the appointment start and end dates.
My question is what is the simplest way to be able to be able to show for example an event of duration ...say 5 days to be shown in 5 respective days in the row?
I am using the example with the AppointmentTemplate which actually i insert a hyperlink with the eventname and a radtooltip for each appointment.

Scheduler

answered on 12 Jun 2009