I have a listview that displays a list of textboxes that get created on a button click. I would also like a label to be created next to each txtbox that would increment what is says from step x: to step x+1:
Do I need to create another listview control for this, or is there a much easier way (which I hope)?
Here is the current web code for my listview:
<tr align="center" valign="middle">
<td>
<asp:ListView ID="lvDynamicTextboxes" runat="server" ItemPlaceholderID="itemPlaceholder" onitemdatabound="lvDynamicTextboxes_ItemDataBound">
<LayoutTemplate>
<asp:PlaceHolder ID="itemPlaceholder" runat="server" />
</LayoutTemplate>
<ItemTemplate>
<asp:Label ID="lblStep" runat="server" Text="Step 1:" />
<asp:TextBox ID="txtStep" runat="server" TextMode="MultiLine" Rows="3" Width="300" style="margin-top:10px;" />
</ItemTemplate>
</asp:ListView>
<br /><asp:Button ID="btnAddNewStep" runat="server" Text="Add another step" onclick="btnAddNewStep_Click" style="margin-top:5px;" />
</td>
</tr>
And here is the code-behind
protected void btnAddNewStep_Click( object sender, EventArgs e )
{
this.UpdateDataSource();
this.IncrementTextboxCount();
this.BindListView();
}
private void BindListView()
{
//create an enumerable range based on the current count
List< string > dataSource = this.GetDataSource();
//bind the listview
this.lvDynamicTextboxes.DataSource = dataSource;
this.lvDynamicTextboxes.DataBind();
}
private void IncrementTextboxCount()
{
List< string > dataSource = this.GetDataSource();
dataSource.Add( string.Empty );
this.SetDataSource( dataSource );
}
private List< string > GetDataSource()
{
List< string > dataSource = null;
if ( ViewState[ "DataSource" ] != null )
dataSource = ( List< string > )ViewState[ "DataSource" ];
else
{
dataSource = new List< string >();
dataSource.Add( string.Empty );
ViewState[ "DataSource" ] = dataSource;
}
return dataSource;
}
private void UpdateDataSource()
{
List< string > dataSource = new List< string >();
foreach ( ListViewItem item in this.lvDynamicTextboxes.Items )
if ( item is ListViewDataItem )
{
TextBox txt = (TextBox)item.FindControl( "txtStep" );
dataSource.Add( txt.Text );
}
this.SetDataSource( dataSource );
}
protected void lvDynamicTextboxes_ItemDataBound( object sender, ListViewItemEventArgs e )
{
if ( e.Item is ListViewDataItem )
{
TextBox txt = (TextBox)e.Item.FindControl( "txtStep" );
txt.Text = ( (ListViewDataItem)e.Item ).DataItem.ToString();
}
}
private void SetDataSource( List< string > dataSource )
{
ViewState[ "DataSource" ] = dataSource;
}
EDIT::
Since there seems to be a bit of confusion, I'll try to clarify:
As of now, I have a textbox in a listview with a button underneath.
________
| txtbox |
|________|
_____
|_btn_|
When you click a button, it generates another text box, so clicking it twice results in this:
________
| txtbox |
|________|
________
| txtbox |
|________|
________
| txtbox |
|________|
_____
|_btn_|
These textboxes are to create steps in a process, so all I would like to do is add a generated label next to each generated textbox to say which step it is. So I want it to look like this:
________
["Step 1"] | txtbox |
|________|
________
["Step 2"] | txtbox |
|________|
________
["Step 3"] | txtbox |
|________|
_____
|_btn_|
And if they click the button again, then another label is generated with the text "Step 4"