Questions on UI for ASP.NET AJAX Forum

6 answers

332 views

Hello guys,
I have a problem clicking on the horizontal scrollbar ( instead of dragging it to the right ) when frozen columns are present.
The problem is all about a difference in behaviour of the grid between clicking and dragging the horizontal scrollbar.
Some customers of mine are complaining about disappearing columns.

You can encounter the same problem on your radgrid frozen columns demo in your demo page located in:
http://demos.telerik.com/aspnet-ajax/grid/examples/functionality/scrolling/scrolling/defaultcs.aspx

as you can see in your grid you show 2 frozen columns ("CUSTOMER ID", "COMPANY NAME")
followed by "CONTACT NAME", "CONTACT TITLE", "ADDRESS", "CITY", "POSTAL CODE" and other columns.

If you slowly drag the horizontal scrollbar to the right, you can see all columns one after another.

If you instead click on the scrollbar,

starting from the initially displayed columns ("CUSTOMER ID", "COMPANY NAME", "CONTACT NAME", "CONTACT TITLE") ( scrollbarclick_01.PNG )

the grid will display the following columns "CUSTOMER ID", "COMPANY NAME", "CITY", "POSTAL CODE" ( scrollbarclick_02.PNG)

the problem is that a column is skipped: we are not able to see the column "ADDRESS" between "CONTACT TITLE" and "CITY". ( scrollbarclick_03.png )

Any suggestion or solution?

Luca

Grid

answered on 06 Oct 2015

0 answers

89 views

Telerik control css loading Issue

Hello Team,

We are using telerik control for one of the product, application is hosted at client end and some external users uses the application from their environment using some kind of VPN. recently one of the client's contractor reported the issue that application is not loading properly ,where I find the telerik control CSS is not getting load only for certain user who are using the application through some kind of VPN.

Could you please help me out ,what can be the reason ,why CSS for telerik control is not getting load.

Note : Application is running on IE 9 and issue is appearing only for certain user

General Discussions

asked on 06 Oct 2015

2 answers

86 views

Hiding Content area tooltip (title)

Hi guys.

I'm trying to hide the content's area tooltip of radeditor.

Doing some research in the forum I found the following links

http://www.telerik.com/forums/disable-title-on-content-area

http://www.telerik.com/forums/hiding-radeditor-tooltip

But when I run my project it throws javascript error editorLoad is undefined

Here's the declaration of the editor:

01. <telerik:RadEditor runat="server" ID="desc" MaxTextLength="1500" Language="es-ES" EditModes="Design, Preview" Content='<%# DataBinder.Eval(Container, "DataItem.Descripcion") %>' OnClientLoad="editorLoad">

02.

03. <CssFiles>

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

05. </CssFiles>

06. <Languages>

07. <telerik:SpellCheckerLanguage Code="es-ES" Title="Español" />

08. </Languages>

09. <Tools>

10. <telerik:EditorToolGroup>

11. <telerik:EditorTool Name="InsertLink" Text="Insertar vínculo"/>

12. <telerik:EditorTool Name="ApplyClass" Text="Elegir clase"/>

13. <telerik:EditorTool Name="AjaxSpellCheck" Text="Verificar ortografía" />

14. <telerik:EditorTool Name="FormatBlock" Text="Elegir formato" />

15. <telerik:EditorTool Name="InsertParagraph" Text="Insertar párrafo"/>

16. </telerik:EditorToolGroup>

17. </Tools>

18.

19.

20.<TrackChangesSettings CanAcceptTrackChanges="False"></TrackChangesSettings>

21. </telerik:RadEditor>

22. <script type="text/javascript">

23. function editorLoad(editor) {

24. var contentAreaEl = editor.get_contentAreaElement();

25. contentAreaEl.removeAttribute("title");

26. }

27.</script>

Can you please help me with this.

Hope your help.

Best regards.

Cristian

Editor

answered on 06 Oct 2015

1 answer

91 views

problem with VB12 and Win10

hi ! I´m new in this forum but I use Telerik by many years ago...
I changed by other computer my desktop, and install VS with Telerik, but this dont work in the designer of VB.. so sorry by my english.
this is the problem:

I add by reference
img1

I add the instance in the top of the page
img2

I add in the web.config
img3

but I can see the result in the browser, but dont work in the designer.

I upgraded my computer to windows 10, and I have VS 2012, and Ajax Control Tool Kit

Installer and VS Extensions

answered on 06 Oct 2015

1 answer

908 views

RadComboBox values datasource and data binding from another datasource

Hi all,
I've a RadComboBox inside EditItemTemplate

1.<telerik:RadComboBox Skin="Silk" ID="cognome_sostituto_combo" runat="server" DataSourceID="SqlDataSourceGiocatori1" DataTextField="Cognome" DataValueField="Cognome" DropDownWidth="200px" MinFilterLength="2" Filter="StartsWith" AllowCustomText="false" Text='<%# Bind("Cognome_sostituto")%>' >

(NOTE: this code is inside a GridView with <Columns><TemplateField>)

My scope is:

- populate combo with items from SqlDataSourceGiocatori1 (that has a query like select cognome from ....) --> done
- set selected item from SqlDataSource connected to GridView --> not working using Text='<%# Bind... --> not working

If I use, for example, a TextBox and bind Text with Text='<%# Bind("Cognome_sostituto")%>' everything is ok but there's no autocomplete.

The error I get is "Databinding methods such as Eval(), XPath(), and Bind() can only be used in the context of a databound control"

Any ideas?

Thanks for your help

ComboBox

answered on 06 Oct 2015

1 answer

257 views

Horizontal scroll without fix grid width

Hello!

I have a problem with horizontal scroll in grid. I generete programmatically columns with fixed width in HeaderStyle.Width on OnInit event, and this grid

<div style="width: 100%; display: block;">

<telerik:RadGrid ID="gvMain" Width="100%" runat="server" OnNeedDataSource="gvMain_OnNeedDataSource" OnBatchEditCommand="gvMain_OnBatchEditCommand"

AutoGenerateColumns="False" AllowPaging="True" PageSize="100" AllowSorting="True" AllowFilteringByColumn="True" Skin="Metro" Culture="ru-Ru">

<MasterTableView CommandItemDisplay="TopAndBottom" AllowAutomaticUpdates="True" EditMode="Batch" AllowAutomaticDeletes="False"

AllowAutomaticInserts="False" DataKeyNames="PersonId" TableLayout="Fixed">

<BatchEditingSettings EditType="Cell"></BatchEditingSettings>

<GroupByExpressions>

<telerik:GridGroupByExpression>

<SelectFields>

<telerik:GridGroupByField FieldAlias="FacultyName" HeaderText="Факультет" FieldName="FacultyName" />

</SelectFields>

<GroupByFields>

<telerik:GridGroupByField FieldName="FacultyName" />

</GroupByFields>

</telerik:GridGroupByExpression>

</GroupByExpressions>

<CommandItemSettings ShowAddNewRecordButton="False" SaveChangesText="Сохранить" CancelChangesText="Отменить изменения" RefreshText="Обновить"></CommandItemSettings>

</MasterTableView>

<PagerStyle AlwaysVisible="True"></PagerStyle>

<ClientSettings AllowKeyboardNavigation="True">

<Scrolling AllowScroll="True" UseStaticHeaders="True" FrozenColumnsCount="5"></Scrolling>

</ClientSettings>

</telerik:RadGrid>

</div>

When sum of columns width exceed the page width, I have the Page horizontal scroll instead grid scrolling. How can I fit Grid into parent div? (It's normally work with PivotGrid, but not with a Grid)

Grid

answered on 06 Oct 2015

5 answers

256 views

Grid Batch Mode using ListBox as Editor

I have a grid using the Batch edit mode. I have a need to use a multi-select ListBox as the editor for a particular column and to bind it using data from the server (in code-behind, not a front-end SQLDataSource, etc) and then pre-select items if they match information coming from the database. How? In previous grids, I could use ItemDataBound to preload the ListBox. However, batch mode was a lot of work building client side code to handle multiple edits. I'm wanting to use your new batch mode, but...

I have tried to read/understand and follow the information here and here.

I have tried all manner of the following in the PreRender method, but cannot get a hold of the listbox...

<telerik:GridTemplateColumn DataField="MyDataField" HeaderText="My Header" UniqueName="MyUniqueName">

<ItemTemplate>

<%# Eval("MyBoundItem") %>

</ItemTemplate>

<EditItemTemplate>

<telerik:RadListBox ID="MyRadListBox" runat="server" SelectionMode="Multiple" />

</EditItemTemplate>

</telerik:GridTemplateColumn>

GridTableView masterTable = (sender as RadGrid).MasterTableView;

RadListBox myRadListBox = masterTable.GetBatchColumnEditor("MyRadListBox") as RadListBox; // Suspicious Bind & null being returned

myRadListBox.DataSource = myDataSource;

myRadListBox.DataBind();

How do I go about getting a hold of the ListBox, populate it from code-behind, and select the items in it based on values from the database? Is this possible?

Grid

answered on 06 Oct 2015

2 answers

124 views

Cloning nodes client side

Our solution is looking to clone items from a master list into a new list. We have this working on the server side but would like to move it client side if it is possible so we can prevent round trips taken.

protected void HandleDrop(object sender, RadTreeNodeDragDropEventArgs e)

{

RadTreeNode sourceNode = e.SourceDragNode;

RadTreeNode destNode = e.DestDragNode;

RadTreeViewDropPosition dropPosition = e.DropPosition;

//var currentlesson = sourceNode.Value;

//RadTreeNode foundNode = RadTreeView2.FindNodeByValue(currentlesson);

if (destNode != null)

{

if (sourceNode.TreeView.SelectedNodes.Count <= 1)

{

var currentlesson = sourceNode.Value;

RadTreeNode foundNode = RadTreeView2.FindNodeByValue(currentlesson);

//this checks if node already exists in new list

if (foundNode == null)

{

int? index = PerformDragAndDrop(dropPosition, sourceNode, destNode);

if (index != null)

{

//Console.Error.WriteLine("NodeDrop: " + e.SourceDragNode.Text + " to " + e.DestDragNode.Text);

//var currentindex = e.SourceDragNode.Index;

var currentindex = index;

var objectid = e.SourceDragNode.Value;

var parentid = destNode.Value;

var parentid2 = "Newlist";

var action = "moved";

if (parentid.Contains("LN"))

{

EventMovement.Add(action + currentindex + "," + objectid + "," + parentid2);

result.Text += action + "," + currentindex + "," + objectid + "," + parentid2 + Environment.NewLine;

}

else

{

EventMovement.Add(action + currentindex + "," + objectid + "," + parentid);

result.Text += action + "," + currentindex + "," + objectid + "," + parentid + Environment.NewLine;

}

else if (sourceNode.TreeView.SelectedNodes.Count > 1)

{

int? index = PerformDragAndDrop(dropPosition, sourceNode, destNode);

if (index != null)

{

foreach (RadTreeNode currentNode in sourceNode.TreeView.SelectedNodes)

{

var currentlesson = currentNode.Value;

RadTreeNode foundNode = RadTreeView2.FindNodeByValue(currentlesson);

//this checks if node already exists in new list

if (foundNode == null)

{

PerformDragAndDrop(dropPosition, currentNode, destNode);

//Console.Error.WriteLine("NodeDrop: " + currentNode.Text + " to " + e.DestDragNode.Text);

var currentindex = index;

var objectid = currentNode.Value;

var parentid = destNode.Value;

var action = "group-moved";

EventMovement.Add(currentindex + "," + objectid + "," + parentid);

result.Text += action + "," + currentindex + "," + objectid + "," + parentid + Environment.NewLine;

}

destNode.Expanded = true;

}

private int? PerformDragAndDrop(RadTreeViewDropPosition dropPosition, RadTreeNode sourceNode, RadTreeNode destNode)

{

int? index = null;

if (sourceNode.Equals(destNode) || sourceNode.IsAncestorOf(destNode))

{

return null;

}

// clone the sourceNode

List<RadTreeNode> sourceNodeClone = CloneNode(sourceNode);

if (remove == false)

{

sourceNode.Owner.Nodes.Remove(sourceNode);

}

// add source node as a child of the destination node

//if (!sourceNode.IsAncestorOf(destNode))

//{

// destNode.Nodes.Add(sourceNodeClone);

// sourceNodeClone.AllowDrop = false;

//}

// this prevents items from being added as children when moved

switch (dropPosition)

{

case RadTreeViewDropPosition.Over:

// child

if (!sourceNode.IsAncestorOf(destNode))

{

foreach (RadTreeNode node in sourceNodeClone)

destNode.Nodes.Add(node);

}

break;

case RadTreeViewDropPosition.Above:

// sibling - above

foreach (RadTreeNode node in sourceNodeClone)

destNode.InsertBefore(node);

break;

case RadTreeViewDropPosition.Below:

// sibling - below

foreach (RadTreeNode node in sourceNodeClone)

destNode.InsertAfter(node);

break;

}

var currentlesson = sourceNode.Value;

RadTreeNode foundNode = RadTreeView2.FindNodeByValue(currentlesson);

if (foundNode != null)

{

index = foundNode.Index;

}

return index;

}

private List<RadTreeNode> CloneNode(RadTreeNode sourceNode)

{

List<RadTreeNode> clonedNode = new List<RadTreeNode>();

RadTreeNode clone = new RadTreeNode();

clone.Text = sourceNode.Text;

clone.Value = sourceNode.Value;

clone.ImageUrl = sourceNode.ImageUrl;

clone.ExpandedImageUrl = sourceNode.ExpandedImageUrl;

clone.AllowDrop = sourceNode.AllowDrop; //this carries over the allow drop from the main list

//check if parent node -- for each statement didnt work here

if (sourceNode.ParentNode != null)

{

if (sourceNode.Nodes.Count > 0)

{

//grab and move children too

for (int i = 0; i < sourceNode.Nodes.Count - 1; i++)

{

clone.Nodes.Add(sourceNode.Nodes[i]);

}

clonedNode.Add(clone);

return clonedNode;

}

TreeView

answered on 06 Oct 2015

5 answers

299 views

Using keyboard to move between tabs

The online examples and documentation seem to suggest that <TAB> and <Shift-TAB> keys can be used to move between tabs in the tab strip control.

So far I've been unable to that, even with the posted online example. I'm testing for 508 compliance, so this is critical. I was able to change the tabs using access keys, but not the <tab> key.

My page looks like this.

<telerik:RadTabStrip ID="RadTabStrip1" runat="server" SelectedIndex="0" MultiPageID="RadMultiPage1" ShowBaseLine="true">

<Tabs>

<telerik:RadTab runat="server" Selected="True" Text="<u>T</u>ables" AccessKey="T">

</telerik:RadTab>

<telerik:RadTab runat="server" Text="<u>P</u>arameters" AccessKey="P">

</telerik:RadTab>

</Tabs>

</telerik:RadTabStrip>

<telerik:RadMultiPage ID="RadMultiPage1" Runat="server" SelectedIndex="0">

<telerik:RadPageView id="RadPageView1" runat="server" Selected="true">

Table List

</telerik:RadPageView>

<telerik:RadPageView id="RadPageView2" runat="server">

Parameter List

</telerik:RadPageView>

</telerik:RadMultiPage>

Am I missing something or is this feature (use of <TAB> key) not supported?

/Stan

TabStrip

answered on 06 Oct 2015

2 answers

74 views

Send Filter command client-side and maintaining client-side state

Hello,

I'm using a RadGrid with dynamic columns and column filtering. I'm also setting a filter template for the columns I want to have this feature. Everything is working fine except for one thing I'm trying.

When I send the filter command on the client-side:

1.tableView.filter(columnUnique, searchValue, condition);

I also set a css class on an element of my template.

I see this element changing but when the filter command is completed, it's gone.

Well, I implemented so far:

- The columns on the grid are defined during the page_init

- During this initialization, I set the filter templates too

This is an example of one of my templates:

01. public TextTemplate(Page _page, RadGrid _grid, RadContextMenu _menu, GridColumnSetting _column)

02. {

03. page = _page;

04. grid = _grid;

05. menu = _menu;

06. columnSettings = _column;

07.

08. panel = (Panel)page.LoadControl(typeof(Panel), null);

09. panel.ID = "ftrPnl_text_" + columnSettings.DataMember;

10. panel.CssClass = "ftrPnl";

11.

12. panel2 = (Panel)page.LoadControl(typeof(Panel), null);

13. panel2.ID = "ftrIpt_text_" + columnSettings.DataMember;

14. panel2.CssClass = "ftrIpt";

15.

16. textBox = (CustomTextBox)page.LoadControl("~/Controls/CustomTextBox.ascx");

17. textBox.ID = "txt0_" + columnSettings.DataMember;

18. textBox.ToolTip = columnSettings.ColumnToolTip;

19.

20. button = (Button)page.LoadControl(typeof(Button), null);

21. button.ID = "btn_filter_" + columnSettings.DataMember;

22. button.UseSubmitBehavior = false;

23. button.CssClass = "ftrTxt rgFilter btn_filter";

24.

25. hidden = (HiddenField)page.LoadControl(typeof(HiddenField), null);

26. hidden.ID = "hdn_filter_" + columnSettings.DataMember;

27. }

28.

29. public void InstantiateIn(Control container)

30. {

31. textBox.OnClientKeyDown =

32. "filterOnEnter('" + hidden.ID + "', 'text', '" + button.ID + "');";

33.

34. hidden.Value =

35. grid.ClientID + FLP.SEPPROP +

36. columnSettings.DataMember + FLP.SEPPROP +

37. textBox.ClientID + FLP.SEPPROP +

38. columnSettings.FilterFunction.AsString();

39.

40. button.OnClientClick = FilterButtonJS();

41.

42. panel2.Controls.Add(textBox);

43. panel.Controls.Add(panel2);

44. panel.Controls.Add(button);

45.

46. container.Controls.Add(panel);

47. container.Controls.Add(hidden);

48. }

Grid

answered on 06 Oct 2015