Questions on UI for ASP.NET AJAX Forum

1 answer

102 views

Fire the editors paste command from a button outside the editor

I am using the editor as a textbox and want to use a button outside the editor to fire it's paste command.
The function below works to insert text but what I am trying to do is paste a screenshot from the clipboard into the editor using IE 11 clipboardData.

function Paste() {

var editor = $find("<%=RadEditor1.ClientID%>");
//var clipBoardData = window.clipboardData.getData("URL");
editor.setFocus();
editor.pasteHtml("1234");
}

Using the editor's paste button works for this but I am trying to use the editor to load the screenshot and as a large preview textbox before saving it.

when I hide the toolbar if you put the cursor in the editor and do a ctrl - v it does paste the screenshot but if you right click there is no paste option.

I am trying to have a paste button outside the editor to make it more intuitive for the users.

Thanks in advance,
Dave

Editor

answered on 19 Nov 2014

1 answer

82 views

RadGrid not hiding expand column after changing of column position.

I have a radgrid where I hide the expand column using the code mentioned in the link below.
http://www.telerik.com/help/aspnet-ajax/grid-hide-expand-collapse-images-when-no-records-in-self-referencing-hierarchy.html

This works fine and hide the expand button correctly.
The problem arises when I move the columns.
On moving a column to a different position the grid reloads and then the Expand button appears.

Why is this happening? How can i solve the issue.
One strange thing I have observered is that on moving the columns around the page postback and the grid_PreRender event fires before the grid_NeedDataSource. I think PreRender event should fire after NeedDataSource event. Can this be the cause of this issue? How can I solve it?

Grid

answered on 19 Nov 2014

3 answers

98 views

Getting Row and/or DataKeyValues on Server Side given ItemIndexHierarchical

I am trying to make the drag and drop from a tree view put the dragged content into the appropriate section of a hierarchical grid (adjacent to the row it was dropped on).

I am capturing the itemIndexHierarchical of a row in the OnRowMouseOver event on the client. I am saving this in a hidden field so that I can look up the row in some server code (the event handler for the tree view drop event).

How can I get the row and or dataKeyValues given the itemIndexHierarchical key? Surely there is a server side call that can do this for me, am I missing something?

Thanks,
Kenny Long

Grid

answered on 18 Nov 2014

9 answers

125 views

Varying ContextMenu's

We have a PanelBar that we would like to add a context menu only to the children (RadPanelItem's) that would allow users to add the link to their favorites (within site). And if they are within the Favorites Panel item and they right click it would be "Remove link"

The user couldn't click on "Home" to "Add to Favorites" but they could click on "Organization Chart". Once they linked "Organization Chart" as a favorite, if they right click again it would be "Remove Favorite", as well as if they were under the "Favorites" panel and right clicked.

Is it possible?

<telerik:RadPanelBar runat="server" ID="RadPanelBar1"

ExpandMode="FullExpandedItem"

Width="300" PersistStateInCookie="True" Height="100%"

OnClientItemExpand="OnClientItemExpand">

<Items>

<telerik:RadPanelItem Text="HOME" Expanded="True" ImageUrl="images/Menu/Home.png" Visible="true" Font-Bold="true">

<Items>

<telerik:RadPanelItem ImageUrl="images/Menu/Home_OrgChart.png" NavigateUrl="/pdf/OrgChart.pdf" Target="_blank" Text="Organizational Chart"></telerik:RadPanelItem>

<telerik:RadPanelItem ImageUrl="images/Menu/Home_PersonalPolicy.png" NavigateUrl="/pdf/OrgChart.pdf" Target="_blank" Text="Personnel Policy"></telerik:RadPanelItem>

<telerik:RadPanelItem ImageUrl="images/Menu/Home_Phone-16.png" NavigateUrl="/pdf/VoiceMail.pdf" Target="_blank" Text="Voice Mail Reference Sheet"></telerik:RadPanelItem>

</telerik:RadPanelItem>

</Items>

</telerik:RadPanelItem>

<telerik:RadPanelItem Text="FAVORITES" Expanded="True" ImageUrl="images/Menu/Favorites.png" Visible="false" Font-Bold="true">

</telerik:RadPanelItem>

</Items>

<ExpandAnimation Type="OutQuart" />

<CollapseAnimation Type="OutQuart" />

</telerik:RadPanelBar>

PanelBar

answered on 18 Nov 2014

1 answer

129 views

Using CloudUpload / Retrieving Files for Attachments

I'm writing a page that requires me to upload the file to the Azure for the purposes of keeping an archive. So I have the upload working but I can't seem to figure out how to access the files. So I have this to loop through after the upload and attach it to an e-mail notification.

//Attachments
CloudStorageAccount storageAccount = CloudStorageAccount.Parse(ConfigurationManager.AppSettings["StorageConnectionString"].ToString());
CloudBlobClient blobClient = storageAccount.CreateCloudBlobClient();
CloudBlobContainer container = blobClient.GetContainerReference("sitedata");
foreach (Telerik.Web.UI.CloudUploadFileInfo file in RadCloudUpload1.UploadedFiles)
{
CloudBlockBlob blockBlob = container.GetBlockBlobReference(file.KeyName);
Stream mem = new MemoryStream();
blockBlob.DownloadToStream(mem);
MAttach = new System.Net.Mail.Attachment(mem, file.OriginalFileName);
msg.Attachments.Add(MAttach);
}

I'm getting 0k attachments. Any suggestions or thoughts?

Thanks,

Richard

CloudUpload

answered on 18 Nov 2014

4 answers

85 views

Client-Side EventArgs are Mutable

I'm posting this for future reference and for general discussion.

In my implementation, I'm using ITemplate for custom GridItemTemplateColumns and assigning Javascript Method Names to the ClientEvents of Rad<Controls> that are "InitiatedIn" (ITemplate Implementation Method) my RadGrid, additionally, I've assigned DataKeys & ClientDataKeys in the page markup of the RadGrid Control.

The concept is thus to get the ClientDataKeys from the Telerik.Web.UI.GridDataItem (Client-Side) using the eventArg passed to it. I successfully did this, but discovered that the eventArg is mutable, which was unexpected.

Here is a partial example to follow on:

01.//C# (MyCustomGridItemTemplateColumn.cs file)

02.public class MyCustomGridItemTemplateColumn : ITemplate

03. {

04. public event RadComboBoxSelectedIndexChangedEventHandler OnMyControlSelectedIndexChanged;

05.

06. public string ClientHandlerMethod = "MyLibrary.UI.MyControl.OnMyControlChanging";

07. public string ColumnName { get; private set; }

08.

09. public MyCustomGridItemTemplateColumn(string ColumnName)

10. {

11. this.ColumnName = ColumnName;

12. this.OnMyControlSelectedIndexChanged += MyControlGridItemTemplateColumn_OnMyControlSelectedIndexChanged;

13. }

14.

15. //Exposes the event to be handled on the codebehind

16. void MyControlGridItemTemplateColumn_OnMyControlSelectedIndexChanged(object sender, RadComboBoxSelectedIndexChangedEventArgs e) {}

17.

18. public void InstantiateIn(Control container)

19. {

20. RadComboBox cbMyControl = new RadComboBox();

21. cbMyControl.ID = "cbMyControl_" + ColumnName;

22. cbMyControl.DataBinding += cbMyControl_DataBinding;

23. cbMyControl.SelectedIndexChanged += cbMyControl_SelectedIndexChanged;

24. cbMyControl.OnClientSelectedIndexChanging = @"function(sender, e){e._cancel = true;console.log('MyControl [IndexChanging] => %o %o', sender, e);}";

25. cbMyControl.OnClientSelectedIndexChanged = @"function(sender, e){console.log('MyControl [IndexChanged] => %o %o',sender, e);}";

26. cbMyControl.EnableViewState = false;

27. container.Controls.Add(cbMyControl);

28. }

29.

30. void cbMyControl_SelectedIndexChanged(object sender, RadComboBoxSelectedIndexChangedEventArgs e)

31. {

32. this.OnMyControlSelectedIndexChanged(sender, e);

33. }

34.

35. void cbMyControl_DataBinding(object sender, EventArgs e)

36. {

37. RadComboBox cbMyControl = (RadComboBox)sender;

38. //GridDataItem container = (GridDataItem)cbMyControl.NamingContainer;

39. //MyClassObjectModel model = (MyClassObjectModel)container.DataItem;

40.

41. cbMyControl.Items.Add(new RadComboBoxItem("Please Select", "NotSet"));

42. cbMyControl.Items.Add(new RadComboBoxItem("First Choice", "1019q231"));

43. cbMyControl.Items.Add(new RadComboBoxItem("Second Choice", "21vc3131"));

44. cbMyControl.Items.Add(new RadComboBoxItem("Third Choice", "34Af3343"));

45.

46. cbMyControl.OnClientSelectedIndexChanging = String.Format(@"function(sender, e){{ e._cancel = !({0}(sender, e));{1}}}",

47. ClientHandlerMethod,

48. @" console.log(""MyControl [IndexChanging] %o %o "", sender, e);"

49. );

50. }

51.}

Now my library Example

01./* JS - Handler.js file */

02.(function(window){

03.window.MyLibrary = {

04. "UI" : {

05. "MyControl" : {

06. "OnMyControlChanging" : function (sender, e) {

07. var

arg = MyLibrary.Common.GetDataKeyValues(e); }

08. }

09. },

10. "Common" : {

11. "GetDataKeyValues" : function(e) {

12. var max = 4;

13. var iteration = 0;

14.

15. var result = {

16. "FirstKeyID": {},

17. "SecondKeyID": {},

18. "ThirdKeyID": {}

19. };

20.

21. var gridTableView = e.get_item();

22. iteration = 0;

23. while (!(gridTableView instanceof Telerik.Web.UI.GridTableView) && !(iteration >= max)) {

24. gridTableView = gridTableView.get_parent() || gridTableView; //null check on get_parent()

25. iteration += 1;

26. }

27.

28. gridTableView.get_dataItems(); //e has now been mutated; the results of this method call do not matter

29.

30. var gridDataItem = e.get_item();

31. iteration = 0;

32. while (!(gridDataItem instanceof Telerik.Web.UI.GridDataItem) && !(iteration >= max)) {

33. gridDataItem = gridDataItem.get_parent() || gridDataItem; //null check on get_parent()

34. iteration += 1;

35. }

36.

37. result.FirstKeyID = gridDataItem.GetDataKeyValue("FirstKeyID");

38. result.SecondKeyID = gridDataItem.GetDataKeyValue("SecondKeyID");

39. result.ThirdKeyID = gridDataItem.GetDataKeyValue("ThirdKeyID");

40.

41. return result;

42. }

43. }

44.};

45.}(window));

Grid

answered on 18 Nov 2014

1 answer

116 views

Broken Tools in Inline Mode at 100% Width

Can anyone reproduce this? The editing tools are all out of whack when I set inline mode and make the width 100%. I'm using it inside a Layout

<telerik:LayoutRow>

<Columns>

<telerik:LayoutColumn Span="12" SpanXs="12" SpanSm="12">

<div style="background-color: #EEEEEE; margin-top: 10px;">

<telerik:RadEditor ID="RadEditor1" runat="server" EditType="Inline" Width="100%" Enabled="True">

<Content>

<div>

<h2 class="titleText">RadEditor for ASP.NET AJAX</h2>

<p style="text-align: justify;">

<span style="color: #4f6128; font-size: 19px;"><strong>RadEditor</strong></span><span style="color: #4f6128;">

</span>is not simply an HTML

<a href="#HTMLDescription">

<sup>1</sup>

</a> Editor. It is what Microsoft chose to use in <strong>MSDN</strong>, <strong>CodePlex</strong>, <strong>TechNet</strong>, <strong>MCMS</strong> and even as an alternative to the default editor in

<a href="http://www.telerik.com/products/aspnet-ajax/sharepoint.aspx">SharePoint</a>.

</p>

</div>

</Content>

</telerik:RadEditor>

</div>

</telerik:LayoutColumn>

</Columns>

</telerik:LayoutRow>

Editor

answered on 18 Nov 2014

17 answers

380 views

NestedViewTemplate Disabling Postbacks

I have a radgrid with a NestedViewTemplate which contains a custom user control, which contains another grid.

I have turned off all click events on the nested grid, but still when I click anywhere on the nested grid, it still runs the grd_Init and reinitializes everything.

I want it to just sit there and do absolutely nothing if someone clicks the child grid. My NestedView is setup like so. Keep in mind, I do all my databinding and initialization and everything else in the code behind.

    
            <telerik:RadGrid ID="grdComponent" runat="server">  
        
                     <MasterTableView GroupLoadMode="Server">  
        
                           <NestedViewTemplate> 
        
                               <uc:ReviewerGrid ID="ReviewerGrid" runat="server" ReviewId='<%# Eval("ReviewId") %>' /> 
        
                           </NestedViewTemplate> 
        
                        <DetailTables> 
        
                        </DetailTables> 
        
                       </MasterTableView> 
        
            </telerik:RadGrid>

For my child grid, I specifically set these commands on my grid init, so I thought this should take care of any clicks, but it doesn't.

    
                        With grdReviewer  
        
                            .ClientSettings.EnablePostBackOnRowClick = False 
        
                            .AllowSorting = False 
        
                            .ClientSettings.Selecting.AllowRowSelect = False 
        
                        End With

I still need the parent row to have the click event, just not the embedded grid.

Any ideas?

thanks.

Grid

answered on 18 Nov 2014

6 answers

196 views

RadTooltip ignores content if target hyperlink has title

I am using a RadTooltip instance to display some text and I am adding my content server-side to the tooltip's Controls collection. I set the TargetControlID property to a hyperlink. The tooltip ShowEvent is set to OnClick.

If the target hyperlink has its ToolTip property set, then the tooltip uses that text as its content and ignores the content I added via the Controls collection.

If the target hyperlink does not have its ToolTip property set, then the content is correctly displayed.

Is there something I need to do to override this behavior or is this a known bug?

I want the target hyperlink ToolTip/title text displayed when the user mouses over the link, and the rich content (RadTooltip.Controls) to be displayed when the user clicks the link.

ToolTip

answered on 18 Nov 2014

10 answers

543 views

RadButton and ASP.NET 4.5 Unobtrusive Validation

Usually when the RadButton is used for submitting a form, the page also contains validation controls that check the entered data. The following sample presents such a setup:

<asp:ScriptManager ID="Scriptmanager1" runat="server" />

<asp:TextBox ID="Textbox1" runat="server" />

<telerik:RadButton ID="RadButton1" runat="server" Text="Submit" />

<asp:RequiredFieldValidator runat="server" ID="RequiredFieldValidator1" ErrorMessage="Enter a value in the input"

ControlToValidate="Textbox1" />

If you place this markup in an ASP.NET 4.5 website and run it, you will encounter the following exception:

WebForms UnobtrusiveValidationMode requires a ScriptResourceMapping for 'jquery'. Please add a ScriptResourceMapping named jquery(case-sensitive).

According to Microsoft, Unobtrusive Validation is the new way ASP.NET validation works and by default it requires jQuery. The following approach will help you register the jQuery that is shipped with the RadControls for ASP.NET AJAX so that it can be used by the Unobtrusive Validation feature:

Add a Global.asax file.
Put the following code in the Application_Start event handler:

var def = new ScriptResourceDefinition()

{

ResourceName = "Telerik.Web.UI.Common.jQuery.js",

ResourceAssembly = System.Reflection.Assembly.GetAssembly(typeof(Telerik.Web.UI.RadWebControl))

};

ScriptManager.ScriptResourceMapping.AddDefinition("jquery", def);

NOTE: In order for Unobtrusive Validation to work, the default ASP ScriptManager needs to be instructed to register jQuery before the core scripts that provide client-side validation : http://connect.microsoft.com/VisualStudio/feedback/details/748064/unobtrusive-validation-breaks-with-a-script-manager-on-the-page.

Button

answered on 18 Nov 2014