Questions on UI for ASP.NET AJAX Forum

17 answers

920 views

Hi all!

I'm working in this ASPNET MVC project and i need to use a RadScheduler control.

As i found out in Telerik website the only way for it to work in MVC is to use WebServices and a SchedulerProvider.

We have set up a DbSchedulerProvider and a WebService based on the "WebServices" example of RadScheduler but we are facing some problems:

1. We cannot edit or delete the Appointment
2. We cannot see the delete icon

The markup we are using is as follows:

        <telerik:RadScriptManager runat="server" ID="RadScriptManager1"></telerik:RadScriptManager>

        <telerik:RadScheduler ID="RadScheduler1" runat="server"
            SelectedView="MonthView"
            SelectedDate="2009-02-02"
           TimeZoneOffset="03:00:00"
           StartEditingInAdvancedForm="false"
           ProviderName="SchedulerDataProvider"
           Culture="pt-PT"
           FirstDayOfWeek="Monday"
           LastDayOfWeek="Sunday">
           <AdvancedForm Modal="false" />
           <TimelineView GroupBy="Calendar" GroupingDirection="Vertical" />
           <WebServiceSettings Path="~/HoursMapValidation/HoursMap.asmx" ResourcePopulationMode="ServerSide" />
       </telerik:RadScheduler>

Notice that we had to use the ProviderName attribute to our Provider Name(SchedulerDataProvider) as declared in web.config.

What can cause this problem?

We are stuck with this for a couple of days now and we may have to use the ContextMenu if we cannot solve the problem in reasonable time.

Best Regards

Scheduler

answered on 20 Jun 2012

1 answer

120 views

Want UI/CSS Support

Firstly am very fresh to this components. I already used css to lay asp:labels and asp:textboxes etc ..even grid control and calender cntrls in asp.
We need UI help to design a big project which have lot of labels and its Associated Input fields to lay ...2 column ..3 column upto 4
So how we have writte our CSS.

I just go thru the a page which is fully filled with telerick controls. And i found we cant change their color or margins or paddings thru CSS. Only we can control its width from an external CSS file. Also dropdowns are rendering inside a table so i cant control its width with SELECT tag.

Also i found that in grid if column increase width also increase will break layout ..Pls help me
Thanks in Adv

UI Designer

General Discussions

answered on 20 Jun 2012

3 answers

91 views

Saving user id and other information with appointment

I need to save the user id for the appointment. Rather than choose a user from the dropdown when making the appointment, I need to add a user id from a querystring. This scenario would be choosing a patient on the patient list page to the scheduler page with the patients user id to save with the appointment.
What event would I use to save the info in C#?
I would like to save other information to my schedule table in SQL regarding the appointment. But I cant seem to find the best practice to do all of this.

Thanks.

Scheduler

answered on 20 Jun 2012

2 answers

127 views

[Solved] Uploading multiple files using AsyncUpload in Editor

Hi,

The current default upload facility in the Editor for files is rather cumbersome when multiple files are involved.

Is it possible to switch the default behaviour within the Editor to use the AsyncUpload control rather than what seems to be the default one of the standard Upload control?

Thanks

Tim Metcalfe

Editor

answered on 20 Jun 2012

1 answer

131 views

Is it possible to upload images with a prefix in RadEditors ImageManager

I want to identify images users upload to each individual user.

fr'instance if UserA and UserB uploads images in the ImageManager, I want it so UserA and UserB when using the ImageManager only see's and can edit their own images and not everyone else's. The problem with allowing everyone to upload to a single folder, is everyone can edit/delete/overwrite other users images, and it becomes a management nightmare, fr'instance if I delete a article I also want to know the associated images to that article so I code that they get deleted too.

I've got situations where there will be about 2000-3000 images for particular types of submissions , such as article submissions/ event submissions, ...etc. to create a single folder for each user and submission type may end up with 10 of thousands of folders, I just want a single folder for images for each submission type, eg. a single folder for all article submission images, a single folder for all events images and so on...

What's supprising is the ImageManager SearchPatterns Property seems to work for ViewPaths and DeletePaths but doesn't work for UpLoadPaths, fr'instance:

SearchPatterns="100_*." - where the 100 is say my userId. In this case when I view the ImageManager it shows only those images
that begin with "100_" (Which is really cool and exactly what I want)

What I've had to do - fr'instance for article submissions is in my form I've added a simple FileUpLoad control that is first hidden, and disabled the ImageManager in RadEditor. The user enter's stuff in the editor and submits (postback), I stored the article data in the database which returns the new articleId, then I set the SearchPatterns property of the ImageManager to equal (articleId+ "_*.*) the user is shown the form again, now with the FileUpLoad control shown and the ImageManager enabled in the RadEditor along with a message on the form " you can now add images to this article" - of course the form will be in edit mode now, so the Submission from this point will be an update not an insert. Now the user can add images via the FileUpLoad where the code will rename the image to "articleId_TheImageFileName" and upload it to the Articles folder, once it does this the user will only see the images added for this article in the ImageManager and can now add them into the RadEditor's text area.

Is there any way to prefix a image name for UploadPaths in the ImageManager?

Editor

answered on 20 Jun 2012

0 answers

130 views

RadGrid Update Validation

I have a RadGrid which when editing a record opens a Pop-Up edit window. Within the edit window is another RadGrid. What I would like to do is validate that any changes to that embedded grid have been saved prior to allowing the record to be updated. In my ItemCommand "Update" code I can tell if the embedded grid is still in edit mode or not, but I'm not sure how to prevent the Pop-Up edit window from closing. Attached is a picture of my scenario, perhaps that will be easier to understand.

Thanks.

Grid

asked on 20 Jun 2012

2 answers

514 views

RadGrid resize and repaint

What I have been trying to accomplish is having a RadGrid calculate its height to fill the rest of a RadPageView of a RadTabStrip/RadMultiPage control. The RadMultiPage should fill what is left of its RadPane, below all other elements that might be above the RadTabStrip. The first time the page is loaded, everything seems to be rendered and sized correctly, however, when resizing the window it seems that only the Grid that is currently visible gets resized, and all the others do not get rendered correctly even though they should all be repainted according to the scripts.

<telerik:RadSplitter ID="InquiryDetailSplitter" runat="server" Orientation="Vertical" OnClientResized="SetElementDimensions"

OnClientLoaded="SetElementDimensions">

<telerik:RadPane ID="InquiryDetailFieldsPane" runat="server" Width="300px">

...

</telerik:RadPane>

<telerik:RadPane ID="InquiryDetailGridsPane" runat="server">

<asp:Label ID="InquiryDetailPacketGridLabel" runat="server" CssClass="GridLabel" Font-Bold="true" Font-Size="80%"></asp:Label>

<telerik:RadGrid ID="InquiryDetailPacketGrid" runat="server" ShowFooter="true" AutoGenerateColumns="false" CssClass="AccountGrid"

OnItemCommand="InquiryDetailPacketGrid_ItemCommand" OnItemDataBound="InquiryDetailPacketGrid_ItemCommand">

<MasterTableView ClientDataKeyNames="Id" DataKeyNames="Id">

<Columns>

<telerik:GridTemplateColumn HeaderText="View" UniqueName="View" DataField="Id" Aggregate="Count" FooterAggregateFormatString="{0} Accounts" HeaderStyle-Width="85px">

<ItemTemplate>

<asp:LinkButton ID="ShowDetailLink" runat="server" CommandName="ShowDetail" CommandArgument='<%# Eval("ID") %>' Text="View" />

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

<ClientSettings>

<Scrolling AllowScroll="true" UseStaticHeaders="true" />

</ClientSettings>

<FooterStyle HorizontalAlign="Right" />

</telerik:RadGrid>

<asp:Label ID="InquiryDetailNotesLabel" runat="server" CssClass="GridLabel" Font-Bold="true" Font-Size="80%">Additional information</asp:Label>

<telerik:RadTabStrip ID="InquiryDetailNotesTabStrip" runat="server" MultiPageID="InquiryDetailNotesMultiPage" ShowBaseLine="false" AutoPostBack="false"

>

<Tabs>

<telerik:RadTab Text="Combined" Value="Combined" Visible="false" />

<telerik:RadTab Text="Transactions" Value="Transactions" Visible="false" />

<telerik:RadTab Text="Correspondence" Value="Correspondence" Visible="false" />

<telerik:RadTab Text="Comments" Value="Comments" Visible="false" />

<telerik:RadTab Text="Miscellaneous" Value="Misc" Visible="false" />

<telerik:RadTab Text="Online Activity" Value="OnlineActivity" />

<telerik:RadTab Text="Attachments" />

</Tabs>

</telerik:RadTabStrip>

<telerik:RadMultiPage ID="InquiryDetailNotesMultiPage" runat="server" SelectedIndex="0">

<telerik:RadPageView ID="CombinedPageView" runat="server" Visible="false" Height="100%">

<telerik:RadGrid ID="InquiryDetailCombinedGrid" runat="server" AutoGenerateColumns="false" Height="100%">

<MasterTableView Height="100%" >

<Columns>

<telerik:GridBoundColumn HeaderText="Date/Time" DataField="NoteDateTime" DataFormatString="{0:g}" UniqueName="NoteDateTime" DataType="DateTime" HeaderStyle-Width="130px" />

<telerik:GridBoundColumn HeaderText="Text" DataField="Text" UniqueName="Text" AllowSorting="false" />

<telerik:GridBoundColumn HeaderText="Collector" DataField="Collector" UniqueName="Collector" HeaderStyle-Width="100px" Visible="false" />

</Columns>

</MasterTableView>

<ClientSettings>

<Scrolling AllowScroll="true" UseStaticHeaders="true"/>

</ClientSettings>

</telerik:RadGrid>

</telerik:RadPageView>

<telerik:RadPageView ID="TransactionsPageView" runat="server" Visible="false" Height="100%">

<telerik:RadGrid ID="InquiryDetailTransactionsGrid" runat="server" AutoGenerateColumns="false" Height="100%">

<MasterTableView Height="100%">

<Columns>

<telerik:GridBoundColumn HeaderText="Date/Time" DataField="NoteDateTime" DataFormatString="{0:g}" UniqueName="NoteDateTime" DataType="DateTime" HeaderStyle-Width="130px" />

<telerik:GridBoundColumn HeaderText="Text" DataField="Text" UniqueName="Text" AllowSorting="false" />

<telerik:GridBoundColumn HeaderText="Collector" DataField="Collector" UniqueName="Collector" HeaderStyle-Width="100px" Visible="false" />

</Columns>

</MasterTableView>

<ClientSettings>

<Scrolling AllowScroll="true" UseStaticHeaders="true"/>

</ClientSettings>

</telerik:RadGrid>

</telerik:RadPageView>

<telerik:RadPageView ID="CorrespondencePageView" runat="server" Visible="false" Height="100%">

<telerik:RadGrid ID="InquiryDetailCorrespondenceGrid" runat="server" AutoGenerateColumns="false" Height="100%">

<MasterTableView Height="100%">

<Columns>

<telerik:GridBoundColumn HeaderText="Date/Time" DataField="NoteDateTime" DataFormatString="{0:g}" UniqueName="NoteDateTime" DataType="DateTime" HeaderStyle-Width="130px" />

<telerik:GridBoundColumn HeaderText="Text" DataField="Text" UniqueName="Text" AllowSorting="false" />

<telerik:GridBoundColumn HeaderText="Collector" DataField="Collector" UniqueName="Collector" HeaderStyle-Width="100px" Visible="false" />

</Columns>

</MasterTableView>

<ClientSettings>

<Scrolling AllowScroll="true" UseStaticHeaders="true"/>

</ClientSettings>

</telerik:RadGrid>

</telerik:RadPageView>

<telerik:RadPageView ID="CommentsPageView" runat="server" Visible="false" Height="100%">

<telerik:RadGrid ID="InquiryDetailCommentsGrid" runat="server" AutoGenerateColumns="false" Height="100%">

<MasterTableView Height="100%">

<Columns>

<telerik:GridBoundColumn HeaderText="Date/Time" DataField="NoteDateTime" DataFormatString="{0:g}" UniqueName="NoteDateTime" DataType="DateTime" HeaderStyle-Width="130px" />

<telerik:GridBoundColumn HeaderText="Text" DataField="Text" UniqueName="Text" AllowSorting="false" />

<telerik:GridBoundColumn HeaderText="Collector" DataField="Collector" UniqueName="Collector" HeaderStyle-Width="100px" Visible="false" />

</Columns>

</MasterTableView>

<ClientSettings>

<Scrolling AllowScroll="true" UseStaticHeaders="true"/>

</ClientSettings>

</telerik:RadGrid>

</telerik:RadPageView>

<telerik:RadPageView ID="MiscellaneousPageView" runat="server" Visible="false" Height="100%">

<telerik:RadGrid ID="InquiryDetailMiscellaneousGrid" runat="server" AutoGenerateColumns="false" Height="100%">

<MasterTableView Height="100%">

<Columns>

<telerik:GridBoundColumn HeaderText="Date/Time" DataField="NoteDateTime" DataFormatString="{0:g}" UniqueName="NoteDateTime" DataType="DateTime" HeaderStyle-Width="130px" />

<telerik:GridBoundColumn HeaderText="Text" DataField="Text" UniqueName="Text" AllowSorting="false" />

<telerik:GridBoundColumn HeaderText="Collector" DataField="Collector" UniqueName="Collector" HeaderStyle-Width="100px" Visible="false" />

</Columns>

</MasterTableView>

<ClientSettings>

<Scrolling AllowScroll="true" UseStaticHeaders="true"/>

</ClientSettings>

</telerik:RadGrid>

</telerik:RadPageView>

<telerik:RadPageView ID="OnlineActivityPageView" runat="server" Height="100%">

<telerik:RadGrid ID="InquiryDetailOnlineActivityGrid" runat="server" AutoGenerateColumns="false" Height="100%">

<MasterTableView Height="100%">

<Columns>

<telerik:GridBoundColumn HeaderText="Date/Time" DataField="Date" DataFormatString="{0:g}" UniqueName="OnlineActivityDate" DataType="DateTime" HeaderStyle-Width="130px" />

<telerik:GridTemplateColumn HeaderText="Activity" UniqueName="Activity">

<ItemTemplate>

<%# AccountActionType((IAccountAction)Container.DataItem)%>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn HeaderText="User" DataField="UserFullName" UniqueName="UserFullName" />

<telerik:GridBoundColumn HeaderText="Details" DataField="Details" UniqueName="Details" />

</Columns>

</MasterTableView>

<ClientSettings>

<Scrolling AllowScroll="true" UseStaticHeaders="true"/>

</ClientSettings>

</telerik:RadGrid>

</telerik:RadPageView>

<telerik:RadPageView ID="AttachmentsPageView" runat="server" Height="100%">

<telerik:RadGrid ID="InquiryDetailAttachments" runat="server" AutoGenerateColumns="false" Height="100%">

<MasterTableView Height="100%">

<Columns>

<telerik:GridBoundColumn HeaderText="Date/Time" DataField="UploadDate" DataFormatString="{0:g}" UniqueName="UploadDate" DataType="DateTime" HeaderStyle-Width="130px" />

<telerik:GridTemplateColumn HeaderText="Name" UniqueName="Name">

<ItemTemplate>

<%# AttachmentLink((CawFile)Container.DataItem) %>

</ItemTemplate>

</telerik:GridTemplateColumn>

<telerik:GridBoundColumn HeaderText="File Size" DataField="FormattedFileSize" UniqueName="FormattedFileSize" />

</Columns>

</MasterTableView>

<ClientSettings>

<Scrolling AllowScroll="true" UseStaticHeaders="true"/>

</ClientSettings>

</telerik:RadGrid>

</telerik:RadPageView>

</telerik:RadMultiPage>

</telerik:RadPane>

</telerik:RadSplitter>

<telerik:RadScriptBlock ID="GridDimensionScriptBlock" runat="server">

<script type="text/javascript">

// this function will set the MultiPage dimensions and then for every PageView in the MultiPage,

// the nested RadGrid within the PageView will be redrawn to fulfill the new CSS rules.

function SetElementDimensions(sender, args) {

// set the dimensions according to the new window size

var setHeight = SetMultiPageDimensions();

// get the multi page control to interate through the page views

var telerikMultiPage = $find("<%= InquiryDetailNotesMultiPage.ClientID %>");

var pageCollection = telerikMultiPage.get_pageViews();

// iterate the page views

for (var i = 0; i != pageCollection._data.length; ++i) {

var pageIteration = pageCollection._data[i];

// check the size on the Page View element to make sure that it is sized at 100

var pageElement = $("#" + pageIteration._element.id);

pageElement.height(setHeight);

// if the page has children, use them to select the grid by its id and set rgDataDiv height

if (pageIteration._element.children.length > 0) {

var nestedGridId = pageIteration._element.children[0].id;

var nestedGrid = $find(nestedGridId);

$("#" + nestedGridId).height(setHeight);

nestedGrid.repaint();

}

// Calculates and sets the height of the MultiPage element. This is accomplished by getting the top offset of the tabStrip and the

// height of the tabStrip. These dimensions are then added together and subtracted from the height of the splitter itself for

// the needed difference.

function SetMultiPageDimensions(sender, args) {

// get overall height available

var splitterDivHeight = $("#" + "<%= InquiryDetailSplitter.ClientID %>").height();

var tabStripDiv = $("#" + "<%= InquiryDetailNotesTabStrip.ClientID %>");

// figure out the offset of the tab strip, and the height of the tabStrip to use in calculating available space

// additional two: one for border and one for extra space

var topOffset = tabStripDiv.offset().top + tabStripDiv.height() + 2;

var additionalInfoMultiPageDiv = $("#" + "<%= InquiryDetailNotesMultiPage.ClientID %>");

var heightToSet = splitterDivHeight - topOffset;

additionalInfoMultiPageDiv.height(heightToSet);

return heightToSet;

}

</script>

</telerik:RadScriptBlock>

Ajax

answered on 20 Jun 2012

8 answers

973 views

[Solved] Popup position for RadDatePicker

Hi,

I need to change the position of the RadDatePicker popup to be slightly above where it opens up as default.

I've found the example for ShowPopupAbove which works OnKeyPress but I can't for the life of me get it to work when the DatePopupButton is clicked.

Could someone please point out what event I need to use? I tried this (and 100 other combinations) with no success:

    
                                    <telerik:RadDatePicker ID="RadDatePicker1" Width="110" runat="server">                             
        
                                        <DatePopupButton OnClick="ShowPopupAbove" />                             
        
                                    </telerik:RadDatePicker>