This is a migrated thread and some comments may be shown as answers.

[Solved] UserControl Edit Form js call to parent page

6 Answers 263 Views

Grid

This is a migrated thread and some comments may be shown as answers.

ALEX asked on 29 Apr 2012, 12:36 PM

wrong-func.PNG

Hi Team,

I'm facing with user control edit form js call to parent page js function and ajax error. I'm try to do the sample like User Control Edit Form. I wrote the js function in user control and attach to button onclientclick. When i click the button on user control error said function is not have. And then i move my js function to default.aspx and click it work. At the same time i put ajax manager on my user control, when i click cancel button it show error "Error: Sys.WebForms.PageRequestManagerServerErrorException: A control with ID 'RadGrid1$ctl00$ctl24$EditFormControl$_radAjManagers' could not be found for the trigger in UpdatePanel 'RadGrid1$ctl00$ctl24$EditFormControl$_lblstatusPanel'." But cancel button is not fire to any ajax event. I did simple rad grid edit form and call to user control. I can't understand what wrong my code.

So i tried to look live demo sample and i modified code at "C:\Program Files\Telerik\RadControls for ASP.NET AJAX Q3 2011 SP1\Live Demos\Grid\Examples\DataEditing\UserControlEditForm". If i comment this

protected void RadGrid1_PreRender(object sender, System.EventArgs e)

{

if (!this.IsPostBack)

{

this.RadGrid1.MasterTableView.Items[1].Edit = true;

this.RadGrid1.MasterTableView.Rebind();

}

does not work and same as my sample code.

I hope someone can help to me this problem.

Sample Code.

Default.aspx

<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="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 runat="server" id="mainForm" method="post">

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

<script type="text/javascript">

//Put your JavaScript code here.

function fnUpdate() {

alert('Default.aspx');

return false;

}

</script>

</telerik:RadCodeBlock>

<telerik:RadScriptManager ID="RadScriptManager1" runat="server" />

//If i didn't comment this one when i click cancel i got error

      <

telerik:RadAjaxManager ID="RadAjaxManager1" runat="server">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="RadGrid1">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="RadGrid1" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<telerik:RadGrid ID="RadGrid1" runat="server" GridLines="None" AllowPaging="True"

CssClass="RadGrid" AutoGenerateColumns="False" ShowStatusBar="True" OnNeedDataSource="RadGrid1_NeedDataSource"

PageSize="10" CellSpacing="0">

<MasterTableView DataKeyNames="row_id" EditMode="PopUp" HorizontalAlign="Left">

<CommandItemSettings />

<Columns>

<telerik:GridEditCommandColumn UniqueName="EditCommandColumn">

</telerik:GridEditCommandColumn>

<telerik:GridBoundColumn DataField="row_id" DataType="System.Int32" FilterControlAltText="Filter row_id column"

HeaderText="Row" ReadOnly="True" SortExpression="row_id" UniqueName="row_id">

</telerik:GridBoundColumn>

<telerik:GridBoundColumn DataField="description" FilterControlAltText="Filter description column"

HeaderText="Description" SortExpression="description" UniqueName="description">

</telerik:GridBoundColumn>

<telerik:GridCheckBoxColumn DataField="status" DataType="System.Boolean" FilterControlAltText="Filter status column"

HeaderText="Status" SortExpression="status" UniqueName="status">

</telerik:GridCheckBoxColumn>

</Columns>

<EditFormSettings UserControlName="control/WebUserControl.ascx" EditFormType="WebUserControl"

PopUpSettings-Modal="true" CaptionFormatString="Current Editing row no. {0}"

CaptionDataField="row_id">

<EditColumn UniqueName="EditCommandColumn">

</EditColumn>

</EditFormSettings>

</MasterTableView>

<FilterMenu EnableImageSprites="False">

</FilterMenu>

</telerik:RadGrid>

<br />

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

SelectCommand="SELECT [row_id], [description], [status] FROM [tbl_sample]"></asp:SqlDataSource>

</form>

</body>

</html>

Default.cs

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 Telerik.Web.UI;

using System.Data.SqlClient;

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

{

protected void Page_Load(object sender, EventArgs e)

{

}

private static DataTable GetDataTable(string queryString)

{

String ConnString = ConfigurationManager.ConnectionStrings["ConnectionString"].ConnectionString;

SqlConnection MySqlConnection = new SqlConnection(ConnString);

SqlDataAdapter MySqlDataAdapter = new SqlDataAdapter();

MySqlDataAdapter.SelectCommand = new SqlCommand(queryString, MySqlConnection);

DataTable myDataTable = new DataTable();

MySqlConnection.Open();

try

{

MySqlDataAdapter.Fill(myDataTable);

}

finally

{

MySqlConnection.Close();

}

return myDataTable;

}

private DataTable Employees

{

get

{

object obj = this.Session["_tbl"];

if ((!(obj == null)))

{

return ((DataTable)(obj));

}

DataTable myDataTable = new DataTable();

myDataTable = GetDataTable("SELECT * FROM tbl_sample");

this.Session["_tbl"] = myDataTable;

return myDataTable;

}

protected void RadGrid1_PreRender(object sender, System.EventArgs e)

{

if (!this.IsPostBack)

{

this.RadGrid1.MasterTableView.Items[1].Edit = true;

this.RadGrid1.MasterTableView.Rebind();

}

protected void RadGrid1_NeedDataSource(object source, GridNeedDataSourceEventArgs e)

{

this.RadGrid1.DataSource = this.Employees;

this.Employees.PrimaryKey = new DataColumn[] { this.Employees.Columns["row_id"] };

}

protected void RadGrid1_EditCommand(object sender, GridCommandEventArgs e)

{

}

User Control.ascx

<%@ Control Language="C#" AutoEventWireup="true" CodeFile="WebUserControl.ascx.cs"

Inherits="control_WebUserControl" %>

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

<script type="text/javascript" language="javascript">

//Put your JavaScript code here.

function fnUpdate() {

alert('Control'

);// should be call this function

}

</script>

</telerik:RadCodeBlock>

<telerik:RadAjaxManager ID="_radAjManagers" runat="server" OnAjaxRequest="_radAjManager_AjaxRequest">

<AjaxSettings>

<telerik:AjaxSetting AjaxControlID="_radAjManagers" EventName="OnAjaxRequest">

<UpdatedControls>

<telerik:AjaxUpdatedControl ControlID="_lblstatus" />

</UpdatedControls>

</telerik:AjaxSetting>

</AjaxSettings>

</telerik:RadAjaxManager>

<div>

<asp:Label runat="server" ID="_lblstatus"></asp:Label>

<asp:TextBox ID="TextBox1" runat="server" Text='<%# DataBinder.Eval( Container, "DataItem.Description" ) %>'></asp:TextBox>

<br />

<asp:Button ID="btnInsert" Text="Insert" runat="server" OnClientClick="javascript:fnUpdate();return false;">

</asp:Button>

<asp:Button ID="btnCancel" Text="Cancel" runat="server" CausesValidation="False"

CommandName="Cancel"></asp:Button>

</div>

User Control.ascx.cs

using System;

using System.Data;

using System.Configuration;

using System.Collections;

using System.Web;

using System.Web.Security;

using System.Web.UI;

using System.Web.UI.WebControls;

using System.Web.UI.WebControls.WebParts;

using System.Web.UI.HtmlControls;

using Telerik.Web.UI;

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

{

private object _dataItem = null;

protected void Page_Load(object sender, EventArgs e)

{

}

//protected void Button1_Command(object sender, CommandEventArgs e)

//{

// //

//}

protected void _radAjManager_AjaxRequest(object sender, Telerik.Web.UI.AjaxRequestEventArgs e)

{

_lblstatus.Text = "Done....";

}

public object DataItem

{

get

{

return this._dataItem;

}

set

{

this._dataItem = value;

}

Sample Code Link : Sample
Regards,
Alex

[Solved] UserControl Edit Form js call to parent page

6 Answers, 1 is accepted