Questions on UI for ASP.NET AJAX Forum

4 answers

123 views

[Solved] TreeView in ComboBox - Select Item Issues

I followed the demo on the Telerik website for implementing a RadTreeView within a RadComboBox. I have the TreeView displaying in the ComboBox, but when I select an item it doesn't display anything in the box. Attached is an image of what the ComboBox looks like after I select an item. Below is the code:

ASPX

<div class="collapsibleContainer" data-title="Notifications">

<telerik:RadAjaxLoadingPanel ID="notificationsLoadingPanel" runat="server" Skin="Simple" />

<telerik:RadTreeList ID="notificationsTree" runat="server" AutoGenerateColumns="false" AllowSorting="false" AllowPaging="false"

OnNeedDataSource="notifications_needdata" DataKeyNames="ID" ParentDataKeyNames="PID" ShowTreeLines="false" EditMode="PopUp"

OnPreRender="notifications_PreRender" OnItemDataBound="notificationTree_ItemDataBound" OnItemCommand="notificationTree_ItemCommand">

<Columns>

<telerik:TreeListEditCommandColumn ShowEditButton="false" AddRecordText="Add" HeaderStyle-Width="50px" />

<telerik:TreeListBoundColumn HeaderText="ID" DataField="ID" UniqueName="ID" Visible="false" />

<telerik:TreeListBoundColumn HeaderText="PID" DataField="PID" UniqueName="PID" Visible="false" />

<telerik:TreeListBoundColumn HeaderText="Name" DataField="Name" />

<telerik:TreeListBoundColumn HeaderText="Item" DataField="ItemsID" HeaderStyle-Width="100px" />

<telerik:TreeListBoundColumn HeaderText="Trigger On Allocate" DataField="TriggerOnAllocate" HeaderStyle-Width="125px"/>

<telerik:TreeListBoundColumn HeaderText="Category" DataField="Category" />

<telerik:TreeListBoundColumn HeaderText="Location" DataField="Location" HeaderStyle-Width="125px" />

<telerik:TreeListEditCommandColumn ShowAddButton="false" HeaderStyle-Width="50px" />

<telerik:TreeListButtonColumn HeaderStyle-Width="55px" Text="Delete" CommandName="Delete" ButtonType="LinkButton" />

</Columns>

<EditFormSettings EditFormType="Template" PopUpSettings-Modal="true" InsertCaption="Add Notification" PopUpSettings-Height="550px" PopUpSettings-Width="730px">

<FormTemplate>

<table>

<tr>

<asp:Label ID="notificationID" runat="server" Text='<%#Bind("ID") %>' Visible="false" />

<td>Name:</td>

<td colspan="3"><telerik:RadTextBox ID="editName" runat="server" EmptyMessage="Enter Name" /></td>

</tr>

<tr>

<td>Repeat Interval:</td>

<td><telerik:RadTextBox ID="editInterval" runat="server" /></td>

<td>Max Repeat:</td>

<td><telerik:RadTextBox ID="editRepeat" runat="server" /></td>

</tr>

<tr>

<td>Send On Weekends:</td>

<td><asp:CheckBox ID="editWeekends" runat="server" /></td>

<td>Send On Holidays:</td>

<td><asp:CheckBox ID="editHolidays" runat="server" /></td>

</tr>

<tr>

<td colspan="2">Item:</td>

<td colspan="2">Location:</td>

</tr>

<tr>

<td style="vertical-align:top;"><telerik:RadComboBox ID="editItem" runat="server" EmptyMessage="Type a PS#" MarkFirstMatch="true" OnSelectedIndexChanged="editItem_SelectedIndexChanged"/></td>

<td>

<telerik:RadButton ID="editItemTransfer" runat="server" Text="+" OnClick="editItemTransfer" />

<telerik:RadListBox ID="editItemListBox" runat="server" AllowDelete="true" Height="170px" Width="130px" ButtonSettings-Position="Left" />

</td>

<td style="vertical-align:top;">

<telerik:RadComboBox ID="editLocationComboBox" runat="server" OnClientDropDownOpened="OnClientDropDownOpenedHandler" ShowToggleImage="true" Width="230px">

<ItemTemplate>

<div id="div1">

<telerik:RadTreeView ID="editLocationTreeView" runat="server" OnClientNodeClicking="locationNodeClicking" />

</div>

</ItemTemplate>

<Items>

<telerik:RadComboBoxItem Text="" />

</Items>

</telerik:RadComboBox>

<script type="text/javascript">

var div1 = document.getElementById("div1");

div1.onclick = StopPropagation;

</script>

</td>

<td><telerik:RadListBox ID="editLocationListBox" runat="server" AllowDelete="true" AllowTransfer="true" Height="170px" Width="170px">

<ButtonSettings ShowDelete="true" Position="Left" TransferButtons="TransferTo" />

</telerik:RadListBox></td>

</tr>

<tr>

<td colspan="4">Category:</td>

</tr>

<tr>

<td style="vertical-align:top;"><telerik:RadComboBox ID="editCategory" runat="server" EmptyMessage="Type a Category" MarkFirstMatch="true" /></td>

<td colspan="3">

<telerik:RadButton ID="editCategoryTransfer" runat="server" Text="+" OnClick="editCategoryTransfer" />

<telerik:RadListBox ID="editCategoryListBox" runat="server" AllowDelete="true" Height="170px" Width="200px" ButtonSettings-Position="Left" />

</td>

</tr>

<tr>

<td colspan="4">

<telerik:RadButton ID="editSubmit" runat="server" Text="Submit" CommandName="Add Details" />

<telerik:RadButton ID="updateSubmit" runat="server" Text="Update" CommandName="Update" Visible="false" />

</td>

</tr>

</table>

</FormTemplate>

</EditFormSettings>

</telerik:RadTreeList>

JS

<script type="text/javascript">

function locationNodeClicking(sender, args) {

var combobox = document.getElementById(editLocationComboBox.InputID);

alert(combobox);

var node = args.get_node()

comboBox.set_text(node.get_text());

comboBox.trackChanges();

comboBox.get_items().getItem(0).set_text(node.get_text());

comboBox.commitChanges();

comboBox.hideDropDown();

// Call comboBox.attachDropDown if:

// 1) The RadComboBox is inside an AJAX panel.

// 2) The RadTreeView has a server-side event handler for the NodeClick event, i.e. it initiates a postback when clicking on a Node.

// Otherwise the AJAX postback becomes a normal postback regardless of the outer AJAX panel.

comboBox.attachDropDown();

}

function StopPropagation(e) {

if (!e) {

e = window.event;

}

e.cancelBubble = true;

}

function OnClientDropDownOpenedHandler(sender, eventArgs) {

// var tree = document.getElementById(editLocationTreeView.InputID);

var tree = sender.get_items().getItem(0).findControl("editLocationTreeView");

var selectedNode = tree.get_selectedNode();

if (selectedNode) {

selectedNode.scrollIntoView();

}

</script>

ComboBox

answered on 02 Jan 2012

1 answer

144 views

Conditional DataBinding

Hi all,

I have a grid view with an automatic datasource binding.
I would like this databinding to fire only if meets some condition.

Today, when ever a text is entered to the TextBox and a button is pressed the databidning is excuted.

Note - I don't want to change the datasource query, just it's happening...

Can I override this?

Thx

Grid

answered on 02 Jan 2012

2 answers

135 views

Insert Record Issue

Hi All,

I have one simple gridview with inline edit. My problem is that it does not display "Save" and "Cancel" image button while adding new record untill i placed below tag in the gridview

<telerik:GridEditCommandColumn ButtonType="ImageButton">

</telerik:GridEditCommandColumn>

I just only want to provide Insert functionality to gridview not edit functionality.

Any Idea ?

Regards,
Ruchi

Grid

answered on 02 Jan 2012

4 answers

207 views

Mega dropdown menu

Hi,

I have to create load mega dropdown menu dynamically from database. pls provide some examples.

Thank you.
Saranya.

Menu

answered on 02 Jan 2012

2 answers

102 views

Group Split Message Not Showing

Hi,

I'm facing issue in grouping with custom paging set to true, I'm not getting any group split message even if the grouped items split into multiple pages. Here are my grid settings;



<telerik:RadGrid ID="Grid1" AllowPaging="true" AllowCustomPaging="true"
                                GroupingEnabled="true" ShowGroupPanel="false" ShowStatusBar="false" AutoGenerateColumns="false" VirtualItemCount="100000" 
                                runat="server" OnItemDataBound="Grid1_ItemDataBound"
                                OnNeedDataSource="Grid1_NeedDataSource"> 
                                <PagerStyle AlwaysVisible="true" Mode="NextPrevAndNumeric" PagerTextFormat="Change page: {4} <strong><b>{5}</b> Items In <b>{1}</b> Pages </strong>"  
                                    PageSizeLabelText="Items Per Page : "  /> 
                                <GroupingSettings CollapseTooltip="Collapse client items" ExpandTooltip="Expand client items" RetainGroupFootersVisibility="true"  /> 
                                <MasterTableView EnableColumnsViewState="false" EnableViewState="true" TableLayout="Auto" ShowGroupFooter="true"
                                    GroupLoadMode="Client" > 
                                    <GroupByExpressions> 
                                        <telerik:GridGroupByExpression> 
                                            <SelectFields> 
                                                <telerik:GridGroupByField HeaderText="Client" FieldName="ClientNameWithID" SortOrder="Ascending" /> 
                                            </SelectFields> 
                                            <GroupByFields> 
                                                <telerik:GridGroupByField HeaderText="Client" FieldName="ClientNameWithID" SortOrder="Ascending" /> 
                                            </GroupByFields> 
                                        </telerik:GridGroupByExpression> 
                                    </GroupByExpressions>



</MasterTableView> 
                                <ClientSettings AllowGroupExpandCollapse="true"> 
                                    <Scrolling AllowScroll="true" UseStaticHeaders="true" SaveScrollPosition="false" /> 
                                    <ClientEvents OnGridCreated="GridCreated" /> 
                                    <Resizing AllowRowResize="False" EnableRealTimeResize="True" ResizeGridOnColumnResize="False"
                                    AllowColumnResize="False"></Resizing> 
                                </ClientSettings> 
                            </telerik:RadGrid>

Also I'm doing advanced databinding mechanism to bind the values to grid.

Please help me to solve the problem,

Thanks
Anoop

Grid

answered on 02 Jan 2012

1 answer

81 views

Update Telrik control

I am using the old version Rad control in my asp.net web application. now i am buy new telerik control and I want to upgrade my application with new telerik control .please suggest me the possible easy step to upgrade my application.
Regards
Anish

General Discussions

answered on 02 Jan 2012

5 answers

131 views

Collapse Ribbon Bar

Hi there,

How can i collapse Ribbon Bar.

RibbonBar

answered on 02 Jan 2012

4 answers

146 views

listbox overlays buttons

After setting up radlistboxes to transfer employees, the box on the left appears to overlay the transfer buttons. The buttons still work, but the look is not correct.

Any thoughts on what cause this?

ListBox

answered on 02 Jan 2012

4 answers

133 views

Accessing an item in the grid

Hello,
I have a radgrid.I wanna access the textbox which is in the Insert template.How can I achieve this?

<telerik:GridTemplateColumn HeaderText="InvoiceDate">

<ItemTemplate>

<%#Eval("InvoiceDate")%>

</ItemTemplate>

<InsertItemTemplate>

<asp:TextBox ID="txtInvoiceDate" runat="Server"></asp:TextBox>

</InsertItemTemplate>

</telerik:GridTemplateColumn>

Grid

answered on 02 Jan 2012

1 answer

119 views

Double Row Layout

Hello,

Is is possible to have a Rotator that displays its items in a format and order similar to the following:

_______________________________________________
|                        |                       |                    |                       |
|       Item 1       |       Item 3       |      Item 5     |      Item 7       |
|                        |                       |                    |                       |
_______________________________________________
|                        |                       |                    |                       |
|      Item 2        |       Item 4       |       Item 6    |      Item 8       |
|                        |                       |                    |                       |
_______________________________________________

I've tried setting my item width and height to 1/2 of the rotator width and height and using only pixel units (no percentages) but to no avail. The closest I get to the intended output is actually by having at least 8 or more items bound and by using a percentage for item width (17%) and having fixed pixel widths for rotator height, width and item height (1/2 of rotator height).

Any ideas as to how I can reproduce this effect even if I have less that 8 items bound.

Thanks in advance.

Rotator

answered on 02 Jan 2012