Questions on UI for ASP.NET AJAX Forum

0 answers

89 views

Hello there,

im using radeditors to update news content. when i click in the radgrid on some row, it opens a jquery dialog and sets two radeditor using set_html(Preview and Content).

This works perfect in google chrome but not on IE and FF. the html field has the content, but the design field dont and i cant even type on it.

here's the code:

var varTitle = eventArgs.getDataKeyValue("title");

var varInitialDate = eventArgs.getDataKeyValue("initial");

var varEndDate = eventArgs.getDataKeyValue("end");

var varPreview = eventArgs.getDataKeyValue("prev");

var varContent = eventArgs.getDataKeyValue("content");

*** Opens the dialog ***

$find('<%= Title.ClientID%>').set_value(varTitle);

$find('<%= ID.ClientID%>').get_textBox().control.set_value(varInitialDate);

$find('<%= ED.ClientID%>').get_textBox().control.set_value(varEndDate);

$find('<%= Preview.ClientID%>').set_html(varPreview);

$find('<%= Content.ClientID%>').set_html(varContent);

any ideas on what the problem is?

thanks

WebParts for SharePoint

asked on 17 Jul 2014

3 answers

330 views

Rad-Grid Batch mode Different Controls per Row

I can create different controls per column depending on data from code behind and it works.

I want to create different controls per each row in code behind.
example:

<EditMode>
ColumnA ColumnB
Row I: RadComboBox RadComboBox
Row II: RadNumericTextBox RadNumericTextBox
Row III: CheckBox CheckBox
...

The problem is the Rad-grid Batch mode only have one Control in one Edit-template for each column, that means all the rows have the same Edit-template and control.

this I can do:

ColumnA (RadComboBox) ColumnB(RadNumericTextBox)
Row I: RadComboBox RadNumericTextBox
Row II: RadComboBox RadNumericTextBox
Row III: RadComboBox RadNumericTextBox

Is it possible to have Multiple Edit-templates per column or what is my alternatives?

Grid

answered on 17 Jul 2014

17 answers

314 views

how to print radgrid while using master content pages and UserControls.

Hi I want to print radgrid but its not working when using on a usercontrol and then on master page.

please help.

I using the following code in my user control.

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="printTestRadgrid.ascx.cs" Inherits="WebUserControls_Employees_printTestRadgrid" %>

<telerik:RadCodeBlock ID="RadCodeBlock1" runat="server">

<script type="text/javascript">

function PrintRadGrid() {

debugger;

var previewWnd = window.open('about:blank', '', '', false);

var sh = '<%= Page.ClientScript.GetWebResourceUrl(radGrid1.GetType(),"Telerik.WebControls.RadControls.Grid.Skins.Default.Styles.css") %>';

sh = sh.replace("&t", "&t");

var styleStr = "<html><head><link href = '" + sh + "' rel='stylesheet' type='text/css'></link>";

var htmlcontent = styleStr + "<body>" + window["radGrid1"].Control.innerHTML + "</body></html>";

htmlcontent = htmlcontent.replace(/<script .*?>(.|\n)*?<\/script>/gi, "")

previewWnd.document.open();

previewWnd.document.write(htmlcontent);

previewWnd.document.close();

previewWnd.print();

previewWnd.close();

}

</script>

</telerik:RadCodeBlock>

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

<div class="wrapper">

<div class="topBar">

<p class="headingText">

<asp:LinkButton ID="LinkButton1" runat="server" type="button" Text="[ Print Grid ]"

Font-Underline="false" ForeColor="Black" OnClick="LinkButton1_Click" /></p>

This code-library demonstrates how to print RadGrid without surrounding content<br />

</div>

<telerik:RadGrid ID="radGrid1" runat="server" DataSourceID="SqlDataSource1" Style="margin: 20px;"

AllowPaging="True" AllowSorting="True" AllowFilteringByColumn="True" GridLines="None">

</telerik:RadGrid>

</div>

</telerik:RadAjaxPanel>

<asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:mobily_alexmarConnectionString %>"

SelectCommand="SELECT [EmployeeID], [EmployeeNumber], [EmployeeStatus], [EmployeeName], [EmployeeNameArabic], [FatherName], [Gender], [MeritalStatus], [DateOfBirth], [Email], [PrimaryMobile], [SecondaryMobile], [CurrentAddress] FROM [tbl_Employee]">

</asp:SqlDataSource

>







and in the code behind



 foreach (GridItem item in radGrid1.MasterTableView.GetItems(new GridItemType[] { GridItemType.Pager, GridItemType.FilteringItem }))

            item.Display = false;

  RadAjaxPanel1.ResponseScripts.Add("PrintRadGrid('" + radGrid1.ClientID + "')"); 



please tell me soon

Thanks.





Also when i use radgrid inside a fieldset the ragrid loses its scrolling property and there will b no scrolling for radgrid.

Grid

answered on 17 Jul 2014

5 answers

150 views

Keyboard support not working with mouse selection

Hello,

In my opinion, the keyboard support demo (Grid - Keyboard Support) shows some odd behaviour in combination with the mouse vs. keyboard selection. The keyboard only fully works when you follow a specific selection pattern.

First the expected behaviour using keyboard selection on the second row:
a.1) Open the demo from the link http://demos.telerik.com/aspnet-ajax/grid/examples/accessibility-and-internationalization/keyboard-support/defaultcs.aspx.
a.2) Select the first row with the mouse.
a.3) Press the down arrow to select the second row.
a.4) Press Enter and the row goes into edit mode. Pressing Escape cancels the edit mode. Great!

Now the same selection, but using the mouse:
b.1) Open the demo in a new browser page.
b.2) Select the second row by clicking clicking on the Contact Name cell.
b.3) Try to start edit mode by pressing Enter. Nothing happens. This is confusing for our users. It worked before?
b.4) Okay, so a small bug. Press the Pencil icon to go into edit mode.
b.5) Press Escape to cancel edit mode. Notice that nothing happen.
b.6) Pressing Enter does work. However, Enter does not work when you start editing after immediatelly pressing the Pencil icon.

I would like to have full keyboard support when using the mouse. The keyboard should work all the time, without telling the user to first use the arrow keys to get the grid into the proper editing mode.

Is this expected behaviour? I noticed the grid has a different mode when I use the arrow keys. Is there some setting I can use?

Best regards,

Marcel

http://demos.telerik.com/aspnet-ajax/grid/examples/accessibility-and-internationalization/keyboard-support/defaultcs.aspx

Grid

answered on 17 Jul 2014

1 answer

143 views

[Solved] prevent the RadSearchBox from displaying items

Hello,

I am currently working on a project with a RadSearchBox .

VB.NET:

01.Protected Sub Page_Load(ByVal sender As Object, ByVal e As System.EventArgs) Handles Me.Load

02. Dim User_Report As New DataTable

03. Session("User_Report") = GenTreeData(User_Report)

04.

05. RadSearchBox1.DataTextField = "Name"

06. RadSearchBox1.DataValueField = "ID"

07. RadSearchBox1.DataSource = CType(Session("User_Report"), DataTable)

08. RadSearchBox1.DataBind()

09.

10.End Sub

11.

12.Private Function GenTreeData(User_Report As DataTable) As DataTable

13.

14. User_Report.Columns.Add("Section")

15. User_Report.Columns.Add("ID")

16. User_Report.Columns.Add("Parent_ID")

17. User_Report.Columns.Add("Description")

18. User_Report.Columns.Add("Name")

19.

20. User_Report.Rows.Add("1", "101_1", "-1-1", "dedcrip", "xxxxxxx")

21. User_Report.Rows.Add("1", "101_2", "-1-1", "dedcrip", "vvvvv")

22. User_Report.Rows.Add("-1", "102_1", "-1-1", "dedcrip", "ccc")

23. User_Report.Rows.Add("1", "-2-2", Nothing, Nothing, "ddd")

24. User_Report.Rows.Add("1", "-3-3", "-1-1", Nothing, "ddd")

25. User_Report.Rows.Add("1", "102_2", "-2-2", "dedcrip", "hhhhh")

26. User_Report.Rows.Add("2", "101_3", "-2-2", "dedcrip", "lll")

27. User_Report.Rows.Add("2", "-1-1", Nothing, Nothing, "ooooo")

28. User_Report.Rows.Add("1", "101_4", "-3-3", "dedcrip", "zzzzz")

29. User_Report.Rows.Add("1", "102_3", "-3-3", "dedcrip", "zzzzz")

30. User_Report.Rows.Add("1", "102_4", "-3-3", "dedcrip", "zzzzz")

31. User_Report.Rows.Add("1", "102_5", "-1-1", "dedcrip", "zzzzz")

32. Return User_Report

33.End Function

ASPX:

<telerik:RadSearchBox ID="RadSearchBox1" runat="server" EmptyMessage="search" EnableAutoComplete="true">

<DropDownSettings Height="550px" Width="400px">

<ItemTemplate>

<div class="search-report-box">

<span id="serach-report-name"><%# DataBinder.Eval(Container.DataItem, "Name")%></span><br />

<span id="search-report-category"><%# DataBinder.Eval(Container.DataItem, "Description")%></span>

</div>

</ItemTemplate>

</DropDownSettings>

</telerik:RadSearchBox>

How can I prevent the RadSearchBox from displaying items
whose description is empty?

I’ll be glad for help,

Daniel.

SearchBox

answered on 17 Jul 2014

3 answers

163 views

[Solved] Different filters for MasterView and DetailView in RadGrid

Hello,

I am currently working on a project with a RadGrid that has a DetailView.

I need to do only a custom filter on the MasterTableView,
I need to do only a default RadGrid filter on the DetailView.

Thanks,

Daniel

Grid

answered on 17 Jul 2014

1 answer

234 views

Slideshow with Paging Enabled / Lazy Loading

We have a number of end-users who are photo-happy and like to have single image galleries containing 200 images or more. When loading all these at the same time, the initial loading of the page is noticeably slow and it's hitting the server harder than it should be (creating all those thumbnails - most of which will never be seen).

To combat this, we've enabled paging and for now set the page size to be 40. Initial testing shows that the page load times go from about 7.5 seconds back down to sub-second load. So that's good. However, it creates a new problem for the end-user, which is (to us) unexpected behavior when the slide-show is running (either full-screen or not). We figured that after the 40th image on page 1, then the 1st image on page 2 would auto-magically be the next shown. Instead, the gallery returns to the 1st image on the 1st page (if looping is on) or just stops (if it's off); forcing the user to click "page 2".

Plus, if the end-user has gone full-screen with the gallery, turned on the slide-show, then clicks to go to page 2; it returns back to the non-full-screen version of the gallery with the new set of images.

Having been with Telerik for almost 10 years now, I know you guys can do better :) A couple suggestions...

Option 1:
The control knows whether or not paging is enabled; it should be able to detect the slide-show index AND page index in order to determine what to do when it hits an upper limit. I'd suggest automatically going to the next page and re-starting the slideshow with the first image - basically doing what the end-user (who *will* get confused doing this) would have to do manually. It that causes a page refresh because it's a post-back then so be it, as long as the rotation continues AND the visible state (full-screen or not) is persisted.

Option 2 (even better):
Implement a lazy-loading scenario for the images. It appears that currently, if we were to load 200 images into the control, that upon the initial loading of the page, all 200 thumbnails are created at the same time instead of just the ones that are currently visible in the thumbnail slider. Perhaps a better solution is to load all the images in the slider with a blank src attribute and instead use data-src; then detecting the visibility of the thumbnail to switch the data-src attribute to be the actual src attribute. Since that would break SEO you'd probably want to make lazy-loading an option - however - in our case we don't want SEO on user-submitted image galleries anyway so that would actually be a good thing for search engines to leave them out of their image searches.

Thanks as always for listening :)

Shaun

ImageGallery

answered on 17 Jul 2014

4 answers

304 views

[Solved] collapse - expand When click on Node that have children, without PostBack

Hello,

I am currently working on a project with a RadTreeView.

I need only when I click on a leaf with no children it do a PostBack.
When I click on a leaf that has children, it will be performed expand/ collapse - depending on the current mode.
(If it has been expanded – it will be collapse, if collapse - expand)

I have a js code, but it’s give me an error every time I click on a node that has children:

ASPX:

01.// TreeView_Menu Expand/Colapse When Pressing On Branch Node

02. function TreeViewExpanCollaps_OnClientNodeClicked(sender, args) {

03. var node = args.get_node(),

04. $element = $(node.get_element()),

05. $selectedNodeElement;

06.

07. if (node.get_nodes().get_count() > 0) {

08. if (!node.get_expanded()) {

09. node.expand();

10. args.set_cancel(true);

11. }

12. else {

13. node.collapse();

14. args.set_cancel(true);

15. }

16. }

17.

18.

19. }

20.

21. <telerik:RadTreeView ID="RadTreeView1" Runat="server" Skin="MetroTouch" OnClientNodeClicked="TreeViewExpanCollaps_OnClientNodeClicked">

VB.net:

Protected Sub RadTreeView1_NodeClick(sender As Object, e As Telerik.Web.UI.RadTreeNodeEventArgs) Handles RadTreeView1.NodeClick

lbl_txt.Text = e.Node.Text

End Sub

Errors:

Uncaught TypeError: undefined is not a function expand_colapse_treeview.aspx:28

TreeViewExpanCollaps_OnClientNodeClicked expand_colapse_treeview.aspx:28

(anonymous function) Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=RadScriptManager1_TSM&compress=1&_TSM_CombinedScri…:6

Telerik.Web.UI.RadWebControl.raiseEvent Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=RadScriptManager1_TSM&compress=1&_TSM_CombinedScri…:951

c.RadTreeView._raiseEvent Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=RadScriptManager1_TSM&compress=1&_TSM_CombinedScri…:5434

c.RadTreeView._click Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=RadScriptManager1_TSM&compress=1&_TSM_CombinedScri…:5385

Telerik.Web.UI.EventMap._onDomEvent Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=RadScriptManager1_TSM&compress=1&_TSM_CombinedScri…:3114

(anonymous function) Telerik.Web.UI.WebResource.axd?_TSM_HiddenField_=RadScriptManager1_TSM&compress=1&_TSM_CombinedScri…:6

b

(The error refers to lines 10 and 14)

How to solve this problem ?
I’ll be glad for your help.

Thanks,

Daniel.

TreeView

answered on 17 Jul 2014

9 answers

508 views

[Solved] Make dropdown width same as control width

In responsive design the DropDownTree control is usually configured with width=100%
I wonder how in this case to make the dropdown width the same as the control width to make it responsive too?

DropDownTree

answered on 17 Jul 2014

4 answers

161 views

[Solved] RadSpell

Hi,

I have a radspell with controlToCheck(Textbox1) in my web form..i want to activate the radspellcheck on button onclientclick event because button also have onclick event..i need to fire the radspellcheck before button onclick event...Simply i want a spellcheck on button submit...i have tried but onclick event only fired fiirst..could please some example please...

Spell

answered on 17 Jul 2014