Questions on UI for ASP.NET AJAX Forum

4 answers

567 views

Button inside Template Column, can't fire event handler

<telerik:RadGrid ID = "RadGrid1" AutoGenerateColumns = "false" runat = "server" AllowPaging="True"

Width="97%" GridLines="None" Skin="WebBlue"

onneeddatasource="RadGrid1_NeedDataSource"

onitemcommand="RadGrid1_ItemCommand"

onprerender="RadGrid1_PreRender" >

<%--onitemcreated="RadGrid1_ItemCreated"

onselectedindexchanged="RadGrid1_SelectedIndexChanged">--%>

<ClientSettings EnableRowHoverStyle="false" EnablePostBackOnRowClick = "true">

<Selecting AllowRowSelect="true" />

</ClientSettings>

<MasterTableView ShowHeader="false">

<Columns>

<telerik:GridTemplateColumn UniqueName="TemplateColumn">

<ItemTemplate>

<table>

<tr>

<%# Eval("CategoryName") %>

</tr>

<tr>

<td>

<telerik:RadButton ID="Button1" runat="server" ButtonType="LinkButton" Text="Button1"

CommandName="Button1Click" OnClick="Button1_Click" />

</td>

<td>

<telerik:RadButton ID="Button2" runat="server" ButtonType="LinkButton" Text="Button2"

CommandName="Button2Click" OnClick="Button2_Click" />

</td>

</tr>

</table>

</ItemTemplate>

</telerik:GridTemplateColumn>

</Columns>

</MasterTableView>

</telerik:RadGrid>

So, I'm new to this whole Telerik thing and I'm having a little problem...
I have a RadGrid and one of its columns is a Template Column.. Inside the template column, I have a button... I can't seem to get the event handler of that button to fire....
I also need to know the button of which row was clicked... I tried the ItemCommand and it didn't work.. any ideas? thnx for the help...

Grid

answered on 21 Jul 2011

8 answers

840 views

RadAjaxLoadingPanel Not Working

Hello,

I've been unable to get the RadAjaxLoadingPanel to work. I'm using a Master page which contains the RadScriptManager. The content page contains a RadAjaxManager, RadAjaxLoadingPanel, and RadAjaxPanel. I think I'm missing client side code that triggers the Loading Panel to appear and disappear. You can see below, I've set the Ajax Panel "LoadingPanelID" to my loading panel. I also added the RadAjaxManager in attempt to wire up the AjaxPanel & Loading Panel. I also set the Loading Panel to have absolute positioning so I could search for it using the IE developer toolbar. I did find it on the page, but it was hidden (display:none). This is why I'm assuming I'm missing the code to trigger the appearance of the Loading Panel. Suggestions are greatly appreciated.

Thanks!

Content.aspx
<telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">
<AjaxSettings>
<telerik:AjaxSetting AjaxControlID="RadAjaxPanel1">
<UpdatedControls>
<telerik:AjaxUpdatedControl ControlID="RadAjaxPanel1" LoadingPanelID="RadAjaxLoadingPanel1" />
</UpdatedControls>
</telerik:AjaxSetting>
</AjaxSettings>
</telerik:RadAjaxManager>

<telerik:RadAjaxLoadingPanel ID="RadAjaxLoadingPanel1" runat="server" Skin="Default" Transparency="30" ZIndex="9999999" style="position:absolute; left:200px; top:200px;">
<asp:Label ID="lbl" runat="server" ForeColor="Red">Loading...</asp:Label>
<asp:Image ID="img" runat="server" Height="40px" Width="40px" ImageUrl="~/images/SpinIndicator.gif" />
</telerik:RadAjaxLoadingPanel>

<telerik:RadAjaxPanel ID="RadAjaxPanel1" runat="server" LoadingPanelID="RadAjaxLoadingPanel1" OnAjaxSettingCreating="RadAjaxPanel1_AjaxSettingCreating">
>
>
>

Content.aspx.cs
protected void RadAjaxPanel1_AjaxSettingCreating(object sender, AjaxSettingCreatingEventArgs e)
{
e.UpdatePanel.UpdateMode = UpdatePanelUpdateMode.Always;
}

MasterPage.master
- Contains RadScriptManager

Ajax

answered on 21 Jul 2011

1 answer

142 views

OnClientCheckedChanged not working on RadButton

Hello all,
Here the markup of my code.

<div class="search-filter-categories">

<asp:UpdatePanel runat="server" ID="updatePanelCategories" UpdateMode="Conditional">

<ContentTemplate>

<telerik:RadListView ID="categoriesList" runat="server" OnItemDataBound="CategoryDataBound" >

<ItemTemplate>

<div class="search-filter-categories-item">

<telerik:RadButton AutoPostBack="false" ButtonType="ToggleButton" ToggleType="CheckBox"

CommandArgument='<%# Eval("Id") %>' runat="server" ID="chkOption" OnClientCheckedChanged="showMyToolTip" Text='<%# Eval("Name") %>' /><

div class="cb"></div>

</div>

</ItemTemplate>

<LayoutTemplate>

<div class="search-filter-categories-columns"><div id="itemPlaceholder" runat="server"></div></div>

<div class="cb"></div>

</LayoutTemplate>

</telerik:RadListView>

</ContentTemplate>

</asp:UpdatePanel>

<telerik:RadToolTipManager ID="toolTipManager" ShowEvent="FromCode" HideEvent="FromCode" runat="server" EnableShadow="true"

Position="BottomCenter" Modal="true" Animation="Fade" AutoTooltipify="false" OnAjaxUpdate="OnAjaxUpdate" RelativeTo="Mouse"

Width="180px" Height="150px" Style="font-size: 18px; text-align: center; font-family: Arial;"

RenderInPageRoot="true">

</telerik:RadToolTipManager>

</div>

i have a javascript function called showMyTooltip(sender, args).
The function is correctly called when check/uncheck the checkbox but sender is just the ClientID of the control and args is alwais null.
So i can't use args.get_checked() to see if is checked or not.
Why args is always null?

Thanks,
Mattia

Button

answered on 21 Jul 2011

7 answers

347 views

disable detail table

hello,

i have a grid with detail table, default detail tables are disable, the master table has a GridClientSelectColumn, when GridClientSelectColumn checked, the row details table is enable, when unchecked, the row detail table is disable again. i try to use client events to change it, but can't make it. Anyone can give some helps? Thanks.

Grid

answered on 21 Jul 2011

1 answer

97 views

Cas

combobox2 changes based on combobox1. And the Rad grid will populated based on two comboboxes. when ever we change the second combobox2 selected value it shows the first value all the time and tha data in grid is not changing (combobox2 has four options date1, date2, date3 and date4. But if user changes the selection to date2 the combobox2 still shows as date1 and the data in grid is not chnaging)
please see attached code.

Thanks

using System;

using System.Web;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Data;

using System.Configuration;

using System.Web.Security;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

using System.Collections.Generic;

using System.Data.SqlClient;

using System.Security.Principal;

using Telerik.Web.UI;

public partial class _DataReview : System.Web.UI.Page

{

private DataSet searchResults = new DataSet();

private DataSet ddlist = new DataSet();

private DataView searchResultsView = new DataView();

string strID = "";

string strcomments = "";

string Combobox2Date = "";

protected void Page_Load(object sender, EventArgs e)

{

if (!Page.IsPostBack)

{

PopulateRadCombobox1 ();

lblErrorMsg.Visible = false;

ViewState["Id"] = null;

}

if ((string)ViewState["Id"] != null && (string)ViewState["Id"] != "Loading...")

{

RadCombobox2.Text = (string)ViewState["Id"];

}

protected void btnSearch_Click(object sender, EventArgs e)

{

this.lblErrorMsg.Visible = false;

string index = RadCombobox1.SelectedValue;

if (index == "0" || index =="-1")

{

RadGrid1.Visible = false;

this.lblErrorMsg.Visible = true;

}

else

{

RadGrid1.Visible = true;

RadGrid1.CurrentPageIndex = 0;

RadGrid1.DataSource = this.bindGrid();

RadGrid1.DataBind();

btnApprove.Visible = true;

int searchCount = RadGrid1.Items.Count;

if (searchCount == 0)

{

RadGrid1.Visible = false;

this.lblErrorMsg.Visible = true;

}

private DataView bindGrid()

{

using (SqlConnection sqlCon = new SqlConnection(ConfigurationManager.ConnectionStrings["DBConnString"].ConnectionString))

{

string name= RadCombobox1.Text ;

Date = RadCombobox2.Text ;

SqlCommand cmd = new SqlCommand("dbo.SP_GetDataForRadGrid", sqlCon);

cmd.Parameters.Add("@table_name", SqlDbType.VarChar).Value = name;

cmd.Parameters.Add("@Date", SqlDbType.VarChar).Value = dropboxDate;

cmd.CommandType = CommandType.StoredProcedure;

searchResults = new DataSet();

SqlDataAdapter da = new SqlDataAdapter(cmd);

da.Fill(searchResults);

}

return searchResults.Tables[0].DefaultView;

}

private void PopulateRadCombobox1()

{

using (SqlConnection sqlCon = new SqlConnection(ConfigurationManager.ConnectionStrings["DBConnString"].ConnectionString))

{

try

{

sqlCon.Open();

SqlCommand cmd = new SqlCommand("dbo.Sp_GetCombobox1data", sqlCon);

cmd.CommandType = CommandType.StoredProcedure;

SqlDataReader sqlReader = cmd.ExecuteReader();

if (sqlReader.HasRows)

{

RadCombobox1.DataSource = sqlReader;

RadCombobox1.DataTextField = "name";

RadCombobox1.DataValueField = "id";

RadCombobox1.DataBind();

RadCombobox1.Items.Insert(0, new RadComboBoxItem("Select Name", string.Empty));

}

catch (SqlException ex)

{

lblErrorMsg.Text = ex.Message;

lblErrorMsg.Visible = true;

}

finally

{

// Close the database connection

sqlCon.Close();

}

private void PopulateRadCombobox2(int ID)

{

using (SqlConnection sqlCon = new SqlConnection(ConfigurationManager.ConnectionStrings["DBConnString"].ConnectionString))

{

// RadDropBoxList.Items.Clear();

try

{

sqlCon.Open();

SqlCommand cmd = new SqlCommand("dbo.Sp_GetNameandLocation", sqlCon);

cmd.CommandType = CommandType.StoredProcedure;

cmd.Parameters.Add("@Id", SqlDbType.Int).Value = ID;

SqlDataReader sqlReader = cmd.ExecuteReader();

if (sqlReader.HasRows)

{

sqlReader.Read();

RadCombobox2.DataSource = sqlReader;

RadCombobox2.DataTextField = "FilePath";

RadCombobox2.DataValueField = "Id";

RadCombobox2.DataBind();

}

else if (sqlReader.HasRows == false)

{

lblDropbox.ForeColor = System.Drawing.Color.Red;

lblDropbox.Text = "There is No Dropboxes";

}

catch (SqlException ex)

{

lblErrorMsg.Visible = true;

lblErrorMsg.Text = ex.Message;

}

finally

{

// Close the database connection

sqlCon.Close();

}

protected void txtTitleId_TextChanged(object sender, EventArgs e)

{

}

RadGrid1.CurrentPageIndex = 0;

RadGrid1.DataSource = this.bindGrid();

RadGrid1.DataBind();

lblErrorMsg.Visible = true;

}

protected void RadGrid1_PageIndexChanged(object source, GridPageChangedEventArgs e)

{

RadGrid1.CurrentPageIndex = 0;

RadGrid1.DataSource = this.bindGrid();

RadGrid1.DataBind();

}

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

{

}

protected void RadGrid1_ItemDataBound(object sender, GridItemEventArgs e)

{

if (e.Item is GridDataItem)

{

GridDataItem dataItem = e.Item as GridDataItem;

string Caseno = dataItem["CaseID"].Text.ToString().Trim();

}

protected void RadGrid1_PageSizeChanged(object source, GridPageSizeChangedEventArgs e)

{

RadGrid1.CurrentPageIndex = 0;

RadGrid1.DataSource = this.bindGrid();

RadGrid1.DataBind();

}

protected void RadGrid1_SortCommand(object source, GridSortCommandEventArgs e)

{

RadGrid1.CurrentPageIndex = 0;

RadGrid1.DataSource = this.bindGrid();

RadGrid1.DataBind();

}

protected void RadCombobox1_ItemsRequested(object o, RadComboBoxItemsRequestedEventArgs e)

{

PopulateRadCombobox1();

}

protected void RadCombobox2_ItemsRequested(object o, RadComboBoxItemsRequestedEventArgs e)

{

// e.Text is the first parameter of the requestItems method

string id = e.Text.ToString();

int Id = Convert.ToInt32(id);

PopulateRadCombobox2 (Id);

}

ComboBox

answered on 21 Jul 2011

1 answer

141 views

How to show datepicker in double click

Hello,
I have used the http://demos.telerik.com/aspnet-ajax/grid/examples/dataediting/clienteditbatchupdates/defaultcs.aspx example as base of my app. I don't know how to do when doucle click in a date column to appear the datepicker to select a different date.
I have this in the UpdateValues(grid) javascript function:

case "date":

HideEditor(editedCell, "textbox");

break;

I also added this code on the grid column:

<telerik:GridTemplateColumn UniqueName="date" SortExpression="date" AutoPostBackOnFilter="true"

HeaderText="DateTimeCol" HeaderStyle-Width="10%" AllowFiltering="true" DataField="date">

<ItemTemplate>

<asp:Label ID="lblDate" runat="server" Text='<%# Eval("date") %>' />

<telerik:RadDateTimePicker runat="server" ID="txtDate" DbSelectedDate='<%# Eval("date") %>'

Style="display: none">

</telerik:RadDateTimePicker >

</ItemTemplate>

<InsertItemTemplate>

<telerik:RadDateTimePicker runat="server" ID="dateInsert" Width="95%">

</telerik:RadDateTimePicker>

<asp:RequiredFieldValidator ID="RequiredFieldValidator4a" runat="server" ErrorMessage="* Required Field"

ControlToValidate="dateInsert" BackColor="Red" BorderColor="#FF0066" BorderStyle="Solid">

</asp:RequiredFieldValidator>

</InsertItemTemplate>

<EditItemTemplate>

<telerik:RadDateTimePicker runat="server" ID="dateEdit" Width="95%" DbSelectedDate='<%# Eval("date") %>'>

</telerik:RadDateTimePicker >

<asp:RequiredFieldValidator ID="RequiredFieldValidator4b" runat="server" ErrorMessage="* Required Field"

ControlToValidate="dateEdit" CssClass="error" >

</asp:RequiredFieldValidator>

</EditItemTemplate>

</telerik:GridTemplateColumn>

Anybody knows what is the problem?
Thanks in advanced;
Jon

Grid

answered on 21 Jul 2011

1 answer

128 views

RadGrid oData and CrUD

http://demos.telerik.com/aspnet-ajax/grid/examples/clientbinding/defaultcs.aspx

shows a grid being bound to an oData service. Works great but I am wondering if there is any examples of the best water to perform the insert, update and delete portion against an oData service?

Grid

answered on 21 Jul 2011

1 answer

213 views

Get parent RadListBoxItem from child control inside item's template?

Say I have a RadListBox, and inside the ItemTemplate for each item, I have two RadComboBox controls, a RadTextBox control, and a RadButton control.   I capture the button click in the RadButton's OnClientClicked event handler.

Inside the OnClientClicked event handler, I want to get a reference to the parent list item, so that I can I can delete that item.

For example:

function Button_OnClientClicked(button)
{
    var listBox = $find('MyListBox.ClientID');
    var itemContainingTheButtonThatWasClicked = /* this is what I need to know    */
    listBox.get_items().remove(itemContainingTheButtonThatWasClicked);
}

Thanks

ListBox

answered on 21 Jul 2011

11 answers

184 views

Skin-problem with sub tabs (2009 Q1)

Hi,

I have a problem with the skin on sub-tabs on a RadTabStrip. The sub-items have no skin and it is impossible to see which of the sub-tabs are selected.

The same problem can be seen on this page:

http://demos.telerik.com/aspnet-ajax/tabstrip/examples/serverside/serverevents/defaultcs.aspx

I also created a small example showing the problem

<telerik:RadTabStrip ID="RadTabStrip11111" runat="server" EnableAjaxSkinRendering="true" Skin="Vista" CausesValidation="false" SelectedIndex="0" >

<Tabs>

<telerik:RadTab Text="aaa">

<Tabs>

<telerik:RadTab Text="Sub 1"></telerik:RadTab>

<telerik:RadTab Text="Sub 2"></telerik:RadTab>

</Tabs>

</telerik:RadTab>

<telerik:RadTab Text="bbb"></telerik:RadTab>

</Tabs>

</telerik:RadTabStrip>

(Version: 2009.1.408.20)

TabStrip

answered on 21 Jul 2011

1 answer

46 views

just can't seem to figure these out...

I have a couple of questions about some of the functionality of the rotator when in coverflow.

1) Is there a specific property to turn on to allow the reflection? I have set the rotatortype to coverflow but there is no reflection.

2) I have taken the code from the coverflow sample here. But I want to add functionality such that when the user double clicks the picture that is currently being shown, then I want to show that picture in a larger image.

Thanks in advance,
Lee

Rotator

answered on 21 Jul 2011