Questions on UI for ASP.NET AJAX Forum

1 answer

170 views

Rad Calendar and post back outside of Calendar

Hi,

We are using a Rad Calendar for a control that we integrated into our website. Which works great. Until someone uses our "Add to Cart" button. I have mixed some JS and some of the Rad Calendar JS calls.

I have a box that, on click, opens my calendar and you can choose a day. Then the user chooses a time from a list when we get a post back from our service.

The issue is, if the user does not choose a "ticket" quantity, and chooses "add to cart," the calendar and the time stays chosen in the background, but my 'mask' resets to the default. I am using the Rad Calendar to call the functions on the front end to show and hide my 'masks'.

How would I write the function so that the 'masks' only show if there no Time and Date chosen, but also make the selections show in the boxes if they are chosen, but "Add to Cart" postback occurs.

So what I need is the Calendar value AND the Time to still show in the boxes if the "Add to Cart" button is chosen and there is an error, such as not quantity.

Any and all help is appreciated.

I have screen shots attached. I have put notes in the screen shots.

Myc JS and Calendar aspx code is below:

ASPX Code:

<asp:UpdatePanel runat="server" ID="up1" UpdateMode="Always">

<ContentTemplate>

<asp:Panel ID="Panel1" CssClass="ControlPanel" runat="server">

<asp:Table runat="server" ID="contents" CssClass="MuseumDateTimeTable">

<asp:TableRow ID="trCalendar" runat="server" VerticalAlign="Top">

<asp:TableCell ID="tcCalendar" runat="server" CssClass="CalendarOverallCell">

<div class="MuseumStepHeaderWrapper">

<div class="MuseumVariantStepText">

<asp:Label runat="server" ID="lblMuseumStepOne"><%=GetLocaleResourceString("Museum.StepOne")%></asp:Label>

</div>

<asp:Label runat="server" ID="ltNextAvailableDate" Text="" CssClass="MuseumNextAvailableDate" />

<%--

<div class="MuseumVariantChooseText">

<%=GetLocaleResourceString("Museum.MuseumChooseDateTimeText")%>

</div>--%>

</div>

<div id="MuseumSelectedDayBox">

<%--

<div id="DateSelectedTitle">

<%=GetLocaleResourceString("Museum.MuseumDateSelectedTitle")%></div>--%>

<div id="DateSelectedDay">

<asp:Literal runat="server" ID="ltMuseumDateSelectedDay" Text="" />

</div>

<asp:HiddenField runat="server" ID="ShowCalendar" ClientIDMode="Static" />

<telerik:RadCalendar ID="tkCalendar" runat="server" EnableMultiSelect="false" OnSelectionChanged="tkCalendar_SelectionChange"

CssClass="CalendarOverall" AutoPostBack="true" ShowRowHeaders="false" NavigationPrevToolTip="Previous Month"

NavigationNextToolTip="Next Month" Skin="Special" EnableEmbeddedSkins="false"

EnableEmbeddedBaseStylesheet="false" EnableMonthYearFastNavigation="false" DayNameFormat="Short"

UseColumnHeadersAsSelectors="false">

<ClientEvents OnDateSelecting="LoadingTimes" />

<ClientEvents OnInit="InitializeCalendar" />

<ClientEvents OnCalendarViewChanging="MonthChangeShow" />

<ClientEvents OnDateSelected="EnableTimes" />

<SelectedDayStyle CssClass="CalendarSelectedDay" />

<OtherMonthDayStyle CssClass="CalendarOtherMonthDay" />

<TitleStyle CssClass="CalendarTitle" />

<DayStyle CssClass="CalendarDay" />

<SpecialDays>

<telerik:RadCalendarDay Repeatable="Today" Date="" ItemStyle-CssClass="rcToday">

</telerik:RadCalendarDay>

</SpecialDays>

<CalendarDayTemplates>

<telerik:DayTemplate ID="BlackOutDayTemplate" runat="server">

<Content>

<div class="UnavailableKeyText">

<%=GetLocaleResourceString("Museum.EventCalendar.Unavailable")%>

</div>

</Content>

</telerik:DayTemplate>

<telerik:DayTemplate ID="SoldOutDayTemplate" runat="server">

<Content>

<div class="SoldOutDateKeyText">

<%=GetLocaleResourceString("Museum.EventCalendar.SoldOut")%>

</div>

</Content>

</telerik:DayTemplate>

<telerik:DayTemplate ID="PreviousDayTemplate" runat="server">

<Content>

<div class="PreviousDate">

</div>

</Content>

</telerik:DayTemplate>

</CalendarDayTemplates>

</telerik:RadCalendar>

</asp:TableCell>

<%--<asp:TableCell ID="tcCalSpacer" runat="server" Width="10px">

<asp:Label ID="Label1" runat="server" Text=" "></asp:Label>

</asp:TableCell> --%>

<asp:TableCell ID="tcAvailableTimes" runat="server" VerticalAlign="Top" CssClass="MuseumAvailableTimes">

<div class="MuseumStepHeaderWrapper">

<div class="MuseumVariantStepText">

<asp:Label runat="server" ID="lblMuseumStepTwo"><%=GetLocaleResourceString("Museum.StepTwo")%></asp:Label>

</div>

<%--

<div class="MuseumVariantChooseText">

<%=GetLocaleResourceString("Museum.MuseumChooseQuantityText")%>

</div>--%>

</div>

<asp:ListBox CssClass="timeListBox" AutoPostBack="True" OnSelectedIndexChanged="TimedListBoxSelectionChanged"

ID="TimesAvailable" runat="server"></asp:ListBox>

<asp:Label ID="lblTimesMessage" runat="server" CssClass="MuseumTimesMessage"></asp:Label>

</asp:TableCell></asp:TableRow>

</asp:Table>

<asp:HiddenField ID="hfDateLock" value="false" runat="server" />

<asp:HiddenField ID="hfLastDate" Value="" runat="server"/>

<div id="museumCalendarLoadingContainer">

</div>

<div id="museumCalendarLoadingContent">

<%=GetLocaleResourceString("Museum.MuseumCalendarEventProcessingText")%><br />

<img src="../App_Themes/Museum/images/museumLayout/loading.gif" /></div>

</asp:Panel>

</ContentTemplate>

</asp:UpdatePanel>

Javascript Code:

$(document).ready(function () {

$('#museumCalendarLoadingContainer').hide();

$('#museumCalendarLoadingContent').hide();

//$('table.RadCalendar_Special').hide();

$('#MuseumSelectedDayBox').removeClass('chosen');

//On initial start adjust generated size and prepend blank option to list

$(".timeListBox").attr('size', '1');

//TODO: If 'No Shows Today' is in list don't show 'Choose Time' text only show 'No Shows Today'

if ($('.timeListBox option[value="NoShows"]').length) {

//Do nothing and show 'No Shows' message

$('.timeListBox').addClass('SoldOutDateKeyText');

}else{

$('<option value="" selected>Choose a Time</option>').prependTo('.timeListBox');

}

//Default Choose Date on Dom Load and disable Choose Time

$('#DateSelectedDay').html('Choose Date');

if ($('#DateSelectedDay').html('Choose Date')) {

$('.timeListBox').prop('disabled', 'disabled').addClass('disabled');

$('<option value="" selected>Choose a Time</option>').prependTo('.timeListBox');

$('.timeListBox').before('<div class="disabledTrigger"></div>');

}

$('.disabledTrigger').click(function (e) {

$('#disabledMessage').hide();

$('<div id="disabledMessage">Please choose date first<span id="closeFieldAlert">X</span></div>').prependTo('body').hide().delay(300).slideDown(400).delay(6000).slideUp(400);

$('#closeFieldAlert, #disabledMessage').click(function () {

$('#disabledMessage').hide();

});

// alert("Please choose DATE first");

});

$(document).on('click', '#MuseumSelectedDayBox', function () {

$('#MuseumSelectedDayBox').addClass('chosen');

$("table.RadCalendar_Special").fadeIn(300);

$('#calendarModalCover').show();

});

//Show/Hide calendar and show calendar again on Month Change using the ASP.NET Hidden field.

function pageLoad(sender, args) {

if ($telerik.findElement(document, "ShowCalendar").value == "show") {

$("table.RadCalendar_Special").show();

};

$telerik.findElement(document, "ShowCalendar").value = "hide";

$("#calendardiv").click(function () {

$("table.RadCalendar_Special").show();

});

}

function MonthChangeShow(sender, eventArgs) {

$telerik.findElement(document,"ShowCalendar").value = "show";

}

//DateSelecting - OnDateSelecting

function LoadingTimes(sender, eventArgs) {

$('#museumCalendarLoadingContainer').show();

$('#museumCalendarLoadingContent').show();

$('#calendarModalCover').hide();

}

//Calendar Initialized - OnInit

function InitializeCalendar(sender) {

//alert('initialize calendar');

$('#museumCalendarLoadingContainer').hide();

$('#museumCalendarLoadingContent').hide();

$(".timeListBox").attr('size', '1');

}

//Enable Times on date selected - OnDateSelected - this is not really working because of postback

function EnableTimes(sender, eventArgs) {

// alert('enable times');

//sender.set_autoPostBack(true);//Kind of works

$('.timeListBox').prop('disabled', false).removeClass('disabled');

$('table.RadCalendar_Special').hide();

}

Thanks,

Carlos

Calendar

answered on 28 Jul 2014

4 answers

246 views

How to expand Mobile RadMenu child items by clicking anywhere on a parent item?

When the menu is in mobile render mode and we have sub menus, you have to tap the arrow to the right of the menu name to get the menu to expand. Is there a method to allow tapping anywhere on the sub-menu to have it expand ?

Menu

answered on 28 Jul 2014

5 answers

263 views

RadEditor Enabled

Hi,

We are using RadEditors Enabled property to turn on and off the control. With the new Q3 2013 update this does no longer work and we getting the following error "Sys.ArgumentException: Value must not be null for Controls and Behaviors".

Currently we have found the following workaround:

//reNotesSystem.Enabled = !readOnly; // Does not work with Telerik Q3 2013!!!

//reNotesStation.Enabled = !readOnly;

if (readOnly)

{

reNotesStation.EditModes = EditModes.Preview;

reNotesSystem.EditModes = EditModes.Preview;

reNotesStation.ToolbarMode = EditorToolbarMode.ShowOnFocus;

reNotesSystem.ToolbarMode = EditorToolbarMode.ShowOnFocus;

}

else

{

reNotesStation.EditModes = EditModes.All;

reNotesSystem.EditModes = EditModes.All;

reNotesStation.ToolbarMode = EditorToolbarMode.Default;

reNotesSystem.ToolbarMode = EditorToolbarMode.Default;

}

The work arround is not optimal and we would like to have the old behaviour back.

Kind regards

Robert Warnestam

Editor

answered on 28 Jul 2014

4 answers

155 views

Problem with some commands in IE11

Hi,

In your online demo, do the following in IE11:
1. Set the cursor somewhere in the middle of the first block of text
2. Press the Bold button
3. Type some text
4. Unpress the bold button
5. Type some text
6. Repeat step 2-5 a few times

What happens is that sometimes the bold doesn't flip, if I was typing bold it continues with bold even if unchecking...
Can't reproduce this in the previous release, only in 2014 Q1!

Regards
Andreas

Editor

answered on 28 Jul 2014

19 answers

578 views

[Solved] Radeditor Toolset wont work with IE11 EDGE Mode

It seems there is a Problem with RadEditor for ASP.net AJAX in IE 11 EDGE Mode!?!
Since I had updated my OS to windows 8.1. nothing happens when i click on any Tool in RadEditor.
Any workaround for me? Adding metaTag to force rendering in IE9 or 10 mode wont work.

Editor

answered on 28 Jul 2014

2 answers

167 views

[Solved] reach the event of Dynamic Control into RadWindow

Hello,

I'm working on a project that has a RadWindow.
I have added controls dynamically inside the RadWindow.
I try to close the RadWindow by clicking on a button that is located inside the RadWindow.
However, code execution doesn’t reach the button clicking event.

VB.NET:

Dim btn_PopupAccept1 As New Button()

Private Sub Page_Init(sender As Object, e As EventArgs) Handles Me.Init

With btn_PopupAccept1

.Text = "Accept"

End With

AddHandler btn_PopupAccept1.Click, AddressOf btn_PopupAccept1_Click

End Sub

Protected Sub RadTreeView1_NodeClick(sender As Object, e As Telerik.Web.UI.RadTreeNodeEventArgs) Handles RadTreeView1.NodeClick

Dim myLabel As Label = New Label()

Dim myTextBox As TextBox = New TextBox()

Dim myRadio As RadioButton = New RadioButton()

Dim myCheckBox As CheckBox = New CheckBox()

Dim spacer As LiteralControl = New LiteralControl(" ")

Dim br As LiteralControl = New LiteralControl("<br />")

Dim DivStart As LiteralControl = New LiteralControl("<div style=""padding:15px;""")

Dim DivEnd As LiteralControl = New LiteralControl("</div>")

myLabel.Text = "Control " & e.Node.Text

myLabel.ID = "lbl_PopupControl" & e.Node.Value

myTextBox.TextMode = TextBoxMode.Number

myTextBox.ToolTip = "numeric"

RadWindow1.VisibleOnPageLoad = True

RadWindow1.ID = "RadWindow1"

RadWindow1.Width = 500

RadWindow1.Height = 300

RadWindow1.Modal = True

RadWindow1.CenterIfModal = True

RadWindow1.ContentContainer.Controls.Add(DivStart)

RadWindow1.ContentContainer.Controls.Add(myLabel)

RadWindow1.ContentContainer.Controls.Add(spacer)

RadWindow1.ContentContainer.Controls.Add(myTextBox)

RadWindow1.ContentContainer.Controls.Add(br)

RadWindow1.ContentContainer.Controls.Add(btn_PopupAccept1)

RadWindow1.ContentContainer.Controls.Add(DivEnd)

End Sub

Protected Sub btn_PopupAccept1_Click(sender As Object, e As EventArgs)

Dim script As String

End Sub

ASPX:

<table cellpadding="0" cellspacing="0" class="auto-style1">

<tr>

<td class="auto-style2">

<telerik:RadTreeView ID="RadTreeView1" Runat="server">

</telerik:RadTreeView>

</td>

<td>

<telerik:RadWindowManager ID="RadWindowManager1" runat="server">

</telerik:RadWindowManager>

<telerik:RadWindow ID="RadWindow1" runat="server">

</telerik:RadWindow>

</td>

</tr>

</table>

How can I accomplish this??

Thanks,
Daniel.

Window

answered on 27 Jul 2014

4 answers

1.4K+ views

Convert grid column value from Boolean to customized string And applying filter on column

Hi,

I have a radgrid, which has one of the column say Status. The datatype of value for this column Status is bool.
I am setting text of each cell of Status column to depending on some conditions, in the rdgrid_ItemDataBound event.
string str = "A", "AAB", "ABC", "ABCD"
So, depending on some specific conditions met, str can be any of the above values.

If e.item.cell[9].Text == "True"
e.item.cell[9].Text = "A";

If e.item.cell[9].Text == "False"
e.item.cell[9].Text = "AAB";

If e.item.cell[9].Text == "True" && e.item.cell[7].Text = "False"
e.item.cell[9].Text = "ABCD";

I want to apply string filter on this column. Say I enter "ABCD" in the filter for this column of grid from UI, it should give me result for value "ABCD" only.

Thanks

Grid

answered on 26 Jul 2014

1 answer

94 views

MyWebService is undefined Error

function rowSelected(sender, args) {

UserID = getDataItemKeyValue(sender, args.get_gridDataItem());

currentRowIndex = args.get_gridDataItem().get_element().rowIndex;

$find("<%= RadTabStrip1.ClientID %>").set_selectedIndex(0);

MyWebService.GetUserByUserID(UserID, setValues)

}

I tried following link:
http://demos.telerik.com/aspnet-ajax/grid/examples/data-editing/insert-update-delete-client/defaultcs.aspx

and made a project
I change some method name and column name about database.

I made ServiceReference :

<telerik:RadScriptManager ID="ScriptManager1" runat="server">

<Services>

<asp:ServiceReference Path="MyWebService.asmx" />

</Services>

</telerik:RadScriptManager

>



but I will got error in JavaScript,MyWebService is undefined



I also tried

RadScriptManager.GetCurrent(this).Services.Add(new ServiceReference(ResolveUrl("MyWebService.asmx")));



but also the same.



Could somebody help me?

I use Windows 8.1,Visual Studio 2012 Professional,SQL Server 2014.

And browser is IE 11.

Grid

answered on 26 Jul 2014

2 answers

212 views

[Solved] Callback has failed, File Explorer in RadWindow

Hi

First post on Telerik Forum, hope will receive satisfactory and quick answer. Excuse me for my English and formatting....
I have created a User Control.ascx, inside it, I have RadFileExplorer.

<telerik:RadFileExplorer ID="RadFileExplorer1" Runat="server" EnableAsyncUpload="True" Width="100%">
<Configuration SearchPatterns="*.*" EnableAsyncUpload="True" UploadPaths="~/FolderSource" ViewPaths="~/FolderSource" ></Configuration>
</telerik:RadFileExplorer>

I am populating RadWindow with above UserControl.ascx dynamically.

<telerik:RadWindow ID="DocumentRadWindow" runat="server" Height="600px" Width="1000px" Modal="true">
<ContentTemplate>
<asp:PlaceHolder ID="DocumentPlaceHolder" runat="server" />
</ContentTemplate>
</telerik:RadWindow

//CodeBehind

protected void RadTabStripDocument_TabClick(object sender, Telerik.Web.UI.RadTabStripEventArgs e)
{
string TabText = e.Tab.Text;

if (TabText == "Upload Document")
{
UserControl DocumentSort = (UserControl)LoadControl("~/DesktopModules/Document/DocumentUpload/DocumentUpload.ascx");

DocumentPlaceHolder.Controls.Add(DocumentSort);
DocumentRadWindow.VisibleOnPageLoad = true;
}
}

During Upload,Delete and even clicking on Refresh button, it throws an pupup error "Callback has failed". And nothing happen, except loading image.

FileExplorer

answered on 25 Jul 2014

2 answers

138 views

RadEditor background

Hi

I use the next code for change the background the radeditor but the cursor appears in the center. i use internet explore. I have one question it is a error or exists a bug

Thanks.

Editor

answered on 25 Jul 2014