Questions on UI for ASP.NET AJAX Forum

2 answers

139 views

Hello,

I am using the grid in card view and have data loading in the item template. I also have two link buttons in the template. Everything loads fine and pages OK. However I am trying to get to the click event of the link buttons so that when the user clicks on one of the link buttons I get a hidden field value which I use as a querystring parameter to take the user to a more detailed page.

I got it working on the first page but when I try to go to the next page in the grid. I get an error.

I am created a command name for the link butotns and have them in the grids Item_Command event. I am not sure if I am going about this the right way.

What am I doing wrong here?

<div style="margin-left: auto; margin-right: auto; margin-top: 50px; width: 800px">

<telerik:RadGrid ID="RadGrid1" ShowGroupPanel="True" DataSourceID="SqlDataSource1"

AllowPaging="True" runat="server" Width="800px" Height="800px" GridLines="None"

PageSize="5" ShowHeader="false" BackColor="AliceBlue" BorderColor="Red" EnableEmbeddedSkins="true"

Skin="Sitefinity">

<HeaderContextMenu>

</HeaderContextMenu>

<MasterTableView TableLayout="Fixed">

<ItemTemplate>

<div style="float: left; margin-left: 10px; margin-top: 15px; width: 750px">

<div style="float: left; margin-bottom: 5px; font-size: 1.0em; font-weight: bold;

width: 700px">

<asp:LinkButton ID="lnkTitle" runat="server" ForeColor="Blue" CommandName="Title"

Font-Size="1.4em" Text='<%# Eval("Title")%>'>

</asp:LinkButton>

<asp:HiddenField ID="hdfId" runat="server" Value='<%# Eval("Id") %>' />

</div>

<br />

<div style="float: left; width: 98%; color: Green">

<%# Eval("City")%>,

<%# Eval("State")%>. - Posted:

<%# Eval("PostedDate")%></div>

<br />

<div style="float: left">

<%# Eval("Column1")%>

<div>

<asp:LinkButton ID="lnkMoreInfo" runat="server" CommandName="MoreInfo" ForeColor="Blue"

Text="more info..."></asp:LinkButton>

</div>

</ItemTemplate>

<RowIndicatorColumn FilterControlAltText="Filter RowIndicator column">

</RowIndicatorColumn>

<EditFormSettings>

</EditFormSettings>

<AlternatingItemStyle BackColor="White" />

<PagerStyle Mode="NextPrev" />

</MasterTableView>

<HeaderStyle Font-Bold="False" Font-Italic="False" Font-Overline="False" Font-Strikeout="False"

Font-Underline="False" Wrap="True" />

<ClientSettings AllowDragToGroup="false">

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

</ClientSettings>

<FilterMenu EnableImageSprites="False">

</FilterMenu>

</telerik:RadGrid>

<br />

<asp:Label ID="lblMsg" runat="server" ForeColor="Red" />

<asp:SqlDataSource ID="SqlDataSource1" ConnectionString="<%$ ConnectionStrings:myConnectionString %>"

SelectCommand="jobs_GridDataDisplay_Select" runat="server" SelectCommandType="StoredProcedure">

</asp:SqlDataSource>

protected void RadGrid1_ItemCommand(object sender, Telerik.Web.UI.GridCommandEventArgs e)

{

//Find required controls in the grid.

//Job Id.

HiddenField hdfJobId = e.Item.FindControl("hdfId") as HiddenField;

//Job title link button.

LinkButton lnkTitle = e.Item.FindControl("lnkTitle") as LinkButton;

//More info link button.

LinkButton lnkMoreInfo = e.Item.FindControl("lnkMoreInfo") as LinkButton;

if (lnkTitle.CommandName == "Title")

{

//Redirect to job details page.

RedirectToJobDetails(hdfId.Value.ToString());

}

if (lnkMoreInfo.CommandName == "MoreInfo")

{

//Redirect to job details page.

RedirectToJobDetails(hdfJobId.Value.ToString());

}

private void RedirectToDetailsPage(string Id)

{

//Redirection path.

string url = "~/pages/content/details.aspx?";

//Create the querystring parameter and encrypt.

url += "id=" + Server.UrlEncode(DataEncryption.QueryStringEncrypt(Id));

Response.Redirect(url);

}

Grid

answered on 09 Jun 2011

1 answer

78 views

Detecting dynamic user controls in multipage

Hi,

I have a radstrip and radmultipage on a aspx page with a master page. I also have a "save & Continue" button on the same page. I load my tabs as well as associated ascx control to the Multipage at runtime.

On "save & Continue" , i need to save the values in the ascx page to the database and move on to the next tab. However, i cannot detect the ascx control, as the save button is not inside the ascx but in the main page.

How can i detect the Usercontrol inside the pageview and call the save() method defined in the user control at runtime at the same time persisting the values in the usercontrols ?

<

telerik:RadTabStrip ID="m_applyRadTabStrip" runat="server" Orientation="VerticalLeft"

Expanded="True" MultiPageID="m_applyRadMultiPage" OnTabClick="applyRadTabStrip_TabClick">

</telerik:RadTabStrip>

<

telerik:RadMultiPage ID="m_applyRadMultiPage" runat="server" SelectedIndex="0" CssClass="multiPage" OnPageViewCreated="radMultiPage_PageViewCreated">

</telerik:RadMultiPage>

<

asp:Button ID="m_buttonSaveContinue" runat="server" OnClick="saveContinue_Click" CssClass="button" />

TabStrip

answered on 09 Jun 2011

1 answer

47 views

How to avoid the default insert form to appear

Hi ,

I had a grid which is coded using the following Example.But when I click the Add new record button the Insert form which i designed is appearing and once when I click Insert the Insert operation is successful and the default insert form is being displayed.

http://demos.telerik.com/aspnet-ajax/ajax/examples/manager/dynamicajaxsettings/defaultcs.aspx?product=grid

I am not getting any idea y the default Insert form is being displayed.
Please help me.

Thanks,
In Advance

Sravanthi

Grid

answered on 09 Jun 2011

1 answer

152 views

Display arrow if Menu Item has sub items

My rad menu has various sub level and i want to display a arrow if the menu item has a sub menu item. I have edited the CSS but so far i am not being able to display the arrow . Please advise

.RadMenu_White .rmRootGroup,

.RadMenu_White .rmLink,

.RadMenu_White .rmText,

.RadMenu_White .rmLeftArrow,

.RadMenu_White .rmRightArrow,

.RadMenu_White .rmTopArrow

.RadMenu_White rmVertical rmRootGroup, .RadMenu_White rmHorizontalRootGroup

{}

.submenus

{

padding: 5px 30px 1px 15px;

color: white;

}

.RadMenu_White .rmBottomArrow

{

background-image: url('Menu/rmSprite.png');

background-color: transparent;

}

.RadMenu_White .rmRootGroup

{

border: 0px solid #828282;

background-repeat: repeat-x;

background-position: 0 -408px;

background-color: Transparent;}

/* <Root items> */

.RadMenu_White

{

font: normal 14px/23px Arial, sans-serif;

color: black;

text-decoration: none;

padding-right:15px !important;

padding-bottom:6px !important;

}

.RadMenu_White .rmLink

{

font: normal 14px/23px Arial, sans-serif;

color: black;

text-decoration: none;

padding-right:15px !important;

padding-bottom:6px !important;

border: solid 1px #d1d1d1;

}

.RadMenu_White .rmLink,

.RadMenu_White .rmDisabled,

.RadMenu_White .rmDisabled:hover

{

background-position: 0 -72px;

}

.RadMenu_White .rmText,

.RadMenu_White .rmDisabled .rmText,

.RadMenu_White .rmFirst .rmLink,

.RadMenu_White .rmLast .rmText, rmText,

.RadMenu_White .rmLast .rmLink:hover .rmText,

.RadMenu_White .rmVertical .rmLink,

.RadMenu_White .rmVertical .rmText

{

background-repeat: no-repeat;

background-position: 0 500px;

cursor: pointer;

}

.RadMenu_White .rmFirst .rmLink:hover, .RadMenu_White .rmLink:hover, .rmItem:hover

{

cursor: pointer;

background-color: #12630a;

color: white;

}

.RadMenu_White .rmVertical .rmLink

{

}

.RadMenu_White .rmVertical .rmLink:hover,

.RadMenu_White .rmVertical .rmFocused,

.RadMenu_White .rmVertical .rmExpanded,

.RadMenu_White .rmVertical .rmExpanded:hover

{border-style: solid;

border-color: #131b4c;

border-width: 0px 0;

}

.RadMenu_White .rmVertical .rmFirst .rmLink:hover,

.RadMenu_White .rmVertical .rmFirst .rmFocused,

.RadMenu_White .rmVertical .rmFirst .rmExpanded,

.RadMenu_White .rmVertical .rmFirst .rmExpanded:hover

{border-top-width: 0;

}

.RadMenu_White .rmVertical .rmLast .rmLink:hover,

.RadMenu_White .rmVertical .rmLast .rmFocused,

.RadMenu_White .rmVertical .rmLast .rmExpanded,

.RadMenu_White .rmVertical .rmLast .rmExpanded:hover

{border-bottom-width: 0;

}

.RadMenu_White .rmVertical .rmItem .rmDisabled:hover

{border-width: 0;

}

.RadMenu_White .rmExpanded,

.RadMenu_White .rmExpanded:hover

{

background-color:#12630a;

background-position: 0 -72px;

}

.RadMenu_White .rmExpanded .rmText,

.RadMenu_White .rmExpanded:hover .rmText

{

background-position: 100% -96px;

}

.RadMenu_White .rmLast .rmExpanded .rmText

{

background-position: 0 500px;

background-repeat: no-repeat;

}

.RadMenu_White .rmDisabled,

.RadMenu_White .rmDisabled:hover

{

color: #7d7d7d;

background-color: transparent;

}

/* </Root items> */

/* <Submenu items> */

.RadMenu_White .rmGroup,

.RadMenu_White .rmGroup .rmVertical

{

border: 0px solid #131b4c;

/*background: transparent url('Menu/rmVSprite.png') repeat-y 0 0;*/

}

.RadMenu_White .rmSlide .rmScrollWrap

{

background-image: none;

background: transparent;

}

.RadMenu_White_rtl .rmGroup,

.RadMenu_White_rtl .rmGroup .rmVertical

{

background-position: 100% 0;

background: transparent;

}

.RadMenu_White .rmRootGroup li.rmItem .rmGroup

{}

.RadMenu_White .rmRootGroup .rmHorizontal

{

background-image: none;}

.RadMenu_White .rmScrollWrap .rmVertical

{border: 0;

}

.RadMenu_White .rmGroup .rmItem .rmLink,

.RadMenu_White .rmGroup .rmItem .rmLink:hover,

.RadMenu_White .rmGroup .rmItem .rmFocused,

.RadMenu_White .rmGroup .rmItem .rmExpanded

{border: 0;

}

.RadMenu_White .rmGroup .rmLast .rmLink,

.RadMenu_White .rmGroup .rmLast .rmLink:hover,

.RadMenu_White .rmGroup .rmLast .rmFocused,

.RadMenu_White .rmGroup .rmLast .rmExpanded

{}

.RadMenu_White .rmGroup .rmLink,

.RadMenu_White .rmGroup .rmText,

.RadMenu_White .rmGroup .rmItem .rmDisabled,

.RadMenu_White .rmGroup .rmItem .rmDisabled:hover,

.RadMenu_White .rmGroup .rmItem .rmDisabled .rmText,

.RadMenu_White .rmGroup .rmItem .rmDisabled:hover .rmText

{

background-position: 0 500px;

background-repeat: no-repeat;

/* background-color: transparent;*/

}

.RadMenu_White .rmGroup .rmLink:hover,

.RadMenu_White .rmGroup .rmFocused,

.RadMenu_White .rmGroup .rmExpanded

{

background-position: 0 -168px;

}

.RadMenu_White .rmGroup .rmLink:hover .rmText,

.RadMenu_White .rmGroup .rmFocused .rmText,

.RadMenu_White .rmGroup .rmExpanded .rmText

{

background-position: 100% -192px;

}

/* <expand arrows> */

.RadMenu_White .rmGroup .rmExpandRight,

.RadMenu_White .rmGroup .rmExpandDown,

.RadMenu_White .rmGroup .rmItem .rmDisabled .rmExpandRight,

.RadMenu_White .rmGroup .rmItem .rmDisabled .rmExpandDown,

.RadMenu_White .rmGroup .rmItem .rmDisabled:hover .rmExpandRight,

.RadMenu_White .rmGroup .rmItem .rmDisabled:hover .rmExpandDown

{

background-position: 100% -216px;

}

.RadMenu_White .rmGroup .rmLink:hover .rmExpandRight

{

background-image: url(images/arrow.png) no-repeat topright !important;

}

.RadMenu_White .rmGroup .rmLink:hover .rmExpandRight,

.RadMenu_White .rmGroup .rmFocused .rmExpandRight,

.RadMenu_White .rmGroup .rmExpanded .rmExpandRight,

.RadMenu_White .rmGroup .rmLink:hover .rmExpandDown,

.RadMenu_White .rmGroup .rmFocused .rmExpandDown,

.RadMenu_White .rmGroup .rmExpanded .rmExpandDown

{

background-position: 100% -240px;

}

.RadMenu_White .rmGroup .rmDisabled:hover .rmExpandRight,

.RadMenu_White .rmGroup .rmDisabled:hover .rmExpandDown

{

background-image: url('Menu/rmSprite.png');

background-position: 100% -216px;

}

/* </expand arrows> */

/* <rtl> */

.RadMenu_White_rtl .rmLink

{

background-position: 100% -96px;

}

.RadMenu_White_rtl .rmText

{

background-position: 0 -72px;

}

.RadMenu_White_rtl .rmVertical .rmExpanded .rmText,

.RadMenu_White_rtl .rmVertical .rmExpanded:hover .rmText

{

background-position: 0 500px;

background-repeat: no-repeat;

}

.RadMenu_White_rtl .rmGroup .rmLink:hover,

.RadMenu_White_rtl .rmGroup .rmFocused,

.RadMenu_White_rtl .rmGroup .rmExpanded

{

background-position: 100% -264px;

}

.RadMenu_White_rtl .rmGroup .rmLink:hover .rmText,

.RadMenu_White_rtl .rmGroup .rmFocused .rmText,

.RadMenu_White_rtl .rmGroup .rmExpanded .rmText

{

background-position: 0 -288px;

}

.RadMenu_White_rtl .rmGroup .rmExpandLeft

{

background-position: 0 -312px;

}

.RadMenu_White_rtl .rmGroup .rmLink:hover .rmExpandLeft,

.RadMenu_White_rtl .rmGroup .rmFocused .rmExpandLeft,

.RadMenu_White_rtl .rmGroup .rmExpanded .rmExpandLeft

{

background-position: 0 -336px;

}

/* </rtl> */

/* </Submenu items> */

/* <Submenu offsets (Telerik - specific, overlapping submenus)> */

.RadMenu_White .rmSlide

{

border-style:solid;

border-color:#58b749;

background:#58b749;

border-width:0px;

/*margin: 15px 5px 5px 15px;*/

color:White;

}

.RadMenu_White .rmVertical .rmSlide,

.RadMenu_White .rmSlide .rmSlide,

.RadMenu_White_Context .rmGroup .rmSlide

{

/*margin: 0 0 0 -0x;*/

}

.RadMenu_White_rtl .rmSlide

{

/*margin: 0 0 0 0;*/

}

.RadMenu_White_rtl .rmFirst .rmSlide

{

/*margin-left: 0px;*/

}

.RadMenu_White_rtl .rmVertical .rmSlide,

.RadMenu_White_rtl .rmSlide .rmSlide,

.RadMenu_White_Context_rtl .rmGroup .rmSlide

{

/*margin: 0px 0px 0px 0px;*/

}

/* </Submenu offsets> */

/* <Scrolling arrows> */

.RadMenu_White .rmLeftArrow,

.RadMenu_White .rmRightArrow

{

background-color: #E6E6E6;

}

.RadMenu_White .rmLeftArrow { background-position: -8px -312px; border-right: 1px solid #828282; }

.RadMenu_White .rmRightArrow { background-position: -482px -216px; border-left: 1px solid #828282; }

.RadMenu_White .rmTopArrow,

.RadMenu_White .rmBottomArrow,

.RadMenu_White .rmGroup .rmLeftArrow,

.RadMenu_White .rmGroup .rmRightArrow

{

background-color: #E6E6E6;

}

.RadMenu_White .rmTopArrow { background-position: 50% -367px; border-bottom: 0px solid #828282; }

.RadMenu_White .rmBottomArrow { background-position: 50% -391px; border-top: 0px solid #828282; }

/* </Scrolling arrows> */

/* <Separators> */

.RadMenu_White .rmHorizontal .rmSeparator .rmText,

.RadMenu_White .rmVertical .rmHorizontal .rmSeparator .rmText

{

height: 22px;width: 0px;

background-color: #A8A8A8;

}

.RadMenu_White_Context .rmSeparator .rmText,

.RadMenu_White .rmHorizontal .rmGroup .rmSeparator .rmText,

.RadMenu_White .rmVertical .rmHorizontal .rmGroup .rmSeparator .rmText

{

background-color: transparent;

background-position: 0 -406px;}

.RadMenu_White .rmLeftImage, RadMenu RadMenu_White, rmItem rmFirst, rmHorizontal rmRootGroup, rmLink  rmExpanded, .rmLeftImage, .rmLink, .rmText rmExpandDown, .RadMenu .rmLink .rmText

{

margin:0px 0px 0px 0px !Important;

padding: 0px 0px 0px 0px !Important;

float: none;

}

.RadMenu_White .rmItem

{

background:transparent !important;

}

/* </Separators> */

/* </RadMenu / Telerik> */

Menu

answered on 09 Jun 2011

1 answer

68 views

prevent using down and up arrow if combo box text is less than two characters

I am binding a list of names to a combo box, and trying to limit the number of names visible to the user. I have used filter="contains" to narrow the list. I have also written a onkeyup handlers to only show names after at lease two characters are typed. My problem is that if you use the up or down arrow key, it will still show the entire list. I have attempted to write an onkeydown handler and check for e.keycode 38 and 40, but it's still not working correct. my code follows:

function OnClientDropDownOpening(Sender, args) {

//only open if there is moer than 1 characters

if (!open)

args.set_cancel(true);

}

function pageLoad() {

// set up onkeyup and onkey down event

var combo = $find("<%=cboSLPName.ClientID %>");

var input = combo.get_inputDomElement();

input.onkeyup = onKeyUpHandler;

input.onkeydown = onKeyDownHandler;

}

function onKeyDownHandler(e) {

if (!e)

e = window.event;

var combo = $find("<%=cboSLPName.ClientID %>");

var comboText = String(combo.get_text());

if (comboText.length < 2) {

//////////////////////////////

//

// don't do anything if the length is less than two and you press up arrow and down arrow

//

if (e.keyCode == 38 || e.keyCode == 40) {

e.returnValue = false;

if (e.preventDefault) {

e.preventDefault();

}

return false;

}

function onKeyUpHandler(e) {

var combo = $find("<%=cboSLPName.ClientID %>");

var comboText = combo.get_text();

if (comboText.length < 2) {

open = false;

combo.hideDropDown();

}

else {

open = true;

combo.showDropDown();

}

and my server control:

<telerik:RadComboBox runat="server" ID="cboSLPName" Width="250px"

EmptyMessage="Type Name" MarkFirstMatch="true" Filter="Contains" ExpandAnimation-Type="None"

ShowMoreResultsBox="false" ShowWhileLoading="false"

AllowCustomText="true"

ShowToggleImage="false" EnableItemCaching="true" LoadingMessage="Loading..."

HighlightTemplatedItems="true" EnableLoadOnDemand="true" ShowDropDownOnTextboxClick="false"

OnClientDropDownOpening="OnClientDropDownOpening"

onselectedindexchanged="cboSLPName_SelectedIndexChanged"

AutoPostBack="true" />

any suggestions you can give to help would be appreciated. Thanks!

I know my code isn't pretty, so any suggestions you have for a more elegant design is also appreciated!!

ComboBox

answered on 09 Jun 2011

1 answer

217 views

Error: Unable to get value of the property 'GetWindowByName': object is null or undefined

Hi All,

Here is the scenerio - I have a project in VS2010, on one of the pages I open the RAD Window using the following method (which works as expected):

Dim strScript As String = "<script language='javascript' type='text/javascript'>Sys.Application.add_load(ShowWindow);</script>"

Page.ClientScript.RegisterStartupScript(Me.GetType, "ShowWindow", strScript)

<script type="text/javascript">

function ShowWindow() {

var manager = GetRadWindowManager();

var window1 = manager.GetWindowByName("QuoteWindow");

window1.show();

}

</script>

As mentioned the above code works perfect - the problem is I simply copied this code across to another project which is identical to the first one and everytime I hit the button to open the RAD Window I get this error:

'Error: Unable to get value of the property 'GetWindowByName': object is null or undefined'

I have searched and searched the forums to no avail - please provide any help asap if possible as this is pretty urgent.

Thanks in advance.

Window

answered on 09 Jun 2011

16 answers

362 views

RadMenu Float Image Right Not Working

We are using the WebBrowser control that ships with Visual Studio and have modified the CSS style with the following to get the image to appear to the right of our menu item:

.rmLeftImage

{

float: right !important;
}

This causes the menu items to stretch the width of the menu and wrap the remaining menu items below each other?
These RadMenuItems have nested RadMenuItems (for a flyout menu) but not sure if that is the culprit?
Any ideas?

Menu

answered on 09 Jun 2011

1 answer

93 views

Rad Windows reloads after Timer-Tick

Hello,
We have a RadGrid that updates data every 30 seconds with a timer object. You can select a radgrid row and then click a button from a radgrid toolbox. Then a radwindows appears associated with the selected row. The problem faces when the timer refreshes (Timer-tick). This timer refreshing makes that the rad windows also make a reload of the object (RadWindow). We tried unsucessfully to prevent the reloading of the rad window using the ajaxmanager.

Is there any option for not to reload the radwindow?.
Is there any option but not to stopping the timer?.

Kind regards.

Window

answered on 09 Jun 2011

2 answers

47 views

How to create a RadGrid with TemplateColumns programmatically?

How to create a RadGrid with TemplateColumns programmatically?

Thanks,

Grid

answered on 09 Jun 2011

1 answer

75 views

FileExporer: callback error and nothing in grid

Hi,

I'm having a hard time trying to use the RadFileExplorer. I have just put it in some aspx page and set the "ViewPath" to "~\\App_Themes". The component loads fine, I can see the directories on the left, but no files on the right... Moreover, sometimes I get some callback error when clicking on directories, saying that there is some "invalid escape sequence" (error is in french).

Do you have any idea?

Thanks,
FB

FileExplorer

answered on 09 Jun 2011