Telerik Forums
UI for ASP.NET AJAX Forum
1 answer
123 views
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();
}

Helen
Telerik team
 answered on 24 Jun 2011
3 answers
98 views
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
Pavlina
Telerik team
 answered on 24 Jun 2011
2 answers
130 views
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?
Richard M
Top achievements
Rank 1
 answered on 24 Jun 2011
3 answers
191 views

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>
Kate
Telerik team
 answered on 24 Jun 2011
2 answers
91 views
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.
Anjali
Top achievements
Rank 1
 answered on 24 Jun 2011
1 answer
54 views
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?
Dobromir
Telerik team
 answered on 24 Jun 2011
3 answers
342 views
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.
Maria Ilieva
Telerik team
 answered on 24 Jun 2011
4 answers
97 views
Hi.
I´ve got some problem to get my template manager dialog to fit my needs.
As below I set with / height of the dialog from code-behind, but i also need to set new width / height to the iframe that holds "preview".

protected override void OnInit(EventArgs e)
{
    base.OnInit(e);
    this.Page.PreRenderComplete += new EventHandler(Page_PreRenderComplete);
}
void Page_PreRenderComplete(object sender, EventArgs e)
{
    Telerik.Web.UI.DialogDefinition TemplateManager = bloggEditor.GetDialogDefinition("TemplateManager");
    TemplateManager.Height = Unit.Pixel(500);
    TemplateManager.Width = Unit.Pixel(1020);
}

How can i access Template Manager dialog iframe "templateIframe" to set my own width / height?

/Mattias
Rumen
Telerik team
 answered on 24 Jun 2011
1 answer
118 views
Hi

I use editor insert text ( Example : <b>abcdefghr </b> ) I was format "Bold" for Text. But when i insert in Database, It remove tag HTML become "abcdefghr" not Bold.

Please help
Dobromir
Telerik team
 answered on 24 Jun 2011
1 answer
86 views
Hi there , 
Can i call a Ajax request on the content page when i close the rad pop up window from the 'X' on the pop up window and not a button on the pop up window ?
Please advise if anyone has done this 
Thanks
Tsvetoslav
Telerik team
 answered on 24 Jun 2011
Narrow your results
Selected tags
Tags
+? more
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Top users last month
Rob
Top achievements
Rank 3
Iron
Iron
Iron
Atul
Top achievements
Rank 1
Iron
Iron
Alexander
Top achievements
Rank 1
Veteran
Iron
Serkan
Top achievements
Rank 1
Iron
Shawn
Top achievements
Rank 1
Iron
Iron
Want to show your ninja superpower to fellow developers?
Want to show your ninja superpower to fellow developers?