I have a gridview which I used to display tabular data.
I want the users to edit the field values and save it.
Is there any way to add a textbox in place of bound field.
This is my gridview.
<asp:GridView ID="GridView1" runat="server" AutoGenerateColumns="False"
Height="186px" Width="325px">
<Columns>
</Columns>
</asp:GridView>
This is the code behind which populate the GridView
public List<DataControlField> columns = new List<DataControlField>();
public object DataSource { get; set; }
protected void Page_Init(object sender, EventArgs e)
{
for (int i = 0; i < 10; i++)
{
BoundField bf = new BoundField() ;
bf.HeaderText = "LastName" ;
bf.DataField = "LastName";
columns.Add(bf);
}
foreach (DataControlField col in columns)
{
GridView1.Columns.Add(col);
}
}
protected void Page_Load(object sender, EventArgs e)
{
List<Data> lastN = new List<Data>() ;
for(int i = 0 ; i < 50; i++ )
{
lastN.Add(new Data(i.ToString()));
}
GridView1.DataSource = lastN;
GridView1.DataBind();
}
}
I would like to suggest you to try listview, it allows you to edit the dynamic data, such as the content in textbox
You can use a GridView with EditTemplates. You can refer to this example for that.
It is possible to edit all rows of a GridView at the same time. Refer to this example.
You can optionally use Telerik's ASP.NET Data Grid that you can configure to work like excel using this example.
Related
Below is how my GridView code , since the datatable is a pivoted value so the number of columns cannot be predicted. So I am adding textbox dynamically through code.
<asp:GridView ID="gvData"
EmptyDataText="There are no data records to display."
runat="server" AutoGenerateColumns="false"
HeaderStyle-BackColor="#3AC0F2"
HeaderStyle-ForeColor="White" OnRowDataBound="gvData_RowDataBound" >
<RowStyle BorderColor="LightBlue" />
</asp:GridView>
protected void Page_Load(object sender, EventArgs e)
{
foreach (var item in columnNames)
{
TemplateField tfield = new TemplateField();
tfield.HeaderText = item;
gvData.Columns.Add(tfield);
}
gvData.DataSource = ds.Tables[0];
gvData.DataBind();}
protected void gvData_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
for (int i = 3; i < columnNames.Length; i++)
{
TextboxCount++;
TextBox txtName = new TextBox();
txtName.ID = "txt" + Convert.ToString(TextboxCount);
txtName.BorderStyle = BorderStyle.None;
txtName.Text = (e.Row.DataItem as DataRowView).Row[columnNames[i]].ToString();
e.Row.Cells[i].Controls.Add(txtName); }}}
Now when user try to change value in the textbox I have to validate that they only enter integer value.
Here I am not sure what has to be done.
You can use int.TyrParse method
Example
int number;
string s = "AA";
bool IsInteger = int.TryParse(s, out number);
You could use javascript function and that to textbox from code behind like:
// Add this gvData_RowDataBound , allownumbers is a javascript function
txtName.Attributes.Add("onkeypress", "javascript:return allownumbers(event);");
Or else if you are using .NET 4.5 version then try out this:
txtName.Attributes["type"] = "number";
I have been trying to Populate a DropDownList in my gridview with array elements . The array consists of the column names from another gridview .The array element seems to get the column names from its source but i can not figure out how to give that to the dropdownlist.Here is my code-:
public partial class Default2 : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
string[] excel = new string[250];
DataTable dtt = (DataTable)Session["griddata"]; //griddata is the gridview data from another page
for (int i = 0; i < dtt.Columns.Count; i++)
{
excel[i] = dtt.Columns[i].ColumnName;
}
Session["exceldata"] = excel;
ArrayList mylist= (ArrayList)Session["exceldata"];
DropDownList drd = (DropDownList)GridView2.FindControl("DrdDatabase");
drd.DataSource = mylist;
drd.DataTextField = "GridView";
drd.DataBind();
}
Thanks in Advance :)
Here is the logic which you can use to populate your dropdownlist.
->
Loop at the array.
{
For each item in array
{
add item to dropdownlist.items
}
}
Sorry for not providing the exact code as I dont have .net editor at my disposal right now but you can use the logic to implement it.
regards.
You could simply loop it and add the ListItems programmatically:
DropDownList drd = (DropDownList)GridView1.FindControl("DrdDatabase");
foreach(string colName in mylist)
drd.Items.Add(new ListItem( colName ));
However, are you sure that you find your DropDownList via GridView1.FindControl? I assume you get a NullRefernceException there. Then you need to show us where it actually is.
If it is in a TemplateField of the GridView you should use the RowDataBound event:
private ArrayList ExcelData
{
get {
object excel = Session["exceldata"];
if (excel == null) Session["exceldata"] = new ArrayList();
return (ArrayList)Session["exceldata"];
}
set {
Session["exceldata"] = value;
}
}
protected void GridView2_RowDataBound(object sender, GridViewRowEventArgs e)
{
if (e.Row.RowType == DataControlRowType.DataRow)
{
DropDownList ddl = (DropDownList)e.Row.FindControl("DrdDatabase");
foreach (string colName in ExcelData)
ddl.Items.Add(new ListItem(colName));
}
}
I created a gridview dynamically and added the AutoGenerateEditButton = true; property and i see that it adds the edit link to all the fields when it loads the table into the gridview. But when i click the edit button nothing happens, except for a postback. What am i doing wrong?
GridView gridData = new GridView();
gridData.ID = "test";
gridData.AutoGenerateEditButton = true;
gridData.RowEditing += (sender, e) => grid_RowEditing(tbl, e, sender);
gridData.DataSource = tbl;
gridData.DataBind();
protected void grid_RowEditing(DataTable tbl, GridViewEditEventArgs e, object sender)
{
((GridView)sender).EditIndex = e.NewEditIndex;
// call your databinding method here
((GridView)sender).DataSource = tbl ;
((GridView)sender).DataBind();
}
My guess is that because you are overwriting the grid with every postback by recreating it, the click is just ignored.
The suggested approach would be to create the invisible grid statically:
<asp:GridView .... Visible="false" />
and then just make it visible when needed. This approach (in contrast to dynamic creation) will save you from dozen of issues, most probably including the one you face.
Edit: if you really, really want to follow your route then my guess is that you just haven't specified your data key names so that the edit click carries no information on the clicked row.
gridData.DataKeyNames = new string[] { "ID" };
(if your primary key column name is ID)
I added a <p id="p" runat="server"> on client side and added that grid inside this control.
Here is my code.
I used SqlDataSource instead of Datatable, you can use it any one of it.
Hope it works for u..
protected void gridview()
{
GridView gridData = new GridView();
gridData.ID = "test";
gridData.AutoGenerateEditButton = true;
gridData.RowEditing += (sender, e) => grid_RowEditing(SqlDataSource1, e, sender);
gridData.DataSource = SqlDataSource1;
gridData.DataBind();
p.Controls.Add(gridData);
}
protected void grid_RowEditing(SqlDataSource tbl, GridViewEditEventArgs e, object sender)
{
((GridView)sender).EditIndex = e.NewEditIndex;
// call your databinding method here
((GridView)sender).DataSource = tbl;
((GridView)sender).DataBind();
}
2) I tried with datatable too, and its working.
here is my code.
protected void gridview()
{
DataTable dt = new DataTable();
dt.Columns.Add("id");
dt.Columns.Add("name");
for (int i = 0; i < 100; i++)
{
dt.Rows.Add(i.ToString(),"v"+i.ToString());
}
GridView gridData = new GridView();
gridData.ID = "test";
gridData.AutoGenerateEditButton = true;
gridData.RowEditing += (sender, e) => grid_RowEditing(dt, e, sender);
gridData.DataSource = dt;
gridData.DataBind();
p.Controls.Add(gridData);
}
protected void grid_RowEditing(DataTable tbl, GridViewEditEventArgs e, object sender)
{
((GridView)sender).EditIndex = e.NewEditIndex;
// call your databinding method here
((GridView)sender).DataSource = tbl;
((GridView)sender).DataBind();
}
I need to generate 3 DropDownList Boxes in a row Dynamically on ADD Button click event. Once the DDL is generated i should be able to assign Data source to it and also do DDL-selectedEventChanged functionality on them in c# asp.net.
Below link was exactly am looking for but i couldn't assign data source or i couldn't do any functionality
"Adding multiple DropDownLists with a button click"
any better Ideas please help
if i press Button i need to get 3 DDLs at a time, if i press again it should generate again, so number of clicks= no. of rows with three DDL's in each row
Here is the sample code. The only trick is that you need to load those dynamic controls again after post back. Otherwise, you won't be able to access those.
<asp:PlaceHolder runat="server" ID="PlaceHolder1"></asp:PlaceHolder>
<asp:Button runat="server" ID="AddButton" OnClick="AddButton_Click" Text="Add" />
private List<int> _controlIds;
private List<int> ControlIds
{
get
{
if (_controlIds == null)
{
if (ViewState["ControlIds"] != null)
_controlIds = (List<int>)ViewState["ControlIds"];
else
_controlIds = new List<int>();
}
return _controlIds;
}
set { ViewState["ControlIds"] = value; }
}
private List<string> DataSource
{
get { return new List<string> { "One", "Two", "Three" }; }
}
protected void Page_Load(object sender, EventArgs e)
{
if (IsPostBack)
{
var dataSource = DataSource;
foreach (int id in ControlIds)
{
var ddl = new DropDownList();
ddl.ID = id.ToString();
foreach (var data in dataSource)
ddl.Items.Add(new ListItem(data));
PlaceHolder1.Controls.Add(ddl);
}
}
}
protected void AddButton_Click(object sender, EventArgs e)
{
var dataSource = DataSource;
for (int i = 0; i < 3; i++)
{
var reqs = ControlIds;
int id = ControlIds.Count + 1;
reqs.Add(id);
ControlIds = reqs;
var ddl = new DropDownList();
ddl.ID = id.ToString();
foreach (var data in dataSource)
ddl.Items.Add(new ListItem(data));
PlaceHolder1.Controls.Add(ddl);
}
}
I found the tutorial to create a dynamic table and add rows:
http://geekswithblogs.net/dotNETvinz/archive/2009/06/29/faq-dynamically-adding-rows-in-asp-table-on-button-click.aspx
How can I read all rows in the table, and then the values of the textbox in the cells? The values are entered in a table in a database (SQL Server).
Can I continue to use C# and asp.net or do I have to use Javascript?
I hope someone will give me help.
This is the code:
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<title>Dynamic Adding of Rows in ASP Table Demo</title>
</head>
<body>
<form id="form1" runat="server">
<asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Add New Row" />
</form>
</body>
</html>
CODE BEHIND:
public partial class _Default1 : System.Web.UI.Page
{
//A global variable that will hold the current number of Rows
//We set the values to 1 so that it will generate a default Row when the page loads
private int numOfRows = 1;
protected void Page_Load(object sender, EventArgs e)
{
//Generate the Rows on Initial Load
if (!Page.IsPostBack)
{
GenerateTable(numOfRows);
}
}
protected void Button1_Click(object sender, EventArgs e)
{
if (ViewState["RowsCount"] != null)
{
numOfRows = Convert.ToInt32(ViewState["RowsCount"].ToString());
GenerateTable(numOfRows);
}
}
private void SetPreviousData(int rowsCount, int colsCount)
{
Table table = (Table)Page.FindControl("Table1");
if (table != null)
{
for (int i = 0; i < rowsCount; i++)
{
for (int j = 0; j < colsCount; j++)
{
//Extracting the Dynamic Controls from the Table
TextBox tb = (TextBox)table.Rows[i].Cells[j].FindControl("TextBoxRow_" + i + "Col_" + j);
//Use Request objects for getting the previous data of the dynamic textbox
tb.Text = Request.Form["TextBoxRow_" + i + "Col_" + j];
}
}
}
}
private void GenerateTable(int rowsCount)
{
//Creat the Table and Add it to the Page
Table table = new Table();
table.ID = "Table1";
Page.Form.Controls.Add(table);
//The number of Columns to be generated
const int colsCount = 3;//You can changed the value of 3 based on you requirements
// Now iterate through the table and add your controls
for (int i = 0; i < rowsCount; i++)
{
TableRow row = new TableRow();
for (int j = 0; j < colsCount; j++)
{
TableCell cell = new TableCell();
TextBox tb = new TextBox();
// Set a unique ID for each TextBox added
tb.ID = "TextBoxRow_" + i + "Col_" + j;
// Add the control to the TableCell
cell.Controls.Add(tb);
// Add the TableCell to the TableRow
row.Cells.Add(cell);
}
// And finally, add the TableRow to the Table
table.Rows.Add(row);
}
//Set Previous Data on PostBacks
SetPreviousData(rowsCount, colsCount);
//Sore the current Rows Count in ViewState
rowsCount++;
ViewState["RowsCount"] = rowsCount;
}
}
Since you're creating the table dynamically, you can't reference it like controls that are statically embedded on the page. To get a reference to the Table object you'll need to find it in the Page's ControlCollection and cast it out, just like in the example:
Table table = (Table)Page.FindControl("Table1");
The Table class contains a table row collection which you will then need to loop over. Each row in the row collection has a collection of cells, each of which will contain child controls (see: Controls property) which will be your textboxes.
Hi if you take look at SetPreviousData this function is trying to read previous textbox value but there is some thing wrong with it i have done following changes and it works fine
first of all the following code in SetPreviousData
Table table = (Table)Page.FindControl("Table1");
is always returning NULL because this function is not a recursive function and your table may be inside a container in your page so add following function to your code
private Control FindControlRecursive(Control root, string id)
{
if (root.ID == id)
{
return root;
}
foreach (Control c in root.Controls)
{
Control t = FindControlRecursive(c, id);
if (t != null)
{
return t;
}
}
return null;
}
and change the code
Table table = (Table)Page.FindControl("Table1");
to
Table table = FindControlRecursive(Page , "Table1") as Table;
in next step change the following code in SetPreviousData
tb.Text = Request.Form["TextBoxRow_" + i + "Col_" + j];
to
tb.Text = Request.Form[tb.UniqueID];
set break points and see the results if it's tough to you let me know to provide you a function which returns table data in a datatable
I think you must bind your table again at the Page_load event.For example if you are binding the table at View_Click button event,you have to call this method in Page_load event as View_Click(null,null).
<script type="text/javascript">
var StringToSend='';
function fncTextChanged(newvalueadded) {
if (StringToSend != '')
StringToSend = StringToSend + ';' + newvalueadded;
else
StringToSend = newvalueadded;
//alert(StringToSend); -- For Testing all values
// now store the value of StringToSend into hidden field ---- HFTEXTVALUES to access it from server side.
}
</script>
<asp:Button ID="Save" runat="server" onclick="SaveTextBoxValues_Click" Text="save" />
<asp:Button ID="Button1" runat="server" onclick="Button1_Click" Text="Add New Row" />
<asp:HiddenField ID="hfTextValues" runat="server" Visible="false" Value="" />
Server Side :
protected void Page_Load(object sender, EventArgs e)
{
//Generate the Rows on Initial Load
if (!Page.IsPostBack)
{
GenerateTable(numOfRows);
}
}
protected void Button1_Click(object sender, EventArgs e)
{
if (ViewState["RowsCount"] != null)
{
numOfRows = Convert.ToInt32(ViewState["RowsCount"].ToString());
GenerateTable(numOfRows);
}
}
protected void SaveTextBoxValues_Click(object sender, EventArgs e)
{
string AllTextBoxValues = hfTextValues.Value;
string[] EachTextBoxValue = AllTextBoxValues.Split('~');
//here you would get all values, EachTextBoxValue[0] gives value of first textbox and so on.
}
private void GenerateTable(int rowsCount)
{
//Creat the Table and Add it to the Page
Table table = new Table();
table.ID = "Table1";
Page.Form.Controls.Add(table);
//The number of Columns to be generated
const int colsCount = 3;//You can changed the value of 3 based on you requirements
// Now iterate through the table and add your controls
for (int i = 0; i < rowsCount; i++)
{
TableRow row = new TableRow();
for (int j = 0; j < colsCount; j++)
{
TableCell cell = new TableCell();
TextBox tb = new TextBox();
HiddenField hf = new HiddenField();
// Set a unique ID for each TextBox added
tb.ID = "tb" + i + j;
hf.ID = "hf" + i + j;
tb.Attributes.Add("onblur", "fncTextChanged(this.value);");
// Add the control to the TableCell
cell.Controls.Add(tb);
// Add the TableCell to the TableRow
row.Cells.Add(cell);
}
// And finally, add the TableRow to the Table
table.Rows.Add(row);
}
}
Let me know if you have any questions.
One more thing, if you wish to store the values and retrieve them later, the code would be modified accordingly.
reference for a dynamic table doesn't work well , blame microsoft ,
I use this :
Save inside a session List[YourObjectData] and every time you get into Page_Load , fill it the table
here is solution for number 2 :
somewhere inside Default.aspx
<div class="specialTable">
<asp:Table ID="Table1" runat="server" />
</div>
Code behind:
protected void Page_Load(object sender, EventArgs e)
{
FillDynamicTable();
if (!IsPostBack)
{
}
}
private void FillDynamicTable()
{
Table1.Rows.Clear(); // Count=0 but anyways
if (Session["Table1"] == null) return;
foreach (var data in Session["Table1"] as List<MyObject>)
{
AddRow(data);
}
}
private void AddRow(MyObject data)
{
var row = new TableRow { Height = 50 };
var cell = new TableCell();
var label = new Label { Text = data.something, Width = 150 };
cell.Controls.Add(label);
row.Cells.Add(cell);
Table1.Rows.Add(row);
}