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

DropDown in RadGrid

3 Answers 110 Views

Grid

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

Adeel asked on 09 Mar 2011, 02:45 PM

Hi,

I am creating a Grid in code behind which has all cells set to edit option and the save is on the save command.

My Grid is coded as such

<telerik:RadGrid ID="RadGrid1" OnPreRender="RadGrid1_PreRender" OnDataBinding="RadGrid1_DataBinding"

OnNeedDataSource="RadGrid1_NeedDataSource" OnItemCommand="RadGrid1_ItemCommand"

Skin="Web20" runat="server" GridLines="None" OnItemCreated="RadGrid1_ItemCreated"

style="top: 190px; left: 10px; position: absolute;" width="750px" Height="280px" >

<MasterTableView EditMode="InPlace" CommandItemDisplay="Top" DataKeyNames="ID" AutoGenerateColumns="true" ShowFooter="True">

<CommandItemTemplate>

<div style="padding: 5px 5px;">

<asp:LinkButton ID="btnAddNew" runat="server" CommandName="AddNewRow">

<img style="border:0px;vertical-align:middle;" alt="" src="Images/AddRecord.gif" />

Add New Row

</asp:LinkButton>

<asp:LinkButton ID="btnSave" runat="server" CommandName="Save">

<img style="border:0px;vertical-align:middle;" alt="" src="Images/save.png" />

Save in Database

</asp:LinkButton>

</div>

</CommandItemTemplate>

</MasterTableView>

<ClientSettings>

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

</ClientSettings>

</telerik:RadGrid>

And in the Code Behind

protected void RadGrid1_ItemCommand(object source, GridCommandEventArgs e)

{

saveDataInDataTable();

switch (e.CommandName)

{

case "InsertNewRow":

{

AddNewRowInDataTable();

//saveDataInDataTable();

string script = "setTimeout( function () { selectedCellId='" + e.CommandArgument.ToString() + "'; MoveDown();},100);";

ScriptManager.RegisterStartupScript(Page, Page.GetType(), "selectCell", script, true);

ViewState["inserted"] = true;

}

break;

case "AddNewRow":

{

AddNewRowInDataTable();

//saveDataInDataTable();

}

break;

case "Save":

{

//saveDataInDataTable();

//UpdateDatabase();

//Session["key"] = 0;

//RadAjaxManager1.Alert("The database was successfully updated");

}

break;

default: break;

}

// Add new empty row into DataTable

private void AddNewRowInDataTable()

{

NewRowsCount++;

DataRow row = GridSource.NewRow();

row["ChequeID"] = txtChequeID.Text;

row["AccountNo"] = "";

row["AccountName"] = "";

row["Amount"] = 0;

row["VAT"] = "S";

row["VATAmount"] = 0;

GridSource.Rows.Add(row);

RadGrid1.Rebind();

}

protected void RadGrid1_ItemCreated(object sender, Telerik.Web.UI.GridItemEventArgs e)

{

if (e.Item is GridEditableItem && e.Item.IsInEditMode)

{

TextBox Amount = (e.Item as GridEditableItem)["Amount"].Controls[0] as TextBox;

Amount.AutoPostBack = true;

Amount.TextChanged += new System.EventHandler(this.Amount_TextChanged);

string eventHandler = string.Format("gridTextBoxOnFocus('{0}');", Amount.ClientID);

Amount.Attributes.Add("onFocus", eventHandler);

TextBox AccountNo = (e.Item as GridEditableItem)["AccountNo"].Controls[0] as TextBox;

AccountNo.AutoPostBack = true;

AccountNo.TextChanged += new System.EventHandler(this.AccountNo_TextChanged);

}

protected void RadGrid1_PreRender(object sender, EventArgs e)

{

RadGrid1.Attributes.Add("onkeydown", "onKeyDown(this,event);");

int itemsCount = 0;

int columnsCount = 0;

StringBuilder builder = new StringBuilder();

// Attach the event handlers to the client side events of the TextBoxes.

foreach (GridDataItem item in RadGrid1.MasterTableView.Items)

{

if (item is GridDataItem)

{

columnsCount = 0;

for (int i = 2; i < RadGrid1.MasterTableView.RenderColumns.Length; i++)

{

GridColumn column = RadGrid1.MasterTableView.RenderColumns[i];

TextBox textBox = (item[column.UniqueName].Controls[0]) as TextBox;

if (textBox != null)

{

textBox.Attributes.Add("ondblclick", "cellDoubleClickFunction('" + textBox.ClientID + "');");

textBox.Attributes.Add("onclick", "cellClick('" + textBox.ClientID + "');");

}

if ((i == 2) || (i == 3) || (i == 4))

{

textBox.ReadOnly = true;

textBox.Attributes.Add("class", "readOnly");

}

columnsCount++;

}

itemsCount++;

}

if (RadGrid1.MasterTableView.Items.Count > 0)

{

RadGrid1.MasterTableView.GetColumn("ID").Visible = false;

RadGrid1.MasterTableView.GetColumn("ChequeID").Visible = false;

RadGrid1.MasterTableView.GetColumn("CustomerID").Visible = false;

}

RadScriptManager.RegisterStartupScript(Page, Page.GetType(), "init", "colls = " + columnsCount + ";rows=" + itemsCount + ";", true);

}

What I want to do is have on of the columns in the grid be a radcombobox rather than a simple textbox.

I already have a combo box on the page outside the grid and would like the same combobox (it can be a duplicate of the original one) in each grid row.

The reason I am creating the grid as such is because the user wants all the grid rows to be in edit mode so they dont have to click edit and save for each row, rather they change all the rows or add new ones and click save once.

My radcombox box already on the page is:

<telerik:RadComboBox ID="drpParentAccount" runat="server" Height="200px" Width="240px"

Filter="Contains" EmptyMessage="Choose Parent Account" MarkFirstMatch="true" ChangeTextOnKeyBoardNavigation="false"

DataTextField="Account" DataValueField="Account" OnItemDataBound="RadComboBoxParentAccount_ItemDataBound"

EnableLoadOnDemand="true" OnItemsRequested="RadComboBoxProduct_ItemsRequested"

AutoPostBack="true" DataSourceID="SqlDataSourceParentAccount"

style="top: 10px; left: 550px; position: absolute;">

<HeaderTemplate>

<table style="width: 240px" cellspacing="0" cellpadding="0">

<tr>

<td style="width: 60px;">

Number</td>

<td style="width: 180px;">

Namer</td>

</tr>

</table>

</HeaderTemplate>

<ItemTemplate>

<table style="width: 240px" cellspacing="0" cellpadding="0">

<tr>

<td style="width: 60px;">

<%# DataBinder.Eval(Container.DataItem, "Account") %>

</td>

<td style="width: 180px;">

<%# DataBinder.Eval(Container.DataItem, "AccountName") %>

</td>

</tr>

</table>

</ItemTemplate>

</telerik:RadComboBox>

I already have columns selected for Account and AccountName as textboxes in the Grid. But I want the Account column to be a dropdown similar to above.

Any help on how to get that going using PreRender.

Thanks,

Ads

3 Answers, 1 is accepted

answered on 14 Mar 2011, 05:09 PM

RadGridComboEdit.zip

Hi Adeel,

Please check the attachment to see how to bind the combobox and allow edit on all rows.

Best wishes,
Vasil
the Telerik team

Registration for Q1 2011 What’s New Webinar Week is now open. Mark your calendar for the week starting March 21st and book your seat for a walk through all the exciting stuff we ship with the new release!