Telerik Forums
UI for ASP.NET AJAX Forum
1 answer
75 views

I have a RadGrid on my page, and have the ReorderColumnsOnClient property set to true. This all works fine.

However, I also have a requirement to hide columns which are dragged *off* the grid.

Anybody have any ideas on how I might do this?

PS - I'd prefer to do this with the the regular Telerik events, as opposed to using undocumented functionality which might break on the next version.

Here's the prototype aspx I created.

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>
<asp:Content ID="HeaderContent" runat="server" ContentPlaceHolderID="HeadContent">
</asp:Content>
<asp:Content ID="BodyContent" runat="server" ContentPlaceHolderID="MainContent">
    <h2>
        How do I detect a column has been dragged off the grid?
    </h2>
    <asp:ScriptManager runat="server" />
    <telerik:RadGrid ID="RadGrid1" runat="server" AutoGenerateColumns="False" DataSourceID="SqlDataSource1"
        GridLines="None">
        <ClientSettings AllowColumnsReorder="True" ReorderColumnsOnClient="True">
        </ClientSettings>
        <MasterTableView DataKeyNames="ProductID" DataSourceID="SqlDataSource1">
            <CommandItemSettings ExportToPdfText="Export to Pdf"></CommandItemSettings>
            <RowIndicatorColumn>
                <HeaderStyle Width="20px"></HeaderStyle>
            </RowIndicatorColumn>
            <ExpandCollapseColumn>
                <HeaderStyle Width="20px"></HeaderStyle>
            </ExpandCollapseColumn>
            <Columns>
                <telerik:GridBoundColumn DataField="ProductID" DataType="System.Int32" HeaderText="ProductID"
                    ReadOnly="True" SortExpression="ProductID" UniqueName="ProductID">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="ProductName" HeaderText="ProductName" SortExpression="ProductName"
                    UniqueName="ProductName">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="CategoryName" HeaderText="CategoryName" SortExpression="CategoryName"
                    UniqueName="CategoryName">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="UnitPrice" DataType="System.Decimal" HeaderText="UnitPrice"
                    SortExpression="UnitPrice" UniqueName="UnitPrice">
                </telerik:GridBoundColumn>
                <telerik:GridBoundColumn DataField="UnitsInStock" DataType="System.Int16" HeaderText="UnitsInStock"
                    SortExpression="UnitsInStock" UniqueName="UnitsInStock">
                </telerik:GridBoundColumn>
            </Columns>
        </MasterTableView>
    </telerik:RadGrid>
    <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:NorthwindConnectionString %>"
        SelectCommand="SELECT [ProductID], [ProductName], [CategoryName], [UnitPrice], [UnitsInStock] FROM [Alphabetical list of products]">
    </asp:SqlDataSource>
</asp:Content>

And the web.config's 
<add name="NorthwindConnectionString" connectionString="Data Source=.;Initial Catalog=Northwind;Integrated Security=True" providerName="System.Data.SqlClient" />


Eyup
Telerik team
 answered on 20 Jun 2012
3 answers
223 views
Hello,

I am using the ExtractValues method in my UpdateCommand method to retrieve a mapping of column names to values from an edited row. However, when I edit a row, the value mapped to its column stays the same in the hashtable, as well as in the grid. What could be the possible explanations for this?

protected void GrdConfig_UpdateCommand(object sender, GridCommandEventArgs e)
{
     Hashtable newValues = new Hashtable();
     ((GridEditableItem)e.Item).ExtractValues(newValues);
     Alert.Show(newValues["ColumnName"].ToString());
     ...
     Working SQL code
     ...
}
Pavlina
Telerik team
 answered on 20 Jun 2012
17 answers
939 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
Peter
Telerik team
 answered on 20 Jun 2012
1 answer
135 views
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
Bozhidar
Telerik team
 answered on 20 Jun 2012
3 answers
99 views
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.
Peter
Telerik team
 answered on 20 Jun 2012
2 answers
144 views
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
Danny
Top achievements
Rank 1
 answered on 20 Jun 2012
1 answer
142 views
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?
Dobromir
Telerik team
 answered on 20 Jun 2012
0 answers
148 views
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.
William
Top achievements
Rank 1
 asked on 20 Jun 2012
2 answers
562 views
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>
Pavlina
Telerik team
 answered on 20 Jun 2012
8 answers
1.0K+ views
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> 

Maria Ilieva
Telerik team
 answered on 20 Jun 2012
Narrow your results
Selected tags
Tags
+? more
Top users last month
Jake
Top achievements
Rank 1
RBarnes
Top achievements
Rank 1
Iron
Iron
Rami
Top achievements
Rank 1
Iron
Veteran
Nathan
Top achievements
Rank 1
Kumeri
Top achievements
Rank 1
Iron
Veteran
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Jake
Top achievements
Rank 1
RBarnes
Top achievements
Rank 1
Iron
Iron
Rami
Top achievements
Rank 1
Iron
Veteran
Nathan
Top achievements
Rank 1
Kumeri
Top achievements
Rank 1
Iron
Veteran
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?