Questions on UI for ASP.NET AJAX Forum

1 answer

216 views

Hi,

I am trying to replace Ajax ActionLink with image instead of text but not getting done, my code is as below, can any one help?

@Ajax.ActionLink("Add ", "LogsGetData", "Logs", new { Id = 0 },
new AjaxOptions
{
UpdateTargetId = "LogEntryDiv",
InsertionMode = InsertionMode.Replace,
HttpMethod = "GET",
OnSuccess = "SettingsOnSuccess"
}).ToHtmlString().Replace("Add", "<img src=\"Content/Telerik/Office2007/sprite.png\" ... />")

Above code replace the text "Add" with <a data-ajax="true" data-ajax-method="GET" data-ajax-mode="replace" data-ajax-success="SettingsOnSuccess" data-ajax-update="#LogEntryDiv" but doesn't get the image.

Ajax

answered on 22 Mar 2012

1 answer

134 views

Column borders invisible when there are empty cells in rad grid

I am showing my search results in a rad grid. Rad grid is inside a panel. Whenever there are empty cells, column lines are becoming invisible.
I used the below code in prerender event of the grid, still columns lines become invisible for empty cells.
This scenario happens sometimes on grid refresh.

protected void rgMyGrid_PreRender(object sender, EventArgs e)

{

try

{

foreach (GridDataItem item in rgMyGrid.MasterTableView.Items)

{

if (item is GridDataItem)

{

foreach (GridColumn col in rgMyGrid.Columns)

{

//Add space to the cell that has null or empty value

if (!col.ColumnType.Equals("GridTemplateColumn"))

{

if (string.IsNullOrEmpty(item[col.UniqueName].Text.Trim())

|| item[col.UniqueName].Text.Equals(" "))

{

item[col.UniqueName].Text = " ";

}

else

{

#region AllowSpaceInCols

switch (col.UniqueName)

{

case "lblColumn1":

Label lblColumn1= item.FindControl("lblColumn1") as Label;

if (lblColumn1.Text.Trim().Equals(String.Empty)

|| lblColumn1.Text.Trim().Equals(" "))

{

lblColumn1.Text = " ";

}

break;

case "Column2":

Label lblColumn2 = item.FindControl("lblColumn2") as Label;

if (lblColumn2 .Text.Trim().Equals(String.Empty)

|| lblColumn2 .Text.Trim().Equals(" "))

{

lblColumn2 .Text = " ";

}

break;

default:

break;

}

#endregion

}

catch (Exception ex)

{

}

Grid

answered on 22 Mar 2012

1 answer

102 views

Don´t hide message use of jQuery

Hi I have page where is usercontrol with message

<%@ Control Language="C#" AutoEventWireup="true" CodeBehind="Message.ascx.cs" Inherits="Elearning.Usecases.UserControl.Message" %>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3/jquery.min.js"></script>

<script type="text/javascript">

$(document).ready(function () {

setTimeout(function () {

$("#<%=MessageContainer.ClientID %>").fadeOut("slow", function () {

$("#<%=MessageContainer.ClientID %>").remove();

});

}, 2000);

$('.closeImage').click(function () {

$(this).parent().hide();

});

</script>

<div Class="Message">

<asp:Panel ID="MessageContainer" runat="server">

<asp:Image ID="CloseImage" CssClass="closeImage icon" Style="float: right;" runat="server" ImageUrl='<%# HermesControl.GetAppItemRelativeUrl(Elearning.ElearningCommon.Icons.Delete ) %>' />

<asp:Label ID="lblMessage" EnableViewState="false" runat="server" />

</asp:Panel>

</div

>

Main page 

<telerik:RadAjaxManagerProxy ID="AjaxManagerProxy1" runat="server">
        <telerik:AjaxSetting AjaxControlID="imgbtnShowMessagetnSave">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="message1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
        <telerik:AjaxSetting AjaxControlID="message1">
            <UpdatedControls>
                <telerik:AjaxUpdatedControl ControlID="message1" LoadingPanelID="RadAjaxLoadingPanel1" />
            </UpdatedControls>
        </telerik:AjaxSetting>
    </AjaxSettings>
</telerik:RadAjaxManagerProxy>
<include:message ID="message1" runat="server" />
<asp:Button runat="server" ID="btnShowMessage"/>



And if a call show messages, then message show but don´t hide after two second. 

Please you know why?



Thanks and sorry for my english

Ajax

answered on 22 Mar 2012

1 answer

189 views

how to scroll <tbody> only in radgrid?

hi,

I have many records in my rad grid and its being contained in fixed height <div style="max-height: 350px; overflow-y:scroll">
what happens now is that the div is scrolling vertically, but in this scenario when the user is scrolling, so he would lose the the name of columns (header of each column) and the footer as well

as rad grid is rendered as html table, how can I keep <thead> and <tfoot> and make the scroll only in <tbody> ?

here is my rad grid:
[note that I am loading datasource of my grid in client side]

<telerik:RadGrid ID="gvViolation" EnableViewState="false" runat="server"

AllowPaging="true" AllowSorting="True" AllowFilteringByColumn="false" GridLines="None" Skin="Sunset" Width="735px" PageSize="3">

<ExportSettings OpenInNewWindow="true" >

<Pdf Author="WheelTrack" Creator="WheelTrack" />

</ExportSettings>

<MasterTableView AllowMultiColumnSorting="true" TableLayout="Fixed" >

<RowIndicatorColumn FilterControlAltText="Filter RowIndicator column"></RowIndicatorColumn>

<ExpandCollapseColumn FilterControlAltText="Filter ExpandColumn column"></ExpandCollapseColumn>

<PagerStyle Mode="NextPrevAndNumeric" />

<CommandItemSettings ShowExportToWordButton="true" ShowExportToExcelButton="true" ShowExportToPdfButton="true" ShowAddNewRecordButton="false" ShowExportToCsvButton="true" />

<Columns>

<telerik:GridBoundColumn DataField="Device_Name" HeaderText="Device Name" />

<telerik:GridBoundColumn DataField="Device_Desc" HeaderText="Device Desc" />

<telerik:GridBoundColumn DataField="Rule_Name" HeaderText="Rule Name" />

<telerik:GridBoundColumn DataField="ViolationText" HeaderText="Violation" />

<telerik:GridBoundColumn DataField="Latitude" HeaderText="Latitude" />

<telerik:GridBoundColumn DataField="Longtitude" HeaderText="Longtitude" />

<telerik:GridBoundColumn DataField="UTC_Date" HeaderText="Violation Date" />

<telerik:GridBoundColumn DataField="UTC_Time" HeaderText="Violation Time" />

<telerik:GridBoundColumn DataField="Location_NearBy" HeaderText="Location NearBy" />

</Columns>

</MasterTableView>

<FilterMenu EnableImageSprites="False"></FilterMenu>

<HeaderContextMenu CssClass="GridContextMenu GridContextMenu_Sunset"></HeaderContextMenu>

<PagerStyle AlwaysVisible="true" Mode="NumericPages"/>

<ClientSettings>

<ClientEvents OnCommand="gvViolation_Command" />

</ClientSettings>

</telerik:RadGrid>

Grid

answered on 22 Mar 2012

1 answer

162 views

RadToolBarDropDown DropDownWidth

How can I set a RadToolBarDropDown to have its dropdownwidth expand as needed so that it's child buttons don't get wrapped? The button text will vary so the dropdownwidth cannot be hard coded.

ToolBar

answered on 22 Mar 2012

3 answers

124 views

Can not modify RadNumericTextBox style in RadGrid Footer

Dear Support:
i need to modify css of textbox in RadGrid footer template when page load.
I have tried many times, still can not work, i don't know why, pls help me! Thanks!

Code is below:

function Load(sender, args) {

sumInput = sender;

sender.get_styles().EnabledStyle[0] += "color:Red;";

sender.updateCssClass();

}

<telerik:RadGrid ID="grdPlans" runat="server" AutoGenerateColumns="false">

<MasterTableView EditMode="InPlace" ShowFooter="True" TableLayout="Fixed" DataKeyNames="ProjectId">

<Columns>

<telerik:GridBoundColumn DataField="ProjectId" HeaderText="Project Id">

<HeaderStyle Width="10%" />

</telerik:GridBoundColumn>

<telerik:GridTemplateColumn HeaderText="Jan" DataField="Jan" UniqueName="Jan">

<ItemTemplate>

<telerik:RadNumericTextBox ID="txbMonth1" runat="server" Text='<%#Bind("Jan") %>'

Width="50px" IncrementSettings-InterceptArrowKeys="true" IncrementSettings-InterceptMouseWheel="true"

NumberFormat-DecimalDigits="1" MinValue="0" MaxValue="150">

<ClientEvents OnBlur="Blur1" OnFocus="Focus1" />

</telerik:RadNumericTextBox>

</ItemTemplate>

<FooterTemplate>

<telerik:RadNumericTextBox ID="txbTotal1" runat="server" ReadOnly="true" NumberFormat-DecimalDigits="1"

Width="50px">

<ClientEvents OnLoad="Load" />

</telerik:RadNumericTextBox>

</FooterTemplate>

</telerik:GridTemplateColumn>

Grid

answered on 22 Mar 2012

3 answers

134 views

ajaxify different controls for radconfirm

Hi
I am just stuck with below scenario
Having an grid with delete template field and radconfirm when clicking on that template.and i used ajaxrequest to ajaxify the grid during OK click on radconfirm.it works fine.My problem is i need to use another confirmation on the same page.and during OK click i need to ajaxify another control not the previous gird.How it is possible?

Ajax

answered on 22 Mar 2012

12 answers

623 views

RadScheduler Dynamic Width

Dear Telerik,

On the MonthView of RadScheduler, I would like for the calendar to expand to fill the entire width of the user's browser window. If I leave the Width property empty, it works perfectly in IE, but in Firefox, all of the columns are super skinny, to the point where it is basically unreadable.

Am I doing something wrong to have it work in IE but not in Firefox? Of course, my preference is for it to have the same behavior in Firefox.

If that's not possible or will not be possible soon, do you have any quick suggestions on how to somehow get the width of the browser window and pass it back to the server to then set the width of the RadScheduler? If the user resized the window, the RadScheduler would not resize until the next postback, but that's at least a step in the right direction.

Thanks,

Don

Scheduler

answered on 22 Mar 2012

3 answers

138 views

[Solved] Conversion from 3.5 to 4.0 framework

Hi:
I have a 'Web Site' (not WAP). I just went through the MS wizard for converting the site to 4.0. One page is having an issue. I am getting a message box from Microsoft Visual Studio saying: Invalid argument
In Visual Studio it has highlighted the following in Telerik.Web.Ui.WebResource... [dynamic]:

this._displayElement.style.borderRightWidth=parseInt($telerik.getComputedStyle(this._displayElement,"borderRightWidth",""))+parseInt($telerik.getComputedStyle(this._textBoxElement,"borderRightWidth",""))+"px";

Phil

Ajax

answered on 22 Mar 2012

3 answers

218 views

[Solved] Code for Yahoo Weather User Control/WebPart

Hi:
No question. Just sharing some code. This code is from a web-part that returns a 5 day weather forcast from Yahoo. So depending on what type of web project you are using 'Web-Site or WAP. I just suggest you use the MS create user control and then drop the following UI stuff in below the <@Control :

<%@ Register Assembly="Telerik.Web.UI" Namespace="Telerik.Web.UI" TagPrefix="telerik" %>

<style type="text/css">

.wthrTitle     { font-family: Tahoma; font-size: 14px; width: 370px; color: White; background: blue; border-top: 1px solid navy; text-align: center; }

.wthrContainer { width: 74px; text-align: center; border: 1px; float: left; }

.wthrDayTitle  { font-family: Tahoma; font-size: 14px; width: 100%; color: White; background: blue; border-bottom: 1px solid navy; border-top: 1px solid navy; }

.wthrForcast { font-family: Tahoma; font-size: 12px; color: blue; }

.wthrTemp { font-family: Tahoma; font-size: 10px; color: blue; }

.wthrClear { clear: left; }

</style>

<div class="wthrTitle"><asp:Label ID="descriptionLabel" runat="server" Text='' /></div>

<telerik:RadListView ID="weatherRadListView" runat="server">

<ItemTemplate>

<div class="wthrContainer">

<div class="wthrDayTitle"><asp:Label ID="dayLabel" runat="server" Text='<%# Eval("DayName") %>' /></div><br />

<asp:Image ID="forcastImage" runat="server" ImageUrl='<%# Eval("ImageUrl") %>' /><br />

<asp:Label ID="forcastLabel" runat="server" Text='<%# Eval("Forcast") %>' CssClass="wthrForcast" /><br />

<div class="wthrForcast"><asp:Label ID="highLabel" runat="server" Text='<%# Eval("High") %>' />° -

<asp:Label ID="lowLabel" runat="server" Text='<%# Eval("Low") %>' />°</div><br />

</div>

</ItemTemplate>

</telerik:RadListView>

<br class="wthrClear" />

<asp:HiddenField ID="zipcodeHidden" runat="server" Value="49333" />

I have supplied both C# and VB. Piece in the following code not trying to damage the code behind class name:

// By Phil Huhn 2012-01-08

using System;

using System.Collections.Generic;

using System.Linq;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

//

using System.Xml;

using System.Xml.Linq;

using System.Net;

//

namespace Telerik.UserControls

{

public partial class YahooWeather : System.Web.UI.UserControl

{

//

// ------------------------------------------------------------------------

// Properties

// ZipCode

//

#region "Properties"

//

/// <summary>

/// External way to pass values to user control

/// </summary>

/// <value></value>

/// <returns></returns>

/// <remarks></remarks>

public string ZipCode

{

get { return zipcodeHidden.Value; }

set { zipcodeHidden.Value = value; }

}

//

#endregion

//

/// <summary>

/// call during each postback

/// </summary>

/// <param name="sender"></param>

/// <param name="e"></param>

/// <remarks></remarks>

protected void Page_Load(object sender, EventArgs e)

{

GetWeather(ZipCode);

}

//

/// <summary>

/// Get weather from yahoo

/// </summary>

/// <param name="zipCode"></param>

/// <remarks></remarks>

protected void GetWeather(string zipCode)

{

try

{

XDocument xmlData = XDocument.Load("http://xml.weather.yahoo.com/forecastrss/" + zipCode + "_f.xml");

//

List<WeatherItem> _list = new List<WeatherItem>();

string _description = null;

System.DateTime _date;

//...<channel>

foreach (XElement _row in xmlData.Root.Elements("channel"))

{

foreach (XElement _field in _row.Elements())

{

//<title>Yahoo! Weather - Any Town</title>

//<link></link>

//<description>Yahoo! Weather for Any Town</description>

if ((_field.Name.ToString() == "description"))

{

// cherry pick the desired data at this level.

_description = _field.Value;

descriptionLabel.Text = _description;

}

//<language>en-us</language>

//<lastBuildDate>Sat, 07 Jan 2012 10:51 am EST</lastBuildDate>

if ((_field.Name.ToString() == "lastBuildDate"))

{

string _dateString = _field.Value.Substring(5);

_date = DateTime.Parse(_dateString.Substring(0, _dateString.Length - 4));

descriptionLabel.Text = _description + " at " + _date.ToShortTimeString();

}

//<ttl>60</ttl>

//<yweather:location city="Any Town" region="MI" country="US"/>

//<yweather:units temperature="F" distance="mi" pressure="in" speed="mph"/>

//<yweather:wind chill="35" direction="310" speed="14"/>

//<yweather:atmosphere humidity="65" visibility="10" pressure="29.89" rising="1"/>

//<yweather:astronomy sunrise="8:02 am" sunset="5:17 pm"/>

//<image>

//<item>

if (_field.Name.ToString() == "item")

{

foreach (XElement _itm in _field.Elements())

{

if (_itm.Name.LocalName == "forecast")

{

WeatherItem _wi = new WeatherItem();

_wi.YahooForcast(_itm);

_list.Add(_wi);

}

if (_list.Count > 0)

{

_list[0].DayName = "Today";

}

weatherRadListView.DataSource = _list;

weatherRadListView.DataBind();

}

catch (Exception e)

{

int _i = 1;

}

//

}

public class WeatherItem

{

public string DayName { get; set; }

public System.DateTime Day { get; set; }

public int Low { get; set; }

public int High { get; set; }

public string Forcast { get; set; }

public string Code { get; set; }

public string ImageUrl { get; set; }

public string LocalImageUrl { get; set; }

protected string LocalImagePath = "../Images/Weather/";

//

public WeatherItem()

{

}

//

public WeatherItem(string localImagePath)

{

LocalImagePath = localImagePath;

}

//

// <yweather:forecast day="Sun" date="8 Jan 2012"

// low="28" high="37" text="Partly Cloudy" code="30"/>

//

public void YahooForcast(XElement forcastItem)

{

DayName = forcastItem.Attribute("day").Value;

Day = Convert.ToDateTime(forcastItem.Attribute("date").Value);

Low = Convert.ToInt32(forcastItem.Attribute("low").Value);

High = Convert.ToInt32(forcastItem.Attribute("high").Value);

Forcast = forcastItem.Attribute("text").Value;

Code = forcastItem.Attribute("code").Value;

ImageUrl = "http://l.yimg.com/a/i/us/we/52/" + Code + ".gif";

LocalImageUrl = LocalImagePath + Code + ".gif";

}

And here is the same code in vb.net:

' By Phil Huhn 2012-01-08

Option Strict On

Option Explicit On

'

Imports System.Xml

Imports System.Net

'

Public Class YahooWeather

Inherits System.Web.UI.UserControl

'

' ------------------------------------------------------------------------

' Properties

' ZipCode

'

#Region "Properties"

'

''' <summary>

''' External way to pass values to user control

''' </summary>

''' <value></value>

''' <returns></returns>

''' <remarks></remarks>

Public Property ZipCode() As String

Get

Return zipcodeHidden.Value

End Get

Set(ByVal value As String)

zipcodeHidden.Value = value

End Set

End Property

'

#End Region

'

''' <summary>

''' call during each postback

''' </summary>

''' <param name="sender"></param>

''' <param name="e"></param>

''' <remarks></remarks>

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

GetWeather(ZipCode)

End Sub

'

''' <summary>

''' Get weather from yahoo

''' </summary>

''' <param name="zipCode"></param>

''' <remarks></remarks>

Protected Sub GetWeather(zipCode As String)

Try

Dim xmlData As Linq.XDocument = _

XDocument.Load("http://xml.weather.yahoo.com/forecastrss/" & zipCode & "_f.xml")

'

Dim _list As New List(Of WeatherItem)

Dim _description As String = Nothing

Dim _date As Date = Nothing

For Each _row As XElement In xmlData.Root.Elements("channel") '...<channel>

For Each _field As XElement In _row.Elements

'<title>Yahoo! Weather - Any Town</title>

'<link></link>

'<description>Yahoo! Weather for Any Town</description>

If (_field.Name.ToString() = "description") Then

' cherry pick the desired data at this level.

_description = _field.Value

descriptionLabel.Text = _description

End If

'<language>en-us</language>

'<lastBuildDate>Sat, 07 Jan 2012 10:51 am EST</lastBuildDate>

If (_field.Name.ToString() = "lastBuildDate") Then

Dim _dateString As String = _field.Value.Substring(5)

_date = DateTime.Parse(_dateString.Substring(0, _dateString.Length - 4))

descriptionLabel.Text = _description & " at " & _date.ToShortTimeString

End If

'<ttl>60</ttl>

'<yweather:location city="Any Town" region="MI" country="US"/>

'<yweather:units temperature="F" distance="mi" pressure="in" speed="mph"/>

'<yweather:wind chill="35" direction="310" speed="14"/>

'<yweather:atmosphere humidity="65" visibility="10" pressure="29.89" rising="1"/>

'<yweather:astronomy sunrise="8:02 am" sunset="5:17 pm"/>

'<image>

'<item>

If _field.Name.ToString() = "item" Then

For Each _itm As XElement In _field.Elements

If _itm.Name.LocalName = "forecast" Then

Dim _wi As New WeatherItem()

_wi.YahooForcast(_itm)

_list.Add(_wi)

End If

Next

End If

Next

If _list.Count > 0 Then

_list(0).DayName = "Today"

End If

weatherRadListView.DataSource = _list

weatherRadListView.DataBind()

Catch e As Exception

Dim _i As Integer = 1

End Try

End Sub

'

End Class

Public Class WeatherItem

Public Property DayName() As String

Public Property Day() As Date

Public Property Low() As Integer

Public Property High() As Integer

Public Property Forcast() As String

Public Property Code() As String

Public Property ImageUrl() As String

Public Property LocalImageUrl() As String

Protected LocalImagePath As String = "../Images/Weather/"

'

Public Sub New()

End Sub

'

Public Sub New(localImagePath As String)

localImagePath = localImagePath

End Sub

'

' <yweather:forecast day="Sun" date="8 Jan 2012"

' low="28" high="37" text="Partly Cloudy" code="30"/>

'

Public Sub YahooForcast(forcastItem As XElement)

DayName = forcastItem.Attribute("day").Value

Day = CDate(forcastItem.Attribute("date").Value)

Low = CInt(forcastItem.Attribute("low").Value)

High = CInt(forcastItem.Attribute("high").Value)

Forcast = forcastItem.Attribute("text").Value

Code = forcastItem.Attribute("code").Value

ImageUrl = "http://l.yimg.com/a/i/us/we/52/" & Code & ".gif"

LocalImageUrl = LocalImagePath & Code & ".gif"

End Sub

End Class

You can drag the control onto your regular form:

<%@ Register src="UserControls/YahooWeather.ascx" tagname="YahooWeather" tagprefix="uc1" %>
...
<telerik:RadScriptManager ID="RadScriptManager1" runat="server">
</telerik:RadScriptManager>
<uc1:YahooWeather ID="YahooWeather1" runat="server" ZipCode="48103" />

You can set the us zip code via a property...

Have fun:
Phil

ListView

answered on 22 Mar 2012