Questions on UI for ASP.NET AJAX Forum

2 answers

119 views

In years past, when I strictly built WinForms applications I'd use an old product called RoboHelp to build the Windows help files. It worked fine and was the right tool for the job.

Fast forward to 2011 and I'm in the midst of an ASP.Net 3.5 Intranet application. I'm now looking to provide some online help for it, which would include:

Context sensitive help from each page in the app.
A general search facility where the user could enter keywords and be shown the applicable help topics.

I could, of course, build this help engine from scratch but I'm thinking there must be a better, easier way. I'm thus curious whether the great minds at Telerik might have some suggestions, including the use of some of your controls in the ASP.Net AJAX toolkit.

A fairly open question, I know, but am hoping you can give me some good ideas,

Robert

General Discussions

answered on 24 Jun 2011

9 answers

118 views

'_currentFilterTimeoutID' is null or not an object

I have a RadGrid that is throwing the error '_currentFilterTimeoutID' is null or not an object when a value is typed into the filter box. If I remove FilterDelay, ther error does not occur though neither does the filter.

Below is the radgrid with the RadWindow wrapper.

<telerik:RadWindow ID="GLLookupWindow" runat="server" Behaviors="Close" Width="900" Height="700" OnClientClose="UnhideIframe_OnClientClose">

<ContentTemplate>

<asp:Button ID="hiddenButton" OnClientClick="return false;" runat="server" style="display:none" visible="false" />

<asp:Panel runat="server" ID="pnlGLLookup" Visible="true" TabIndex="-1">

<telerik:RadGrid AutoGenerateColumns="False" ID="GLLookup" OnItemCommand ="GLLookup_ItemCommand" AllowFilteringByColumn ="true" OnItemCreated="GLLookup_ItemCreated" EnableLinqExpressions="false"

DataSourceID="SqlDataSourceGLLookupwindow" AllowSorting="true" runat="server" PagerStyle-AlwaysVisible="true" AllowPaging="true" PageSize ="20">

<GroupingSettings CaseSensitive="false" />

<MasterTableView DataKeyNames="GCMGRP,GCACCT,GCSACT,GCDEPT,GCDESC" AutoGenerateColumns="false" AllowFilteringByColumn="True" >

<PagerStyle Mode="NumericPages" PageButtonCount="10" />

<Columns>

<telerik:GridBoundColumn SortExpression="GCMGRP" HeaderText="Major" DataField="GCMGRP" UniqueName="GCMGRP" HeaderButtonType="TextButton"

AllowFiltering="true" CurrentFilterFunction="EqualTo" AutoPostBackOnFilter="false" ShowFilterIcon="false" FilterDelay="4000"

HeaderStyle-VerticalAlign="Bottom" HeaderStyle-HorizontalAlign="Center" ItemStyle-HorizontalAlign="Center"/>

<telerik:GridBoundColumn HeaderText="Acct" DataField="GCACCT" UniqueName="GCACCT" AllowFiltering="true"

SortExpression="GCACCT" HeaderStyle-HorizontalAlign="Center" ItemStyle-HorizontalAlign="Center"

HeaderStyle-VerticalAlign="Bottom"

CurrentFilterFunction="EqualTo" AutoPostBackOnFilter="false" ShowFilterIcon="false" FilterDelay="4000" />

<telerik:GridBoundColumn HeaderText="Sub" DataField="GCSACT" UniqueName="GCSACT" AllowFiltering="true"

SortExpression="GCSACT" HeaderStyle-HorizontalAlign="Center" ItemStyle-HorizontalAlign="Center"

HeaderStyle-VerticalAlign="Bottom"

CurrentFilterFunction="EqualTo" AutoPostBackOnFilter="false" ShowFilterIcon="false" FilterDelay="4000" />

<telerik:GridBoundColumn HeaderText="Dept/Loc" DataField="GCDEPT" UniqueName="GCDEPT" AllowFiltering="true"

SortExpression="GCDEPT" HeaderStyle-HorizontalAlign="Center" ItemStyle-HorizontalAlign="Center"

HeaderStyle-VerticalAlign="Bottom"

CurrentFilterFunction="EqualTo" AutoPostBackOnFilter="false" ShowFilterIcon="false" FilterDelay="4000" />

<telerik:GridBoundColumn HeaderText="Description" DataField="GCDESC" UniqueName="GCDESC" AllowFiltering="true"

SortExpression="GCDESC" HeaderStyle-HorizontalAlign="Center" ItemStyle-HorizontalAlign="Center"

HeaderStyle-VerticalAlign="Bottom"

CurrentFilterFunction="Contains" AutoPostBackOnFilter="false" ShowFilterIcon="false" FilterDelay="4000" />

</Columns>

<ItemStyle Wrap="false" />

<PagerStyle Mode="NumericPages" AlwaysVisible="true">

</PagerStyle>

</MasterTableView>

<ClientSettings EnablePostBackOnRowClick="true" >

</ClientSettings>

</telerik:RadGrid>

<asp:Button ID="clrFilters" runat="server" Text="Clear filters" OnClick="clrFilters_Click" />

</asp:Panel>

</ContentTemplate>

</telerik:RadWindow>

AHIA,
LarryR....

Filter

answered on 24 Jun 2011

1 answer

44 views

Popup Edit User Control StartupScript

Hi,

I am using the popup form edit mode in the radgrid. In the edit form I have a user control. I want to run some javascript when the control is loaded. I tried using the Page.ClientScript in the Page_Load event of the control itself but that script never gets called.

Where is the appropriate event to hook into?

Grid

answered on 24 Jun 2011

1 answer

130 views

Add New Node Context Menu - Capture Text

I have a context menu where I add new nodes. I used this example to create the context menu:http://demos.telerik.com/aspnet-ajax/treeview/examples/functionality/contextmenu/defaultcs.aspx. My issue is that when a user add's a new node I need to capture what the user names the node, so that I can add it to the database. Currently the code uses javascript to set the node as editable on Page Load.

How do I go about capturing the text value the user inputs when adding a new node?

JAVASCRIPT

<script type="text/javascript">

//<!--

function onClientContextMenuShowing(sender, args) {

var treeNode = args.get_node();

treeNode.set_selected(true);

//enable/disable menu items

setMenuItemsState(args.get_menu().get_items(), treeNode);

}

function onClientContextMenuItemClicking(sender, args) {

var menuItem = args.get_menuItem();

var treeNode = args.get_node();

menuItem.get_menu().hide();

switch (menuItem.get_value()) {

case "Rename":

treeNode.startEdit();

break;

case "addLocation":

break;

}

//this method disables the appropriate context menu items

function setMenuItemsState(menuItems, treeNode) {

for (var i = 0; i < menuItems.get_count(); i++) {

var menuItem = menuItems.getItem(i);

switch (menuItem.get_value()) {

case "Rename":

formatMenuItem(menuItem, treeNode, 'Rename "{0}"');

break;

case "addLocation":

if (treeNode.get_parent() == treeNode.get_treeView()) {

menuItem.set_enabled(false);

}

else {

menuItem.set_enabled(true);

}

break;

}

//formats the Text of the menu item

function formatMenuItem(menuItem, treeNode, formatString) {

var nodeValue = treeNode.get_value();

if (nodeValue && nodeValue.indexOf("_Private_") == 0) {

menuItem.set_enabled(false);

}

else {

menuItem.set_enabled(true);

}

var newText = String.format(formatString, extractTitleWithoutMails(treeNode));

menuItem.set_text(newText);

}

//checks if the text contains (digit)

function hasNodeMails(treeNode) {

return treeNode.get_text().match(/$[\d]+$/ig);

}

//removes the brackets with the numbers,e.g. Inbox (30)

function extractTitleWithoutMails(treeNode) {

return treeNode.get_text().replace(/\s*$[\d]+$\s*/ig, "");

}

//-->

</script>

ASPX

<telerik:RadAjaxLoadingPanel ID="LocationsLoadingPanel" runat="server" Transparency="30" Skin="Vista"></telerik:RadAjaxLoadingPanel>

<telerik:RadAjaxPanel ID="LocationsPanel" runat="server" LoadingPanelID="LocationsLoadingPanel">

<telerik:RadTreeView ID="LocationsTreeView" runat="server" EnableDragAndDrop="true" MultipleSelect="true" EnableDragAndDropBetweenNodes="true"

AllowNodeEditing="true" OnContextMenuItemClick="LocationsTreeView_ContextMenuItemClick" OnClientContextMenuItemClicking="onClientContextMenuItemClicking"

OnClientContextMenuShowing="onClientContextMenuShowing" OnNodeEdit="LocationsTreeView_NodeEdit">

<ContextMenus>

<telerik:RadTreeViewContextMenu ID="MainContextMenu" runat="server">

<Items>

<telerik:RadMenuItem Value="Rename" Text="Rename ..." Enabled="true" ImageUrl="images/icons/edit_48.png"

PostBack="false">

</telerik:RadMenuItem>

<telerik:RadMenuItem IsSeparator="true">

</telerik:RadMenuItem>

<telerik:RadMenuItem Value="addLocation" Text="Add Location" ImageUrl="images/icons/add_16.png">

</telerik:RadMenuItem>

</Items>

<CollapseAnimation Type="none" />

</telerik:RadTreeViewContextMenu>

</ContextMenus>

</telerik:RadTreeView>

</telerik:RadAjaxPanel>

C#

protected void LocationsTreeView_ContextMenuItemClick(object sender, RadTreeViewContextMenuEventArgs e)

{

RadTreeNode clickedNode = e.Node;

switch (e.MenuItem.Value)

{

case "addLocation":

RadTreeNode newLocation = new RadTreeNode(string.Format("Add Location"));

newLocation.Selected = true;

newLocation.ImageUrl = clickedNode.ImageUrl;

clickedNode.Nodes.Add(newLocation);

clickedNode.Expanded = true;

//update the number in the brackets

if (Regex.IsMatch(clickedNode.Text, unreadPattern))

clickedNode.Text = Regex.Replace(clickedNode.Text, unreadPattern, "(" + clickedNode.Nodes.Count.ToString() + ")");

clickedNode.Font.Bold = true;

//set node's value so we can find it in startNodeInEditMode

newLocation.Value = newLocation.GetFullPath("/");

startNodeInEditMode(newLocation.Value);

// Add Location Record to Database

string ParentID = clickedNode.Value;

Guid ID = Guid.NewGuid();

string LocationID = ID.ToString();

string Name = newLocation.Text;

LocationsTreeView_AddLocation(ParentID, LocationID, Name);

break;

case "Delete":

clickedNode.Remove();

break;

}

private void startNodeInEditMode(string nodeValue)

{

//find the node by its Value and edit it when page loads

string js = "Sys.Application.add_load(editNode); function editNode(){ ";

js += "var tree = $find(\"" + LocationsTreeView.ClientID + "\");";

js += "var node = tree.findNodeByValue('" + nodeValue + "');";

js += "if (node) node.startEdit();";

js += "Sys.Application.remove_load(editNode);};";

RadScriptManager.RegisterStartupScript(Page, Page.GetType(), "nodeEdit", js, true);

}

// Used when adding a Location

protected void LocationsTreeView_AddLocation(string ParentID, string LocationID, string Name)

{

// Set parameters for insert

locationDataSource.InsertParameters["LocationID"].DefaultValue = LocationID;

locationDataSource.InsertParameters["ParentID"].DefaultValue = ParentID;

locationDataSource.InsertParameters["Name"].DefaultValue = Name;

// locationDataSource.Insert();

}

// Used when renaming a Location

protected void LocationsTreeView_NodeEdit(object sender, RadTreeNodeEditEventArgs e)

{

// Update Name on client side

e.Node.Text = e.Text;

// Update Name in database

locationDataSource.UpdateParameters["Name"].DefaultValue = e.Text;

locationDataSource.UpdateParameters["ID"].DefaultValue = e.Node.Value;

locationDataSource.Update();

}

TreeView

answered on 24 Jun 2011

3 answers

106 views

Columns loose their width

I have a radgrid and because I wanted the expand button to be shown on the right most column part of the grid, i set in mastertableview the attribute ExpandCollapseColumn-Visible="false" and added a new GridTemplateColumn with a button that performs the expand command.

<telerik:GridTemplateColumn ItemStyle-Width="27px" ItemStyle-Height="46px" Resizable="false"                 >
            <ItemTemplate>
                <asp:Button CommandName="ExpandCollapse" runat="server" ID="EC"   CssClass="expandbutton" />
            </ItemTemplate>
        </telerik:GridTemplateColumn>
Obviously in code behind, I intercept my command and the nestedviewtemplate in my case is shown correctly on expand. So far so good, expand and collpase work fine, the problem is that on expand, the columns of my grid (outer grid) loose their size(some become smaller, same become larger than in the all collapsed state). I tried setting Resizable=false on all GridTemplateColumn, but no result....
Any ideas? Can you please help?

Thank you,
Marina

Grid

answered on 24 Jun 2011

2 answers

135 views

update parent from usercontrol with ajaxmgr

I have a raddockzone in a page. Each dock has a usercontrol in its contenttemplate. If I make a change in the usercontrol, how can I update the parent raddockzone that is in the parent page?

Ajax

answered on 24 Jun 2011

3 answers

203 views

Combo box size too large

The RadCombox I am using has only two values "AND" and "OR". How do I make the combo box shorter?
Please have a look at the attached screen shot and the corresponding code block below:

<telerik:RadComboBox ID="drpFilterType" runat="server" AutoPostBack="true" EnableViewState="true"

Width="100px" Skin="Default" MarkFirstMatch="True">

<Items>

<telerik:RadComboBoxItem Text="AND" Selected="true" Value="AND"/>

<telerik:RadComboBoxItem Text="OR" Value="OR"/>

</Items>

</telerik:RadComboBox>

ComboBox

answered on 24 Jun 2011

2 answers

98 views

Listbox backword button

Hi All,

Is it possible to remove the listbox backword button. i want the button that move from left list box to right listbox, but I don't want the button that moves from right listbox to left. Is it possible to remove that particular button. Also, once the user moves the item from left listbox to right listbox, I don't want the items to disappaer from the left listbox.

Can I acheive this.

Please let me know

Any help will be appreciated.

ListBox

answered on 24 Jun 2011

1 answer

56 views

Home / Community & Support / Knowledge Base / RadControls for ASP.NET and ASP.NET AJAX / Editor / Uploading images and files to a Shared Drive Uploading images and files to a Shared Drive IIS7

I cannot get image listing to show in the Image Manager of the Editor control. It just shows nothing. I verified that my virtual directory is correct because it is showing image listing in IIS7 Server Manager.

I linked it to a virtual directory however it does not work when using a virtual directory link to a remote server directory. If I link it to a local folder on the web hosting server it works fine.

I followed the instructions on this link: http://www.telerik.com/support/kb/aspnet-ajax/editor/uploading-images-and-files-to-a-shared-drive.aspx
however the instructions seems specific to IIS6.

Is these a different technique used for IIS7? Is this a permissions problem?

General Discussions

answered on 24 Jun 2011

3 answers

371 views

RadDateTimePicker not working client-side

Hello,

I'm having issues when setting the selected and minimum dates on a RadDateTimePicker client-side.

I've two RadDateTimePickers, one for setting the starting datetime (dtpBegin) and other for the ending (dtpEnd) declared as follows:

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="RadAjaxLoadingPanel1">

......

<telerik:RadDateTimePicker ID="dtpBegin" runat="server">

<ClientEvents OnDateSelected="startDateTimeSelected" OnPopupClosing="startDateTimePopupClosing" />

</telerik:RadDateTimePicker>

<telerik:RadDateTimePicker ID="dtpEnd" runat="server">

<ClientEvents OnPopupClosing="endDateTimePopupClosing" />

</telerik:RadDateTimePicker>

</telerik:RadAjaxPanel>

<telerik:RadScriptBlock runat="server">

<script type="text/javascript">

var endDateTimePickerId = "<%= dtpEnd.ClientID %>";

</script>

</telerik:RadScriptBlock>

When selecting the starting datetime, I'd like to set the selected value as minimum on the ending control and also would like to set a valid value for that control (say the starting datetime plus 1 minute). To do that, I've the following code client-side:

function startDateTimeSelected(sender, e) {

if (e.get_newDate != undefined && e.get_newDate() != null) {

var startDate = e.get_newDate();

var endDateTimePicker = $find(endDateTimePickerId);

endDateTimePicker.set_minDate(e.get_newDate());

if (endDateTimePicker.get_timeView().getTime() < startDate) {

var timeView = timePicker.get_timeView();

timeView.setTime(newDate.getHours(), newDate.getMinutes() + 1, newDate.getSeconds(), newDate);

}

Now, even though the calls to set_minDate and setTime are not throwing any errors, the selected date on dtpEnd is not changed neither is the minimum date time set. One thing I find weird is that after setting the time on dtpEnd, if I run on Firebug's console:

$find(endDateTimePickerId).get_timeView().getTime()

I get null.

And regarding the minimum date, if I run on Firebug's console:

$find(endDateTimePickerId).get_minDate()

I get the expected value (even though the calendar allows to select any value).
One extra thing that might be useful for troubleshooting is that I'm also setting the MinDate server-side for these two controls (setting it to DateTime.Now to forbid users selecting past datetimes).

Thanks a lot,
Diego.

Calendar

answered on 24 Jun 2011