Questions on UI for ASP.NET AJAX Forum

1 answer

151 views

Persisting multiple RadDatePicker item values under a single GridBoundColumn

I'm trying to retrieve some date range filter values when a user revisits a search page after navigating away. I've implemented a date range picker using two RadDatePicker items under one GridBoundColumn as below:

<telerik:GridBoundColumn UniqueName="SomeDateRange" DataField="SomeDate" DataType="System.DateTime"

ShowFilterIcon="false" SortExpression="SomeDate" HeaderStyle-Width="330px"

FilterControlWidth="100px" ItemStyle-HorizontalAlign="Center" HeaderStyle-HorizontalAlign="Center">

<FilterTemplate>

<div class="dateRange">

<asp:Label runat="server" ID="From"><%# LabelFrom%></asp:Label>

<telerik:RadDatePicker ID="FromOrderDatePicker" AutoPostBackOnFilter="true" runat="server" Width="140px" ClientEvents-OnDateSelected="FromDateSelected"

MinDate="07-04-1996" MaxDate="05-06-2050" FocusedDate="07-03-2014" DbSelectedDate='<%# startDate %>'/>

</div>

<div class="dateRange">

<asp:Label runat="server" ID="To"><%# LabelTo%></asp:Label>

<telerik:RadDatePicker ID="ToOrderDatePicker" AutoPostBackOnFilter="true" runat="server" Width="140px" ClientEvents-OnDateSelected="ToDateSelected"

MinDate="07-04-1996" MaxDate="05-06-2050" FocusedDate="07-03-2014" DbSelectedDate='<%# endDate %>' />

</div>

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

<script type="text/javascript">

function FromDateSelected(sender, args) {

var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");

var ToPicker = $find('<%# ((GridItem)Container).FindControl("ToOrderDatePicker").ClientID %>');

var fromDate = FormatSelectedDate(sender);

var toDate = FormatSelectedDate(ToPicker);

tableView.filter("SomeDateRange", fromDate + " " + toDate, "Between");

}

function ToDateSelected(sender, args) {

var tableView = $find("<%# ((GridItem)Container).OwnerTableView.ClientID %>");

var FromPicker = $find('<%# ((GridItem)Container).FindControl("FromOrderDatePicker").ClientID %>');

var fromDate = FormatSelectedDate(FromPicker);

var toDate = FormatSelectedDate(sender);

tableView.filter("SomeDateRange", fromDate + " " + toDate, "Between");

}

function FormatSelectedDate(picker) {

var date = picker.get_selectedDate();

var dateInput = picker.get_dateInput();

var formattedDate = dateInput.get_dateFormatInfo().FormatDate(date, dateInput.get_displayDateFormat());

return formattedDate;

}

</script>

</telerik:RadScriptBlock>

</FilterTemplate>

</telerik:GridBoundColumn>

However, I'm currently unable to persist the RadDatePicker values using the GridSettingsPersister. I believe this is because they have a parent grid item GridBoundColumn. Grid settings persister is implemented similar to the example here: http://www.telerik.com/help/aspnet-ajax/grid-saving-settings-on-per-user-basis.html

Has anyone managed to persist RadDatePicker or any child items like this using a grid settings persister or have any suggestions on how to do this?

Grid

answered on 25 Mar 2014

7 answers

220 views

Spell Check Server and JSON Errors

Hi,

I am using the Rad Editor version 2008.1.415.20 w/ VS 2005 and am having trouble implementing the Spell Check. If there is no HTML entered into the editor and click on the spell check icon I get a 'Spell Check Handler Server Error: 12030'...I have been unable to find any info on this error at all. If I enter something into the editor and attempt to spell check I get a JS error in the Resource.axd file. The error is 'Sys.ArgumentException: Cannot Deserialize. The data does not correspond to a valid JSON. Parameter name:Data'

The page itself is pretty simple, just an Ajax Panel, the Editor and a couple of buttons. It is derived from a Master Page but nothing overly fancy....see below for a sample...

Any thoughts/assistance would be appreciated!

K

<%

@ Page Language="VB" MasterPageFile="~/MasterPages/mainsite.master" AutoEventWireup="false" CodeFile="ContentTest.aspx.vb" Inherits="Test_ContentTest" title="" %>

<%

@ Register TagPrefix="telerik" Namespace="Telerik.Web.UI" Assembly="Telerik.Web.UI" %>

<

asp:content id="Content2" contentplaceholderid="c2" runat="server">

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

</script>

</telerik:RadCodeBlock>

<div style="background-color: #191944; text-align: right" class="address_label_white"> Administration - Title Block  

</div>

<br />

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" EnableAJAX="true" LoadingPanelID="LoadingPanel1">

<uc:Header ID="ucHeader" runat="server" pageTitle="" />

<br />

<tr>

<legend>Set Content </legend>

<tr>

<telerik:RadEditor runat='server' Skin='Vista' ID='radEdit1' AutoResizeHeight=false BackColor="White" ForeColor='green' height='310' Width='980' ToolsFile="../ToolsFiles/TitleEditor.xml" >

<telerik:EditorCssFile Value="~/EditorContentArea.css" />

</CssFiles>

</telerik:RadEditor>

</td>

</tr>

</table>

</fieldset>

</td>

</tr>

<tr>

</td>

</span>

</td>

</tr>

</table>

</td>

</tr>

</table>

</div>

</telerik:RadAjaxPanel>

<telerik:RadAjaxLoadingPanel ID="LoadingPanel1" runat="server" BackColor="window" IsSticky="true"

EnableViewState="false" Transparency="15" Style="position: absolute; left: 425px; top: 275px">

<uc:LoadingPanel ID="UCLoadingPanel1" runat="server" />

</telerik:RadAjaxLoadingPanel>

</

asp:Content>

Editor

answered on 25 Mar 2014

1 answer

83 views

Export individual DetailsTable by clicking button in MasterTable

I am creating a RadGrid from code behind. The MasterTable carries a template column with an Export button to export the underlying DetailsTable. The DetailsTable is not expanded by default. It only expands when (>) is clicked on the MasterTable.

The problem is Export doesnt work as it should. It exports the data from the MasterTable and not the DetailsTable.

Here is some portion of my code:
.....
Creating RadGrid1...
Creating a Master Table.....
Adding template column...
TemplateColumn = new GridTemplateColumn();
string ExportColumnName = "Export";
TemplateColumn.ItemTemplate = new MyExportTemplate(ExportColumnName);
TemplateColumn.HeaderText = ExportColumnName;
RadGrid1.MasterTableView.Columns.Add(TemplateColumn);

Creating a Details table....
...
Add everything to a RadAjaxPanel on the page.

.....
public class MyExportTemplate : ITemplate
{
private string colname;
public MyExportTemplate(string cName)
{
colname = cName;
}

public void InstantiateIn(System.Web.UI.Control container)
{
RadButton REB = new RadButton();
REB.Text = "Print Report";
REB.Click += REB_Click;
container.Controls.Add(REB);
}

void REB_Click(object sender, EventArgs e)
{
GridTableView table = ((sender as RadButton).NamingContainer as GridItem).OwnerTableView;
table.ExportToPdf();
}

}

Grid

answered on 25 Mar 2014

1 answer

81 views

[Solved] AjaxManager and RadListBoxes

My intranet "chat" site has two RadListBoxes both refreshed every 5 seconds with RadAjaxManager. For some reason its extremely sluggish and I can't figure out why. I trigger updates from a send button, and an OnSelectedIndexChange, and sometimes the site just hangs up and never reloads the content thats been binded to the 2nd RadListBox. I'm not sure how to really paste in examples of my code since its so lengthy, but if you have any ideas I could really use the help.

Ajax

answered on 25 Mar 2014

3 answers

90 views

problem with OnClientNodeDropping with JQuery AJAX

Hi,

I am trying to add Drag and Drop Functionality in client side with Ajax Post Request to the server:

<telerik:RadTreeView runat="server" ID="rdtrOrganization" Height="450" BorderWidth="0" OnNodeExpand="groupsTree_NodeExpand" OnClientNodeClicked="ClientNodeClicking" OnClientNodeDropping ="onNodeDropping" EnableDragAndDrop="true" EnableDragAndDropBetweenNodes="true" Width="100%" Skin="Web20" CheckBoxes="false" CausesValidation="false" TriStateCheckBoxes="false"></telerik:RadTreeView>

onNodeDropping client function:
01.

         

function onNodeDropping(sender, args) {            
         var sourceNode = args.get_sourceNode();
         var destinationNode = args.get_destNode();
         var nodeType = sourceNode._attributes.getAttribute('<%=k_TreeNodeTypeAttribute%>');
         if (nodeType === "SP" || nodeType === "Server" || nodeType === "Company") {
             return;
         }            
         var dest = args.get_destNode();
         if (dest) {
             $telerik.$.ajax({
                 type: "POST",
                 url: "OrganizationManagement.aspx/MoveTeam",
                 data: "{'sourceID': '" + sourceNode._attributes._data.Guid + "','destinationID': '" + destinationNode._attributes._data.Guid + "'}",
                 contentType: "application/json; charset=utf-8",
                 dataType: "json",
                 success: function (response) {             
                     clientSideEdit(sender, args);                                                
                 },
                 error: function (xhr, err) {
 
                 }
             });               
 
         }
     }

Function clientSideEdit:

function clientSideEdit(sender, args) {

var destinationNode = args.get_destNode();

if (destinationNode) {

var firstTreeView = $find('<%= rdtrOrganization.ClientID %>');

firstTreeView.trackChanges();

var sourceNodes = args.get_sourceNodes();

var dropPosition = args.get_dropPosition();

//Needed to preserve the order of the dragged items

if (dropPosition == "below") {

for (var i = sourceNodes.length - 1; i >= 0; i--) {

var sourceNode = sourceNodes[i];

sourceNode.get_parent().get_nodes().remove(sourceNode);

insertAfter(destinationNode, sourceNode);

}

else {

for (var i = 0; i < sourceNodes.length; i++) {

var sourceNode = sourceNodes[i];

sourceNode.get_parent().get_nodes().remove(sourceNode);

if (dropPosition == "over")

destinationNode.get_nodes().add(sourceNode);

if (dropPosition == "above")

insertBefore(destinationNode, sourceNode);

}

destinationNode.set_expanded(true);

firstTreeView.commitChanges();

}

function insertAfter(destinationNode, sourceNode) {

var destinationParent = destinationNode.get_parent();

var index = destinationParent.get_nodes().indexOf(destinationNode);

destinationParent.get_nodes().insert(index + 1, sourceNode);

}

function insertBefore(destinationNode, sourceNode) {

var destinationParent = destinationNode.get_parent();

var index = destinationParent.get_nodes().indexOf(destinationNode);

destinationParent.get_nodes().insert(index, sourceNode);

}

If I will not use the ajax call the function: clientSideEdit will work.

What I need to change that it will work with the ajax call.

please help me it very urgent.

Thanks in advance.

TreeView

answered on 25 Mar 2014

1 answer

109 views

OnCommand not firing when filtering on custom GridTemplateColumn

I have a custom template to handle true/false data points. The custom filter is a simple dropdown with a null/true/false values.

I have a client OnCommand function, and when I filter from any of my regular columns the function fires normally, however, when I filter from my custom column the page post back and the filter works, but the OnCommand function never fires. Here is my OnCommand function and my custom template:

function GridCommand(grid, args) {
var command = args.get_commandName();
console.log(command);
if (command == "Filter") {
console.log("Filtering data...");
}
};

private class CheckColumnTemplate : GridTemplateColumn
{
protected DropDownList DDl;

protected override void SetupFilterControls(TableCell cell)
{
base.SetupFilterControls(cell);
cell.Controls.RemoveAt(0);
DDl = new DropDownList();
DDl.EnableViewState = true;
DDl.ViewStateMode = ViewStateMode.Enabled;
DDl.ID = "ddl_" + this.DataField;
ListItem blankItem = new ListItem("", "");
ListItem trueItem = new ListItem("True", "1");
ListItem falseItem = new ListItem("False", "0");
DDl.Items.Add(blankItem);
DDl.Items.Add(trueItem);
DDl.Items.Add(falseItem);
DDl.AutoPostBack = true;
DDl.SelectedIndexChanged += new EventHandler(FilterCombo_SelectedIndexChanged);
cell.Controls.AddAt(0, DDl);
cell.Controls.RemoveAt(1);
DDl.DataTextField = this.DataField;
DDl.DataValueField = this.DataField;
}

protected void FilterCombo_SelectedIndexChanged(object sender, EventArgs e)
{
DropDownList DDl = (DropDownList)sender;
GridFilteringItem filterItem = (GridFilteringItem)DDl.NamingContainer;
string filterType = DDl.SelectedValue == "" ? "NoFilter" : "EqualTo";
filterItem.FireCommandEvent("Filter", new Pair(filterType, DDl.NamingContainer.ToString()));
}

protected override void SetCurrentFilterValueToControl(TableCell cell)
{
((DropDownList)cell.Controls[0]).SelectedValue = this.CurrentFilterValue;
}

protected override string GetCurrentFilterValueFromControl(TableCell cell)
{
string currentValue = ((DropDownList)cell.Controls[0]).SelectedValue;
this.CurrentFilterFunction = currentValue == "" ? GridKnownFunction.NoFilter : GridKnownFunction.EqualTo;
return currentValue;
}
}

Grid

answered on 25 Mar 2014

1 answer

76 views

Example of your own Menu or Tree Control

hello, you have a lot of examples, but which control is your own Menu or Tree or Panelbar which you use yourself for your examples.
..attached is the picture.

Documentation and Tutorials

answered on 25 Mar 2014

1 answer

80 views

Telerik Grid for Mobile Devices

Hi,

I want to use the Telerik Grid for SharePoint 2013 web parts which are going to be viewed in all major browsers as well as all the mobile devices like iOS, Android, Windows Phones etc.

Can any one please tell me how can I use the Telerik grid for my application. I am using ASP.NET Gridview in my application which needs to be shown on the mobile as well as desktop devices.

Thanks in advance.

Grid

answered on 25 Mar 2014

0 answers

56 views

Problem with nested RadGrid

We want to create a 4 level grid to display the following information
Level1: Projects – every project number is unique
Level 2: The orders that belong to the project – The orders for every project starts with order no 0001. There could be many orders with the same number (e.g. 0001) but only one order 0001 for each project. Project plus order number is unique
Level3: The Line Items within an order. Again a line item 0001 will appear in every order. Project + Order No + line Item is unique
Level4: The Release Note numbers for each Line Item. There could be many Release not numbers for each Project, Order No, Line Item Combination.
Question:
How should the Master and detail keys be structured for each level.

General Discussions

asked on 25 Mar 2014

2 answers

230 views

Problem to get/set Value with RadTreeView

Hi
I'm trying to use the RadTreeView like this:
the treeView takes its data from a list.
When I press on a node, I get a value from it (& then later I can call function base on the value)

I have a hard time to set value into the treeView

I set the List like that:
vb.NET:

01.Friend Class SiteDataItem

02. Private text1 As String

03. Private id1 As Integer

04. Private parentId1 As Integer

05. Private report_id1 As String

06.

07. Public Property Text() As String

08. Get

09. Return text1

10. End Get

11. Set(ByVal value As String)

12. text1 = value

13. End Set

14. End Property

15.

16.

17. Public Property ID() As Integer

18. Get

19. Return id1

20. End Get

21. Set(ByVal value As Integer)

22. id1 = value

23. End Set

24. End Property

25.

26. Public Property ParentID() As Integer

27. Get

28. Return parentId1

29. End Get

30. Set(ByVal value As Integer)

31. parentId1 = value

32. End Set

33. End Property

34.

35. Public Property Report_ID() As String

36. Get

37. Return report_id1

38. End Get

39. Set(ByVal value As String)

40. report_id1 = value

41. End Set

42. End Property

43.

44. Public Sub New(ByVal id As Integer, ByVal parentId As Integer, ByVal text As String, Optional ByVal report_id1 As String = "99")

45. Me.id1 = id

46. Me.parentId1 = parentId

47. Me.text1 = text

48. Me.report_id1 = Report_ID

49.

50. End Sub

51.

52.

53. '--------- Constractor

54. Public Sub New(ByVal id As Integer, ByVal parentId As Integer, ByVal text As String, Optional ByVal report_id1 As String = "99")

55. Me.id1 = id

56. Me.parentId1 = parentId

57. Me.text1 = text

58. Me.report_id1 = Report_ID

59.

60. End Sub

61. End Class

62.

63. '=======

64.

65.

66. Private Sub BindToIEnumerable(ByVal treeView As RadTreeView)

67. Dim siteData As New List(Of SiteDataItem)()

68.

69. siteData.Add(New SiteDataItem(1, 0, "Location"))

70. siteData.Add(New SiteDataItem(2, 0, "Hobbies"))

71. siteData.Add(New SiteDataItem(3, 1, "func 1", "101"))

72. siteData.Add(New SiteDataItem(4, 1, "func 2", "102"))

73. siteData.Add(New SiteDataItem(5, 2, "func 4", "103"))

74. siteData.Add(New SiteDataItem(6, 2, " func 1" , "104"))

75.

76.

77. treeView.DataTextField = "Text"

78. treeView.DataFieldID = "ID"

79. treeView.DataFieldParentID = "ParentID"

80. treeView.DataValueField = "Report_ID"

81. treeView.DataSource = siteData

82. treeView.DataBind()

83.

84.

85.

86. End Sub

As you see, I insert a value,text,iD &parent_id into the RadTreeView, [line 77-80]
All is built well : the text,ID & Parent_id. But when I try to get the value field it shows me null:

Protected Sub treeView_SideMenu_NodeClick(sender As Object, e As RadTreeNodeEventArgs) Handles treeView_SideMenu.NodeClick

Session("funcID") = e.Node.Value 'Unfortunately return NULL

End Sub

p.s
I Must use the "Value" Property and not "by text" ,because I've identical text menu

TreeView