Questions on UI for ASP.NET AJAX Forum

1 answer

114 views

Hello,

I'm trying to display my individual start/stop datetimes by asset in a single bar, as seen in mockup.png.
I have been working with the Range Bar tied to my SQL data and am currently getting results seen in the results.png file.
My stored proc is returned results seen in SQL Proc.png

My questions are:

How do I group my YAxis so that I see 1 bar for the asset?
How do I show times along the X Axis? When I formatted to HH:MM, I didn't get any results in the chart.

Here is the code I'm using:

<%@ Page Language="VB" AutoEventWireup="false" CodeBehind="Default.aspx.vb" Inherits="ShiftTimeline._Default" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <telerik:RadStyleSheetManager id="RadStyleSheetManager1" runat="server" />
</head>
<body>
    <form id="form1" runat="server">
    <telerik:RadScriptManager ID="RadScriptManager1" runat="server">
        <Scripts>
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.Core.js" />
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQuery.js" />
            <asp:ScriptReference Assembly="Telerik.Web.UI" Name="Telerik.Web.UI.Common.jQueryInclude.js" />
        </Scripts>
    </telerik:RadScriptManager>
    <script type="text/javascript">
        //Put your JavaScript code here.
    </script>
    <telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
    </telerik:RadAjaxManager>
    <div>
        <telerik:RadHtmlChart ID="RadHtmlChart1" runat="server" DataSourceID="SqlDataSource1" Height="648px" Width="978px" >
<PlotArea >
    <XAxis DataLabelsField = "MachineName" >

    </XAxis>
    <YAxis Name="MinsElapsed" >
    </YAxis>
    <Series>
        <telerik:RangeBarSeries DataFromField="StartDate" DataToField="EndDate" Name="RangeBarSeries1">
        </telerik:RangeBarSeries>
    </Series>
</PlotArea>
        </telerik:RadHtmlChart>
        <asp:SqlDataSource ID="SqlDataSource1" runat="server" ConnectionString="<%$ ConnectionStrings:ProdMGRConnectionString %>" SelectCommand="bbx_rpt_MachineTruth2" SelectCommandType="StoredProcedure">
            <SelectParameters>
                <asp:Parameter DefaultValue="999" Name="MachineID" Type="Int32" />
            </SelectParameters>
        </asp:SqlDataSource>
    </div>
    </form>
</body>
</html>

Many thanks,

David

Chart (HTML5)

answered on 05 Apr 2017

1 answer

138 views

RadComboBox: click handlers lost after scrolling when using a client item template with load on demand

I'm using a RadComboBox in the load on demand (lazy) mode with a web service.

I'm using a client side item template of this form: <input type='checkbox' id='cb_#= Value #'/><span>#= Text #</span> (adding a checkbox before each item's text)

In the itemDataBound client side handler for this RadComboBox I'm retrieving the particular item's DOM element and the nested checkbox'es DOM element and adding a click handler function for each of them (using jquery's $(element).click(function() {})).

The click handler functions work fine until I scroll the items out of view and then scroll back, after that the click handlers are not called anymore.

I suppose this is because the DOM elements representing the items get re-created as they are scrolled in and out of view. But the itemDataBound event is raised only once and is not raised again when an item is scrolled back in view.

The only workaround I can think of is to use the onclick attribute in the HTML and reference a global function from there, but this is ugly.

Is there a nicer solution for this then using the onclick attribute?

Thanks,

Aleksey

ComboBox

answered on 05 Apr 2017

17 answers

862 views

RadGrid - Reset Scroll Position

Hello,

I am working on a project with a RadGrid.

The project requires that when a user clicks on a button, the RadGrid resets the scroll position.

My code:

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

<script type="text/javascript">

function ResetGridPosition() {

var grd = document.getElementById('RadGrid1');

var grd1 = $find("<%= RadGrid1.ClientID%>");

var master = grd1.get_masterTableView().get_element().parentNode;

master.scrollLeft = 0;

master.scrollTop = 0;

}

</script>

</telerik:RadCodeBlock>

<telerik:RadAjaxManager runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadButton1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid1" UpdatePanelCssClass="" />

</UpdatedControls>

</telerik:AjaxSetting>

<telerik:AjaxSetting AjaxControlID="RadGrid1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadGrid ID="RadGrid1" runat="server" GridLines="Both" AllowSorting="true" AllowPaging="true" PageSize="30" Width="900px">

<ClientSettings>

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

</ClientSettings>

</telerik:RadGrid>

<telerik:RadButton ID="RadButton1" runat="server" Text="Reset Grid Position" OnClientClicked="ResetGridPosition">

It seems this code really resets the scroll position, but after the postback the
grid scroll position returns to the previous position. [See Video]

How do I solve this?

Thanks,
Daniel.

Grid

answered on 05 Apr 2017

1 answer

203 views

Horizontally scrolling goes beyond count of columns

Hello,

I am using a Telerik RadSpreadsheet (Telerik.Web.Spreadsheet.dll v. 2016.3.1024.40) in our application. I am testing with Chrome v. 57.

The spreadsheet is configured with a ColumnCount of 29 (i.e., A through AC) and these are displaying correctly.

However:

It is possible to horizontally scroll past the end of the columns.
The horizontal scrollbar slider is not resized according to the ratio of visible columns versus total columns (e.g., like the vertical scrollbar slider).
Dragging the slider left or right scrolls quickly past the end of the columns and is therefore not usable. (Clicking the right and left buttons scrolls about 1 column at a time and is usable.)

I am using the following code to load and populate the spreadsheet server-side:

// set template spreadsheet
protected void Page_Init(object sender, EventArgs e)
{
// get provider instance
FTSpreadsheetDocumentProvider provider;
provider = new FTSpreadsheetDocumentProvider(Server.MapPath(SPREADSHEET_VIRTUAL_PATH), this);
RadSpreadsheet1.Provider = provider;
}

// bind template spreadsheet
protected void RadSpreadsheet1_DataBinding(object sender, EventArgs e)
{
RadSpreadsheet1.ColumnsCount = SPREADSHEET_COLUMNS_COUNT; // =29
RadSpreadsheet1.RowsCount = SPREADSHEET_ROWS_COUNT; // =21
}

// populate the data
protected void RadSpreadsheet1_DataBound(object sender, EventArgs e)
{
var sheet = RadSpreadsheet1.Sheets[0];
sheet.FrozenColumns = 2;
sheet.Rows[0].Cells[0].Value = ...

The attached screenshot shows the page with the horizontal slider about halfway across, which is well past the end of the columns (except for the 2 frozen columns). (PS It's not much better without the frozen columns.)

Can you please let me know how to get the horizontal scrollbar working correctly?

Thanks,
Severin B.

Spreadsheet

answered on 04 Apr 2017

4 answers

1.0K+ views

Excel Export, how to remove filter buttons etc...

I am working on adding some excel export functionality to all of the grids in my application. I have played around with numerous options but I can't seem to get the results I need.

I have grids that use calculated columns and aggregates. When using the ExportDataOnly = true and Format="ExcelML" the calculated columns and aggregates do not appear on the export. Also, any formatting applied to data is lost.

When I set ExportDataOnly = false and use HTML format the column names are linked inside of excel, the filter fields appear, and all hell breaks loose when you have a detail table.

I've tried using the GridExporting event like this:

                            protected void RadGridSearch_GridExporting(object source, GridExportingArgs e)         
                    {         
                        RadGridSearch.AllowSorting = false;         
                        RadGridSearch.AllowFilteringByColumn = false;         
                    }         

It does not seem to change the export behavior.

I need to be able to do one of 2 things, either have my aggregated data and calculated columns show up on data only exports, or be able to trim out all the extra garbage when using HTML format.

Any suggestions?

Grid

answered on 04 Apr 2017

1 answer

158 views

Font size on AsyncUpload

Hi,

I want to increase the font size of the text "Select a document to upload". How do i change it? Having the size in CSSClass does not work. Any other way?

I also the following in CSS which did not help

RadUpload .ruBrowse

{

font-size:30px !important;

font-style:italic;

}

.wizInternalLabels

{

color:#00008B;

font-size:x-large;

}

<telerik:RadAsyncUpload runat="server" ID="RadAsyncUpload1" AllowedFileExtensions="pdf,jpg,jpeg,txt"

MultipleFileSelection="Automatic" CssClass="wizInternalLabels" dir="rtl"

PostbackTriggers="btnCustomFinish">

<Localization Select=" Select a document to upload " />

</telerik:RadAsyncUpload>

Thanks in Advance

AsyncUpload

answered on 04 Apr 2017

4 answers

476 views

RadHtmlChart Height Issue

Hi i am using 2015.1.401.40 version.

and i am trying to show product summary chart but the height 100% is not working(please see attached screen shot).

And how do i set Totals/Counts always show on the bottom(if user scrolls then only products section move)

here is my code

<telerik:RadHtmlChart runat="server" ID="RadHtmlChart1" Width="100%" Height="100%"

Skin="Bootstrap">

<ChartTitle Text="Product Summary">

</ChartTitle>

<PlotArea>

<Series>

<telerik:BarSeries Name="Total" DataFieldY="Total">

<TooltipsAppearance>

<ClientTemplate>

#=dataItem.Productname# Total Counts: <b>#=dataItem.Total#</b>

</ClientTemplate>

</TooltipsAppearance>

<LabelsAppearance Visible="false">

</LabelsAppearance>

</telerik:BarSeries>

</Series>

<XAxis DataLabelsField="productname">

<MinorGridLines Visible="false"></MinorGridLines>

<MajorGridLines Visible="false"></MajorGridLines>

</XAxis>

<YAxis>

<LabelsAppearance DataFormatString="{0}" Mirror="true">

</LabelsAppearance>

<MinorGridLines Visible="false"></MinorGridLines>

</YAxis>

</PlotArea>

<Legend>

<Appearance Visible="false">

</Appearance>

</Legend>

</telerik:RadHtmlChart>

Chart (HTML5)

answered on 04 Apr 2017

18 answers

676 views

Could not export to Pdf

Hi everyone,

I've been using Telerik released in Q1 2015. I tried the simplest export to pdf code as follow but it doesn't work once I used Client Export Manager.

My code is just like this:

<div id="foo">Just for testing</div>
<telerik:RadClientExportManager runat="server" ID="RadClientExportManager1">
<PdfSettings FileName="Myfile.pdf" />
</telerik:RadClientExportManager>
<input type="button" onclick="exportPdf()" value="export" />
<script type="text/javascript">
function exportPdf() {
var exp = $find("<%= RadClientExportManager1.ClientID %>");
exp.exportPDF($telerik.$("#foo"));
}
</script>

When button was clicked, no error had been found but no pdf file was generated. Have I missed anything? Appriciate your help!

ClientExportManager

answered on 04 Apr 2017

0 answers

354 views

Invalid JSON Primitive Error

A client of ours runs a security scanner daily on a website. One page on the site has the RadDatePicker control. When the scanner runs, it brings up t

Inner Exception Type: System.ArgumentException

Inner Exception

Invalid JSON primitive: ;WAITFOR DELAY '00:00:28'-- .

Inner Source:

System.Web.Extensions

Inner Stack Trace:

at System.Web.Script.Serialization.JavaScriptObjectDeserializer.BasicDeserialize(String input, Int32 depthLimit, JavaScriptSerializer serializer)

at System.Web.Script.Serialization.JavaScriptSerializer.Deserialize(JavaScriptSerializer serializer, String input, Type type, Int32 depthLimit)

at Telerik.Web.UI.RadDatePicker.System.Web.UI.IPostBackDataHandler.LoadPostData(String postDataKey, NameValueCollection postCollection)

at System.Web.UI.Page.ProcessPostData(NameValueCollection postData, Boolean fBeforeLoad)

at System.Web.UI.Page.ProcessRequestMain(Boolean includeStagesBeforeAsyncPoint, Boolean includeStagesAfterAsyncPoint)

I looked at the scanner form input data and found this:

ContentPlaceHolder1_applicationManager1_sessionsearchresults1_Criteria1_radTo_ClientState: 1';WAITFOR DELAY '00:00:28'--

I know this value is not valid JSON, but I'm unsure how to proceed. I tried to reproduce this problem on the form itself but have been unable to. Has anyone experienced this problem?

http://www.nexttraining.net/default.aspx?url=Sessions/SearchResults&domains=30&software=®ions=&country=&levels=&dm=&ig=&sortfield=EA&page=1&pagesize=10&fromdate=4%2f1%2f2017+3%3a37%3a43+PM&todate=12%2f31%2f2099+12%3a00%3a00+AM&sessions=False&keywords=&keywordmode=None&type=