Develop Reference

How to include html elements inside a webcontrol such as a TableCell in C#

I am writing a code in webforms to add rows to a table after a button click. and inside some cells i need add html elements like textbox and dropdows,
protected void LinkButton1_Click(object sender, EventArgs e)
{
TableRow row = new TableRow();
TableCell cell1 = new TableCell();
cell1.Text = "<input type=\"text\"></input>";
row.Cells.Add(cell1);
//proptable is the table id
PropTable.Rows.Add(row);
}
it works if i write like this.
but is there a more accurate way to do this?
any help is appreciated.

You can add Controls to TextBox easily like this:
protected void LinkButton1_Click(object sender, EventArgs e)
{
TableRow row = new TableRow();
TableCell cell1 = new TableCell();
TextBox textbox = new TextBox();
textbox.Text = "Testing...";
//cell1.Text = "<input type=\"text\"></input>";
cell1.Controls.Add(textbox);
row.Cells.Add(cell1);
//proptable is the table id
PropTable.Rows.Add(row);
}

Create a Header and Sub-Header in Gridview

This is my desired output
However based on my code this is the current output
Here are my codes
protected void grdVESONV_RowCreated(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.Header)
{
GridView HeaderGrid = (GridView)sender;
GridViewRow HeaderGridRow = new GridViewRow(0, 0, DataControlRowType.Header, DataControlRowState.Insert);
TableCell HeaderCell = new TableCell();
HeaderCell.Text = "Header 4";
HeaderCell.ColumnSpan = 2;
HeaderGridRow.Cells.Add(HeaderCell);
grdVESONV.Controls[0].Controls.AddAt(0, HeaderGridRow);
}
}

This can be implemented by writing an event, OnDataBound as protected void OnDataBound(object sender, EventArgs e) and use the RowSpan wherever is needed.

GridViewRow Headers placed above each other

I am working on ASP.NET C#. I am populating gridview with data from database. There are columns to the GridView that is been bound with DataTable. I ant to group these columns with Header Rows. I tried to add these Header Rows to a GridView as the following (Sample code):
I tried manipulating with row index but nothing happened.
protected void AddHeaders()
{
GridViewRow vesselInfoRow = new GridViewRow(1, 0, DataControlRowType.Header, DataControlRowState.Insert);
TableCell vesselInfotc = new TableCell();
vesselInfotc.Text = "Vessel Information ";
vesselInfotc.Style.Add("text-align", "center");
vesselInfotc.Style.Add("font-size", "medium");
vesselInfotc.Style.Add("font-weight", "bold");
vesselInfotc.Style.Add("background-color", "#b7dee8");
vesselInfotc.Style.Add("color", "black");
vesselInfotc.ColumnSpan = 4;
vesselInfoRow.Cells.Add(vesselInfotc);
this.BerthScoreCardGridView.Controls[0].Controls.AddAt(0, vesselInfoRow);
//
GridViewRow vesselArrivalRow = new GridViewRow(1, 0, DataControlRowType.Header, DataControlRowState.Insert);
TableCell vesselArrivaltc = new TableCell();
vesselArrivaltc.Text = "Vessel Arrival ";
vesselArrivaltc.Style.Add("text-align", "center");
vesselArrivaltc.Style.Add("font-size", "medium");
vesselArrivaltc.Style.Add("font-weight", "bold");
vesselArrivaltc.Style.Add("background-color", "#b7dee8");
vesselArrivaltc.Style.Add("color", "black");
vesselArrivaltc.ColumnSpan = 2;
vesselArrivalRow.Cells.Add(vesselArrivaltc);
this.BerthScoreCardGridView.Controls[0].Controls.AddAt(0, vesselArrivalRow);
}
However the rows are placed above each other as the following:
How can i place them horizontally next to each other. Appreciate your help.

You should add all the cells to the same row and add that single row to the GridView:
protected void AddHeaders()
{
GridViewRow topHeaderRow = new GridViewRow(1, 0, DataControlRowType.Header, DataControlRowState.Insert);
TableCell vesselInfotc = new TableCell();
vesselInfotc.Text = "Vessel Information ";
...
vesselInfotc.ColumnSpan = 4;
topHeaderRow.Cells.Add(vesselInfotc);
TableCell vesselArrivaltc = new TableCell();
vesselArrivaltc.Text = "Vessel Arrival ";
...
vesselArrivaltc.ColumnSpan = 2;
topHeaderRow.Cells.Add(vesselArrivaltc);
// Add the other cells here
...
BerthScoreCardGridView.Controls[0].Controls.AddAt(0, topHeaderRow);
}
And call your function in the PreRender event of the GridView:
void BerthScoreCardGridView_PreRender(object sender, EventArgs e)
{
AddHeaders();
}

How to add Dynamic Field in Dynamic Page in ASP.NET in C#

I want to add one Dynamic Field as "ADD MORE SKILLS" which shows some Textbox and Label will come on clicking this link. You can see this kind of example on some Shine.com, TimesJob etc.....

Here is Something to start with. Modify According to your need. Create a new button and onclick of button create the new controls dynamically. I have created a label and textbox dynamically in the below mentioned code
ASP Button
<asp:Button ID="AddMoreSkills" runat="server" Text="Add More Skills"
onclick="AddMoreSkills_Click" />
OnClick event in C#
protected void AddMoreSkills_Click(object sender, EventArgs e)
{
Table tblmain = new Table();
tblmain.ID = "tblmain";
tblmain.Width = Unit.Percentage(100);
tblmain.Attributes.CssStyle.Add("margin-top", "5px");
tblmain.Attributes.CssStyle.Add("margin-bottom", "5px");
TableCell tblTCell;
TableRow tblRow = new TableRow();
TableCell tblCell = new TableCell();
tblRow = new TableRow();
//Create Label Dynamically
tblCell = new TableCell();
Label lblTown = new Label();
lblTown.ID = "lblSkill";
lblTown.Text = "Skill";
//Add label to table cell
tblCell.Controls.Add(lblTown);
tblRow.Cells.Add(tblCell);
//Create TextBox Dynamically
TextBox txtSkill = new TextBox();
txtSkill.ID = "txtSkill";
//Add TextBox to table cell
tblTCell = new TableCell();
tblTCell.Controls.Add(txtSkill);
tblRow.Cells.Add(tblTCell);
tblmain.Rows.Add(tblRow);
form1.Controls.Add(tblmain);
}

Click EventHandler not firing

My newly created button in my gridviewrow is not firing its EventHandler or the RowCmmand Event and then when the page Reload after pressing the Button newly added row is missing probably because I can't call my BindData method. I have removed the Click eventHandler from the Button and just used the OnRowCommand Event and I still am getting nothing
protected void CustomGridView_DataBound(object sender, EventArgs e)
{
int count = ((GridView)sender).Rows.Count;
GridViewRow row = new GridViewRow(-1, -1, DataControlRowType.DataRow, DataControlRowState.Insert);
TableCell cell = new TableCell();
Button button = new Button();
button.Text = "Insert";
button.ID = "Insert";
button.CommandName = "Insert";
button.Click += new EventHandler(insertButton_Click);
cell.Controls.Add(button);
row.Cells.Add(cell);
for (int i = 0; i < ((GridView)sender).Columns.Count; i++)
{
cell = new TableCell();
cell.Controls.Add(new TextBox { ID = "Text" + i });
row.Cells.Add(cell);
}
Table table = ((GridView)sender).Rows[0].Parent as Table;
table.Rows.AddAt(count + 1, row);
}
protected void insertButton_Click(object sender, EventArgs e)
{
lblInsert.Text = "Hello World";
}
protected void CustomGridView1_RowCommand(object sender, GridViewCommandEventArgs e)
{
if (e.CommandName == "Insert")
{
lblInsert.Text = "Hello World";
}
}

Remove the button.Click += new EventHandler(insertButton_Click); statement from your code. The RowCommand event of GridView controll will be fired when button is pressed. For more info - How to: Respond to Button Events in a GridView Control.

You need to attach to the grid's RowCommand event before the databound. Do it on the constructor or Init event of the page or usercontrol, not in the databound. In the databound you will set the CommandName and CommandArgument properties.
Hope it helps.