Questions on UI for ASP.NET AJAX Forum

0 answers

105 views

I am dragging items between the nodes. I am getting the error if i swap two nodes on the same level. could any one help me. The sample code is here. I have tested with 3 levels of nodes

    
                <script language="javascript" type="text/javascript">  
        
                            function onNodeDropping(sender, args)  
        
                            {             
        
                                var dest = args.get_destNode();  
        
                                if (dest)  
        
                                {   
        
                                        clientSideEdit(sender, args);  
        
                                        args.set_cancel(true);  
        
                                        return;  
        
                                    //dropOnTree(args);  
        
                                }  
        
                                else  
        
                                {   
        
                                    dropOnHtmlElement(args);  
        
                                }  
        
                            }  
        
                            function clientSideEdit(sender, args)  
        
                            {  
        
                                if(isValidDrop(sender,args)==false)  
        
                                {  
        
                                    args.set_cancel(true);  
        
                                    return;  
        
                                }     
        
            var destinationNode = args.get_destNode();                      
        
                if(destinationNode)     
        
                {                    
        
                    var firstTreeView = $find('trvOne');     
        
                    var secondTreeView = $find('trvOne');     
        
                    firstTreeView.trackChanges();     
        
                   // secondTreeView.trackChanges();     
        
                    var sourceNodes = args.get_sourceNodes();     
        
                        var sourceNode = sourceNodes[0];     
        
                        sourceNode.get_parent().get_nodes().remove(sourceNode);                          
        
                        //if(args.get_dropPosition() == "over") destinationNode.get_nodes().add(sourceNode);                                                           
        
                        //if(args.get_dropPosition() == "above")  insertBefore(destinationNode, sourceNode);     
        
                        //if(args.get_dropPosition() == "below")  insertAfter(destinationNode, sourceNode);     
        
                        insertBefore(destinationNode, sourceNode);    
        
                        //sourceNode.clone();  
        
                    destinationNode.set_expanded(true);     
        
                    firstTreeView.commitChanges();     
        
                    //secondTreeView.commitChanges();     
        
                }     
        
                            }  
        
                            function insertBefore(destinationNode, sourceNode)  
        
                            {  
        
                                var destinationParent = destinationNode.get_parent();  
        
                                var index = destinationParent.get_nodes().indexOf(destinationNode);  
        
                                destinationParent.get_nodes().insert(index, sourceNode);  
        
                            }  
        
                            function insertAfter(destinationNode, sourceNode)  
        
                            {  
        
                                var destinationParent = destinationNode.get_parent();  
        
                                var index = destinationParent.get_nodes().indexOf(destinationNode);  
        
                                destinationParent.get_nodes().insert(index+1, sourceNode);  
        
                            }                 
        
                            function isValidDrop(sender, args)  
        
                            {  
        
                                var tree = $find('trvOne');  
        
                                var sourceNode = args.get_sourceNode();  
        
                                var destinationNode = args.get_destNode();        
        
                                var sourceNodeLevel;  
        
                                var destinationNodeLevel;  
        
                                sourceNodeLevel=getNodeLevel(sourceNode);  
        
                                destinationNodeLevel=getNodeLevel(destinationNode);  
        
                                if(sourceNodeLevel==destinationNodeLevel)  
        
                                    return true;  
        
                                else      
        
                                    return false;  
        
                                /*                
        
                                if(!sourceNode.get_parent())  
        
                                {  
        
                                    args.set_cancel(true);  
        
                                    tree._clearDrag();  
        
                                    return false;  
        
                                }  
        
                                if(sourceNode.get_parent() && !(sourceNode.get_parent().get_parent()))  
        
                                {  
        
                                    args.set_cancel(true);  
        
                                    tree._clearDrag();  
        
                                    return false;  
        
                                }  
        
                                if(sourceNode.get_parent() && sourceNode.get_parent().get_parent() && !(sourceNode.get_parent().get_parent().get_parent()))  
        
                                {  
        
                                    args.set_cancel(true);  
        
                                    tree._clearDrag();  
        
                                    return false;  
        
                                }  
        
                                */  
        
                            }  
        
                            function getNodeLevel(node)  
        
                            {  
        
                                var FirstParent;  
        
                                var SecondParent;  
        
                                var ThirdParent;  
        
                                var Level;  
        
                                FirstParent=node.get_parent();  
        
                                if(FirstParent)  
        
                                    SecondParent=FirstParent.get_parent();  
        
                                if(SecondParent)  
        
                                    ThirdParent=SecondParent.get_parent();  
        
                                if(ThirdParent)  
        
                                    Level=3;  
        
                                else if(SecondParent)  
        
                                    Level=2;  
        
                                else if(FirstParent)  
        
                                    Level=1;  
        
                                return Level;  
        
                            }  
        
                            function dropOnHtmlElement(args)  
        
                            {                     
        
                                var target = args.get_htmlElement();  
        
                                if (target.tagName == "SELECT" && target.id=='lstShortCut')  
        
                                {  
        
                                    if(getNodeLevel(args.get_sourceNode())!=3)  
        
                                    {  
        
                                        args.set_cancel(true);  
        
                                        return;  
        
                                    }  
        
                                    target.style.cursor = "default";  
        
                                    //target.value = args.get_sourceNode().get_text();        
        
                                    var sourceNodeValue=args.get_sourceNode().get_value();  
        
                                    for(var i=0;i<target.options.length;i++)  
        
                                    {  
        
                                        if(target.options[i].value==sourceNodeValue)  
        
                                        {  
        
                                            args.set_cancel(true);  
        
                                            return true;  
        
                                        }  
        
                                    }                         
        
                                    var newnewOpt = new Option( args.get_sourceNode().get_text(), args.get_sourceNode().get_value(), true, false);  
        
                                    target.options[target.options.length] = newOpt;  
        
                                    args.set_cancel(true);  
        
                                    return true;  
        
                                }                                     
        
                            }  
        
                </script> 
        
            <radT:RadAjaxManager ID="RadAjaxManager1" runat="server">  
        
                                                                <AjaxSettings> 
        
                                                                        <radT:AjaxSetting AjaxControlID="trvOne">  
        
                                                                            <UpdatedControls> 
        
                                                                                <radT:AjaxUpdatedControl ControlID="trvOne" /> 
        
                                                                            </UpdatedControls> 
        
                                                                        </radT:AjaxSetting> 
        
                                                                    </AjaxSettings> 
        
                                                                </radT:RadAjaxManager> 
        
                                                    <radT:RadTreeView ID="trvOne" runat="server"   
        
                                                        EnableViewState="true" SingleExpandPath="true" EnableDragAndDrop="true" OnClientNodeDropping="onNodeDropping"   Height="350px">

TreeView

asked on 18 Feb 2009

3 answers

198 views

resize image

Based on your help file code, I would like to figure out how to create two thumbnails (one <=100 pixels wide and another <=700 pixels wide) and maintain the aspect ratio (constraint).

    
            string target = Server.MapPath("~/Images/Logos/");  
        
            Image.GetThumbnailImageAbort thumbnailImageAbortDelegate =  
        
            new Image.GetThumbnailImageAbort(ThumbnailCallback);  
        
            foreach (UploadedFile file in RadUpload1.UploadedFiles)  
        
            {  
        
            file.SaveAs(Path.Combine(target, file.GetName()));  
        
            using (Bitmap originalImage = new Bitmap(file.InputStream))  
        
            {  
        
            //You can implement additional logic to compute  
        
            // the width / height according your requirements  
        
            int width = originalImage.Width / 2;  
        
            int height = originalImage.Height / 2;  
        
            using (Image thumbnail =  
        
            originalImage.GetThumbnailImage(width, height, thumbnailImageAbortDelegate, IntPtr.Zero))  
        
            {  
        
            string thumbnailFileName = Path.Combine(target,  
        
            string.Format("{0}_thumb{1}", file.GetNameWithoutExtension(), file.GetExtension()));  
        
            thumbnail.Save(thumbnailFileName);  
        
            }

Upload (Obsolete)

answered on 18 Feb 2009

5 answers

99 views

[Solved] same tooltips for other pages

Hi i have a radgrid in VS2008. i set up tooltipmanager on it that loads a detailsview control and it works fine for all the records on the first page. When i move to the other pages, the tooltip always shows the detailview correspond to page one records.
I am using this tooltip in content page.

here is my code

    Protected Sub RadToolTipManager1_AjaxUpdate(ByVal sender As Object, ByVal e As Telerik.Web.UI.ToolTipUpdateEventArgs) Handles RadToolTipManager1.AjaxUpdate
        Me.UpdateToolTip(e.Value, e.UpdatePanel)
    End Sub
    Private Sub UpdateToolTip(ByVal elementID As String, ByVal panel As UpdatePanel)
        Dim ctrl As Control = Page.LoadControl("UserControlDetails.ascx")
        panel.ContentTemplateContainer.Controls.Add(ctrl)
        Dim UserDetails As UserControlDetails = DirectCast(ctrl, UserControlDetails)
        UserDetails.UserIDGUID = elementID
    End Sub
    Private Sub RadGridUsers_ItemDataBound(ByVal sender As Object, ByVal e As Telerik.Web.UI.GridItemEventArgs) Handles RadGridUsers.ItemDataBound
        If e.Item.ItemType = GridItemType.Item OrElse e.Item.ItemType = GridItemType.AlternatingItem Then
            Dim target As Control = e.Item.FindControl("targetControl")
            If Not [Object].Equals(target, Nothing) Then
                If Not [Object].Equals(Me.RadToolTipManager1, Nothing) Then
                    Dim currentRow As DataRowView = DirectCast(e.Item.DataItem, DataRowView)
                    Me.RadToolTipManager1.TargetControls.Add(target.ClientID, currentRow.Row("unique_identifier").ToString(), True)
                End If
            End If
        End If
    End Sub

    Private Sub RadGridUsers_ItemCommand(ByVal source As Object, ByVal e As Telerik.Web.UI.GridCommandEventArgs) Handles RadGridUsers.ItemCommand
        If e.CommandName = "Sort" OrElse e.CommandName = "Page" Then
            RadToolTipManager1.TargetControls.Clear()
        End If
    End Sub

ToolTip

answered on 18 Feb 2009

3 answers

314 views

Hide the left column in grid hierarchy

Hi all !

Is there a simply sample code for hide the left column created when i clic for collapse in my radgrid hierarchy ? I just want to have my children items below their parents items for have unique header and good presentation
My grid is just like your exemple in Demo "Three Level hierarchy" !
HTML, CSS, CodeBehind(VB) ?

Thanks a lot !

Grid

answered on 18 Feb 2009

4 answers

211 views

Grid Grouping Column

Hi,
please can you help me with this, I am using RadGrid and I am grouping my column by code behind, the user select which column he want to group by and then press a command button I put in my page and by this button I used GroupByExpressions property to group my Grid, the question is: after the grid grouped a new column is added which is the grouping column and with each group header there is (+),(-) sign for collapse and expand the grouped rows, I put another button in my page to give the user the option to collapse or expand all the grouped rows and every time he press the button I used "GroupsDefaultExpanded" property to switch between True and False. is there any way to put the sign (+,- the collapse sign) in the header of the new added group column ?? and when the user press on it collapse or expand all the rows instead of using button for this, it will be more elegant and useful. by the way I tried to reach this new added grouping column but I could not.
Please advise me if I can do this or not.
Thanks

Ban

Grid

answered on 18 Feb 2009

2 answers

129 views

Grid Data Source Problem

HI Telerik team,

i would like to discuss the Grid data source problem with you (In case of MVC Framework).

i am supplying the list of objects to the grid as a data source. when the data source is a list of objects and object are single level then there is no prob. but when i pass the list and in list some of the objects are again a collection of objects then how to paint the grid.

example:

List

<Activity> list;

radGrid.DataSource = list;

and Activity class is something like this

public string CustomerName { get; set; }

public string AllocatedTo { get; set; }

public string Status { get; set; }

public UserInfoVO RaisedBy { get; set; }

Now RaisedBy is the object of class UserInfoVO which contain following properties
string firstName;
string LastName;
string phone;

now in this case in the view page i am using

<%

# Eval("Status ")%> to paint the field of the grid.

when it is for the primitive data type it display the value but how does it work for user defined classes... like i would like to print first name and phone no from UserInfoVo class.

thanks.

Regards,
Tej.

Grid

answered on 18 Feb 2009

4 answers

580 views

How to disable Auto-Generated Edit Form

Hi,

I have a simple Grid with a gridTemplateColumn with inside 2 asp imageButton who perform specific action.
When i click on this button appear in the grid the auto-generated edit form.
How can i disable this ?
I try to put in the RadGrid definition and in the MasterTableView AllowAutomaticInserts to false but without result.

Here is the definition of my Grid:

    
            <telerik:RadGrid ID="RadGrid1" CssClass="grid" runat="server" Skin="Office2007" 
        
                        GridLines="None" PageSize="10" Height="300px" OnNeedDataSource="RadGrid1_OnNeedDataSource" 
        
                        AutoGenerateColumns="false" ShowFooter="true" AllowAutomaticUpdates="false"  
        
                        AllowAutomaticInserts="false" AllowAutomaticDeletes="false" AutoGenerateEditColumn="false"> 
        
                        <MasterTableView TableLayout="Fixed" ClientDataKeyNames="AddressID" AutoGenerateColumns="false"  
        
                        Width="100%" AllowAutomaticUpdates="false" AllowAutomaticInserts="false" AllowAutomaticDeletes="false"> 
        
                            <Columns> 
        
                                <telerik:GridBoundColumn DataField="AddressId" HeaderText="Id" AllowFiltering="false"> 
        
                                    <HeaderStyle HorizontalAlign="Left" Width="20" /> 
        
                                    <ItemStyle HorizontalAlign="Left" Width="20" /> 
        
                                </telerik:GridBoundColumn> 
        
                                <telerik:GridBoundColumn DataField="Name" HeaderText="Naam"> 
        
                                    <ItemStyle HorizontalAlign="Left" /> 
        
                                </telerik:GridBoundColumn> 
        
                                <telerik:GridBoundColumn DataField="AddressTypeObj.Name" HeaderText="Adres type"> 
        
                                    <ItemStyle HorizontalAlign="Left" /> 
        
                                </telerik:GridBoundColumn> 
        
                                 <telerik:GridTemplateColumn UniqueName="TemplateActions" AllowFiltering="false"> 
        
                                    <HeaderTemplate> 
        
                                        <table border="0" cellpadding="0" cellspacing="0"> 
        
                                            <tr> 
        
                                                <td colspan="3" align="center"><p>Acties</p></td> 
        
                                            </tr> 
        
                                        </table> 
        
                                    </HeaderTemplate> 
        
                                    <ItemTemplate> 
        
                                    <table border="0" cellpadding="0" cellspacing="0" width="100%"> 
        
                                        <tr> 
        
                                            <td style="width:50%; border:0px; text-align:center;"> 
        
                                                <telerik:RadCodeBlock ID="RadCodeBlock1" runat="server"> 
        
                                                    <asp:ImageButton ImageUrl="../Images/edit.gif" AlternateText="Editeren" CausesValidation="false" runat="server" ID="btn_Edit" OnClick="Edit_OnClick" CommandName="Edit" CommandArgument='<%#Eval("AddressId") %>' /> 
        
                                                </telerik:RadCodeBlock> 
        
                                            </td> 
        
                                            <td style="width:50%; border:0px; text-align:center;"> 
        
                                                <telerik:RadCodeBlock ID="RadCodeBlock2" runat="server"> 
        
                                                    <asp:ImageButton ImageUrl="../Images/recyclebin.gif" AlternateText="Verwijderen" CausesValidation="false" runat="server" ID="btn_Delete" OnClick="Delete_OnClick"  CommandName="Edit" CommandArgument='<%#Eval("AddressId") %>' /> 
        
                                                </telerik:RadCodeBlock> 
        
                                            </td> 
        
                                        </tr> 
        
                                    </table> 
        
                                    </ItemTemplate> 
        
                                    <ItemStyle HorizontalAlign="Center" /> 
        
                                    <HeaderStyle HorizontalAlign="Center" /> 
        
                                </telerik:GridTemplateColumn> 
        
                            </Columns> 
        
                        </MasterTableView> 
        
                        <PagerStyle Mode="NextPrevAndNumeric" NextPageText="Volgende pagina" PrevPageText="Vorige pagina" NextPagesToolTip="Volgende pagina" PrevPagesToolTip="Vorige pagina" PagerTextFormat="Pagina: {4}  Pagina {0} tot {3} op {5}"  />  
        
                    </telerik:RadGrid>

Any idee?

Thanks.

Edwin.

Grid

answered on 18 Feb 2009

1 answer

147 views

Removing "not-allow" cursor...

Is there any way to permanently remove the "not-allow" cursor?

That is, always having a pointer or hand cursor, no matter what happen to the tree or mouse action.

I'd like to add the ability to drag anything from outside and drop it on the treeview.

Can anybody give me some hints or pointers of how to do this?

Thanks.

TreeView

answered on 18 Feb 2009

1 answer

143 views

Rad tool tip

Hi,

When i try to submit the webpage, it throws an error message "_events is not null or not an object". This happens only when i add the Rad tooltip. if i don't add the rad tooltip, i don't get the error message. Please let me know how to fix it. Thanks.

--Viji.

ToolTip

answered on 18 Feb 2009

1 answer

206 views

[Solved] radCombobox Selected item display

I have a form with several radcomboboxes and a few buttons and textboxes. Each combobox has an empty Text Message that displays in gray italics. In the webform, you can select an item in the combobox using the dropdown UI or you can also click on an ad on the side of the page and the item is selected for you using javascript.

When the item is selected using javascript it displays the text for the item (as though it is actually selected), but the text is rendered with the Empty Item Text Style. So, it looks like the item was not selected.

Hope that makes sense. Please let me know if there is something I need to do to get the selected item to display properly.

ComboBox

answered on 18 Feb 2009