Rad controls Overview

Grid


Advanced Databinding (using NeedDataSource event)

Send comments on this topic.
Language Filter: All Language Filter: Multiple Language Filter: Visual Basic .NET Language Filter: C#
Populating the control with data > Understanding databinding > Advanced Databinding (using NeedDataSource event)
Visual Basic .NET C#
Glossary Item Box
Telerik RadGrid fires this event each time it needs to be bound to a data source.
The key to the advanced data binding of Telerik RadGrid is handling correctly the NeedDataSource event. That's why we chose this exact name. 'Need' in this case actually means that if at an exact moment the data-source property does not point to a valid data-source object, the grid will not behave correctly. This event fires in the following cases:
Right after OnLoad - if the grid has not been data-bound yet and there is no ViewState data. This also means that if MasterTableView.DataSourcePersistenceMode has been set to NoPersistence, grid would bind each time the page loads (not only the first time);
When paging operation occurs;
When sorting operation occurs;
When Edit command is fired;
Right after Update/Delete/Insert command event handlers finish execution. You can cancel these operations handling ItemCommand event and assigning false value to the e event argument's Canceled property;
When grouping / ungrouping - right after the RadGrid.GroupsChanging event is raised;
When filtering (choosing an option from a column filter menu);
When resorting a group;
When a call to the Rebind() grid method takes place;
Prior to any detail table binding;
In some other custom cases.
Important: You should never call Rebind() method in NeedDataSource event handler. You should never call DataBind() as well when using advanced data-binding through NeedDataSource. For MS GridView-like data-binding see the Simple data-binding topic in the same chapter.

private void RadGrid1_NeedDataSource(object source, Telerik.WebControls.GridNeedDataSourceEventArgs e)
{
OleDbConnection MyOleDbConnection = new OleDbConnection("Provider=Microsoft.Jet.OLEDB.4.0; Data Source=" + Server.MapPath("Nwind.mdb"));
OleDbDataAdapter MyOleDbDataAdapter = new OleDbDataAdapter();
MyOleDbDataAdapter.SelectCommand = new OleDbCommand("SELECT * FROM Customers", MyOleDbConnection);
DataTable myDataTable = new DataTable();
MyOleDbConnection. Open();
try
{
MyOleDbDataAdapter.Fill(myDataTable);
}
finally
{
MyOleDbConnection. Close();
}
RadGrid1.DataSource = myDataTable;
}

*****************
I found EditForm Image button issue.

Solution is - If you are using EditForm, please set the desired text for EditFormSettings EditColumn also


How to develope telerik Grid view with EditForm















telerik:RadGrid ID="RadGrid1" runat="server" GridLines="None"
AllowPaging="True"
ShowStatusBar="True"
AutoGenerateColumns="False"
Skin="Vista" AllowCustomPaging="True"
oninsertcommand="RadGrid1_InsertCommand"
onupdatecommand="RadGrid1_UpdateCommand"
ondeletecommand="RadGrid1_DeleteCommand" onprerender="RadGrid1_PreRender"
onneeddatasource="RadGrid1_NeedDataSource">

ValidationSettings EnableValidation="False" />

MasterTableView CommandItemDisplay="TopAndBottom" EditMode="EditForms"
DataKeyNames="CompanyID" HorizontalAlign="NotSet"
AutoGenerateColumns="False"
allowcustompaging="False" allownaturalsort="False" >
Columns>
telerik:GridEditCommandColumn
UniqueName="EditCommandColumn" ButtonType="ImageButton" >
/telerik:GridEditCommandColumn>
telerik:GridBoundColumn DataField="CompanyCode" HeaderText="CompanyCode"
UniqueName="CompanyCode" >
/telerik:GridBoundColumn>
telerik:GridBoundColumn DataField="CompanyName" HeaderText="CompanyName"
UniqueName="CompanyName">
/telerik:GridBoundColumn>
telerik:GridBoundColumn DataField="AddressLine01" HeaderText="AddressLine01"
UniqueName="AddressLine01">
/telerik:GridBoundColumn>
telerik:GridButtonColumn ButtonType="ImageButton" CommandName="Delete"
ConfirmDialogType="RadWindow" ConfirmText="Are you sure delete this record?" Text="Delete" UniqueName="column">
/telerik:GridButtonColumn>
/Columns>
EditFormSettings EditFormType="Template">
EditColumn UniqueName="EditCommandColumn" ButtonType="ImageButton">
/EditColumn>
FormTemplate>
table id="Table2" cellspacing="2" cellpadding="1" border="0" rules="none"
style="border-collapse: collapse; background: white;">

tr>
td>
table >
tr>
td>
b>Company Code/b>
/td>
td>
asp:TextBox ID="txtCompanyCode" Text='%# Bind("CompanyCode") %>' runat="server">/asp:TextBox>
/td>
/tr>

tr>
td>
b>CompanyName/b>

/td>

td>
asp:TextBox ID="txtCompanyName" Text='%# Bind("CompanyName") %>' runat="server">/asp:TextBox>

/td>


/tr>

tr>
td>
b>AddressLine01/b>
/td>
td>
asp:TextBox ID="txtAdd1" Text='%# Bind("AddressLine01") %>' runat="server">/asp:TextBox>
/td>
/tr>

tr>
td>
b>AddressLine02/b>
/td>
td>

asp:TextBox ID="txtAdd2" Text='%# Bind("AddressLine02") %>' runat="server">/asp:TextBox>

/td>

/tr>

tr>
td>
b>AddressLine03/b>
/td>
td>

asp:TextBox ID="txtAdd3" Text='%# Bind("AddressLine03") %>' runat="server">/asp:TextBox>

/td>
/tr>
tr>
td>
b>AddressLine04/b>
/td>
td>
asp:TextBox ID="txtAdd4" Text='%# Bind("AddressLine04") %>' runat="server">/asp:TextBox>

/td>
/tr>

/table>

/td>

td>

table>
tr>
td>
b>Post Code/b>
/td>
td>
asp:TextBox ID="txtPostCode" Text='%# Bind("Postcode") %>' runat="server">/asp:TextBox>
/td>
/tr>
tr>
td>
b>Country/b>
/td>
td>

asp:TextBox ID="txtCountry" Text='%# Bind("Country") %>' runat="server">/asp:TextBox>

/td>
/tr>
tr>
td>
b>Telephone/b>
/td>
td>

asp:TextBox ID="txtTelephone" Text='%# Bind("Telephone") %>' runat="server">/asp:TextBox>

/td>
/tr>

tr>
td>
b>Fax/b>
/td>
td>
asp:TextBox ID="txtFax" Text='%# Bind("Fax") %>' runat="server">/asp:TextBox>

/td>
/tr>
tr>
td>
b>Web/b>
/td>
td>
asp:TextBox ID="txtWeb" Text='%# Bind("Web") %>' runat="server">/asp:TextBox>

/td>
/tr>

tr>
td>
b>Default/b>
/td>

td>
asp:CheckBox ID="chkDefault" Text='%# Bind("default") %>' runat="server" />

/td>
/tr>
/table>
/td>
/tr>
tr>
td>

/td>
td align="right" colspan="2">
asp:Button ID="btnUpdate" CausesValidation="False" Text='%# (Container is GridEditFormInsertItem) ? "Insert" : "Update" %>'
runat="server" CommandName='%# (Container is GridEditFormInsertItem) ? "PerformInsert" : "Update" %>'>
/asp:Button>
asp:Button ID="btnCancel" Text="Cancel" runat="server" CausesValidation="False"
CommandName="Cancel">/asp:Button>

/td>
/tr>
/table>

/FormTemplate>
/EditFormSettings>

/MasterTableView>
ClientSettings>
ClientEvents OnRowDblClick="RowDblClick" />
/ClientSettings>

/telerik:RadGrid>


**** less than mark is missing in above code

private void DisplayMessage(bool isError, string text)
{
RadGrid1.Controls.Add(new LiteralControl(string.Format("{0}", text)));
}

private void SetMessage(string message)
{
gridMessage = message;
}

private string gridMessage = null;


protected void RadGrid1_UpdateCommand(object source, GridCommandEventArgs e)
{
try
{

Minute.Company Com = new Minute.Company();
CompanyControler ComCon = new CompanyControler();
if (e.Item is GridEditFormItem)
{
GridEditFormItem item = (GridEditFormItem)e.Item;

if (item.ItemIndex > 0)
{
int id = Convert.ToInt32(item.GetDataKeyValue("CompanyID"));
if (id != 0)
{
Com.CompanyID = id;

}
}
TextBox txtCompanyCode = (TextBox)e.Item.FindControl("txtCompanyCode");
TextBox txtCompanyName = (TextBox)e.Item.FindControl("txtCompanyName");
TextBox txtAddressLine01 = (TextBox)e.Item.FindControl("txtAdd1");
TextBox txtAddressLine02 = (TextBox)e.Item.FindControl("txtAdd2");
TextBox txtAddressLine03 = (TextBox)e.Item.FindControl("txtAdd3");
TextBox txtAddressLine04 = (TextBox)e.Item.FindControl("txtAdd4");
TextBox txtPostCode = (TextBox)e.Item.FindControl("txtPostCode");
TextBox txtCountry = (TextBox)e.Item.FindControl("txtCountry");
TextBox txtTelephone = (TextBox)e.Item.FindControl("txtTelephone");
TextBox txtFax = (TextBox)e.Item.FindControl("txtFax");
TextBox txtWeb = (TextBox)e.Item.FindControl("txtWeb");

Com.CompanyCode = txtCompanyCode.Text;
Com.CompanyName = txtCompanyName.Text;
Com.AddressLine01 = txtAddressLine01.Text;
Com.AddressLine02 = txtAddressLine02.Text;
Com.AddressLine03 = txtAddressLine03.Text;
Com.AddressLine04 = txtAddressLine04.Text;
Com.PostCode = txtPostCode.Text;
Com.Telephone = txtTelephone.Text;
Com.Web = txtWeb.Text;
Com.Fax = txtFax.Text;
Com.Country = txtCountry.Text;
}
ComCon.UpdateCompany(Com);
RadGrid1.MasterTableView.Rebind();
RadGrid1.Rebind();

//DisplayMessage(false, "Company " + e.Item.OwnerTableView.DataKeyValues[e.Item.ItemIndex]["CompanyID"] + " updated");


}
catch (Exception er)
{

}

}
protected void RadGrid1_InsertCommand(object source, GridCommandEventArgs e)
{

Minute.Company Com = new Minute.Company();
CompanyControler ComCon = new CompanyControler();


TextBox txtCompanyCode = (TextBox)e.Item.FindControl("txtCompanyCode");
TextBox txtCompanyName = (TextBox)e.Item.FindControl("txtCompanyName");
TextBox txtAddressLine01 = (TextBox)e.Item.FindControl("txtAdd1");
TextBox txtAddressLine02 = (TextBox)e.Item.FindControl("txtAdd2");
TextBox txtAddressLine03 = (TextBox)e.Item.FindControl("txtAdd3");
TextBox txtAddressLine04 = (TextBox)e.Item.FindControl("txtAdd4");
TextBox txtPostCode = (TextBox)e.Item.FindControl("txtPostCode");
TextBox txtCountry = (TextBox)e.Item.FindControl("txtCountry");
TextBox txtTelephone = (TextBox)e.Item.FindControl("txtTelephone");
TextBox txtFax = (TextBox)e.Item.FindControl("txtFax");
TextBox txtWeb = (TextBox)e.Item.FindControl("txtWeb");

Com.CompanyCode = txtCompanyCode.Text;
Com.CompanyName = txtCompanyName.Text;
Com.AddressLine01 = txtAddressLine01.Text;
Com.AddressLine02 = txtAddressLine02.Text;
Com.AddressLine03 = txtAddressLine03.Text;
Com.AddressLine04 = txtAddressLine04.Text;
Com.PostCode = txtPostCode.Text;
Com.Telephone = txtTelephone.Text;
Com.Web = txtWeb.Text;
Com.Fax = txtFax.Text;
Com.Country = txtCountry.Text;


ComCon.InsertCompany (Com);
DisplayMessage(false, "Company inserted");
RadGrid1.MasterTableView.Rebind();
RadGrid1.Rebind();


}
protected void RadGrid1_NeedDataSource(object source, GridNeedDataSourceEventArgs e)
{
CompanyControler Com = new CompanyControler();
RadGrid1.DataSource = Com.CompanyList();


}

protected void RadGrid1_PreRender(object sender, EventArgs e)
{
if (!this.IsPostBack)
{
this.RadGrid1.MasterTableView.Items[1].Edit = true;
this.RadGrid1.MasterTableView.Rebind();
}

}
protected void RadGrid1_DeleteCommand(object source, GridCommandEventArgs e)
{
Minute.Company Com = new Minute.Company();
CompanyControler ComCon = new CompanyControler();

int ID = int.Parse(e.Item.OwnerTableView.DataKeyValues[e.Item.ItemIndex]["CompanyID"].ToString());
Com.CompanyID = ID;
ComCon.DeleteCompany (Com);
//e.Canceled = true;
RadGrid1.MasterTableView.Rebind();
RadGrid1.Rebind();
}

*** Bind database null value to Date picker control
Binding a RadDatePicker to a data source is easy provided through the DbSelectedDate property. It works almost like the SelectedDate one, but will not throw an exception when it has been given a null value.

The example demonstrates binding a RadGrid control to a DataTable with dates, containing null values. Binding the date for the DatePicker in template column is done via the DbSelectedDate property:

EditItemTemplate>
telerik:RadDatePicker id="picker1" MinDate="2006/1/1" runat="server" DbSelectedDate='%# Bind("Dates") %>'>
/telerik:RadDatePicker>
/EditItemTemplate>

The second Grid in the presented example benefits from the GridDateTimeColumn option so that the markup/code is highly optimized. The GridDateTimeColumn's RadDatePicker uses a "shared" calendar internally.

Format Date

rad:RadDatePicker ID="endDate" runat="server" LabelText="End(MM/YYYY)">

DateInput runat="server" DisplayDateFormat="MM/yyyy" />

/rad:RadDatePicker>

*************

if the report shows 5 columns and you only have 3 columns that you want editable. How do I lock down the other 2 columns ?

telerik:GridBoundColumn

ReadOnly="true"

DataField="Name"

HeaderText="Name"

UniqueName="Name">

/telerik:GridBoundColumn>

MasterTableView DataKeyNames="CustomerID,EmployeeID" >

When i try to delete record its raise this error

Must declare the scalar variable "@IDCID".

Solution is ClientDataKeyNames="IDCID"

Optimizations Tips in telerik grid

http://www.telerik.com/community/forums/aspnet/general-discussions/keeping-a-telerik-heavy-page-light-on-kilobytes.aspx

http://blogs.telerik.com/toddanglin/posts/07-05-14/top_15_optimization_tips_and_tricks.aspx

http://telerikwatch.com/2009/01/optimization-tips-radcompression-module.html

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

http://www.telerik.com/help/aspnet-ajax/grdviewstateoptimization.html

http://blogs.telerik.com/toddanglin/posts/07-05-14/top_15_optimization_tips_and_tricks.aspx

An old version

http://demos.telerik.com/aspnet-classic/grid/examples/Programming/ViewState/DefaultCS.aspx

Optimization tips

**********************

Having many date pickers on a page might render too much HTML and impact performance. RadDatePicker instances can share a RadCalendar control and use it to pick dates.

There are two ways to configure the calendar control:

• by setting its ID to the RadDatePicker.SharedCalendarID property. That can be done in the VS.NET designer.
• by passing a reference to the control to the RadDatePicker.SharedCalendar property. Available to the code-behind logic only.

How Expand hierarchy with tabstrip

RadGrid4.MasterTableView.Items[0].Expanded = true;
RadGrid4.MasterTableView.Items[0].ChildItem.FindControl("InnerContainer").Visible = true;


How to afdate grid after popup edit

1. Use following javascript code for popup window

SCRIPT LANGUAGE="JavaScript">
function closeWindow() {
var oWindow = GetRadWindow();
oWindow.OnClientClose = CloseAndRebind;
}

function GetRadWindow()
{
var oWindow = null;
if (window.radWindow) oWindow = window.radWindow; //Will work in Moz in all cases, including clasic dialog
else if (window.frameElement.radWindow) oWindow = window.frameElement.radWindow;//IE (and Moz as well)

return oWindow;
}

function CloseWnd(args)
{

GetRadWindow().close();
GetRadWindow().BrowserWindow.refreshGrid(args);
}
/SCRIPT>

2. Use following code inside popup submit button click event

ScriptManager.RegisterStartupScript(this, GetType(), "closeWnd", "CloseWnd('RebindAndNavigate');", true);

3. UPdate ajax manager as follows

telerik:RadAjaxManager ID="RadAjaxManager1" runat="server"
onajaxrequest="RadAjaxManager1_AjaxRequest"
DefaultLoadingPanelID="RadAjaxLoadingPanel1">
AjaxSettings>
telerik:AjaxSetting AjaxControlID="RadAjaxManager1">
UpdatedControls>
telerik:AjaxUpdatedControl ControlID="RadGrid4" />
/UpdatedControls>
/telerik:AjaxSetting>
telerik:AjaxSetting AjaxControlID="RadGrid4">
UpdatedControls>
telerik:AjaxUpdatedControl ControlID="RadGrid4" />
/UpdatedControls>
/telerik:AjaxSetting>

/telerik:RadAjaxManager>


4. Put following code to Ajaxmanger request event

protected void RadAjaxManager1_AjaxRequest(object sender, AjaxRequestEventArgs e)
{
RadGrid4.MasterTableView.SortExpressions.Clear();
RadGrid4.MasterTableView.GroupByExpressions.Clear();

if(Session["PageIndex"]!=null)
RadGrid4.MasterTableView.CurrentPageIndex = int.Parse( Session["PageIndex"].ToString());

RadGrid4.MasterTableView.Rebind();
RadGrid4.Rebind();

if (Session["ExpanIndex"] != null)
RadGrid4.MasterTableView.Items[int.Parse(Session["ExpanIndex"].ToString())].Expanded = true;

RadGrid4.MasterTableView.Items[int.Parse(Session["ExpanIndex"].ToString())].ChildItem.FindControl("InnerContainer").Visible = true;


}

5. And update grid item Command event like this

Session["PageIndex"] = RadGrid4.CurrentPageIndex;

if (e.CommandName == RadGrid.ExpandCollapseCommandName)
{

Session["ExpanIndex"] = e.Item.ItemIndex;
}