JordanBlackler
asked on
Help with PlaceHolders and Aligning Controls
Hello all -
This is for the Web using C#
Yesterday i posted about creating controls dynamically and building tables. I decided to go a different direction.
I'm now using PlaceHolders. I'm creating 7 controls on a click of a button and everytime the user clicks the Add button another 7 controls are created. it consists of 3 labels. 3 textboxes and 1 button.
How it works right now, all the controls are created in one PlaceHolder and it looks fine when they hit the Add button once. But when the button is hit for the second time it shows 12 controls on one row and 2 controls on another row.
I would like it to show 7 controls per row, this way it is all aligned.
If that isn't possible, is there a way to add the controls to a new PlaceHolder everytime the Add button is clicked.
Also, when i click the Add button and fill out the three fields, then click the Add button again, the first field is blank but the other two fields still have the text i entered.
Thanks a lot in advance. My code is below.
protected void Page_Load(object sender, EventArgs e)
{
CreateControls();
}
protected void btnAdd_Click(object sender, EventArgs e)
{
int count = 0;
if (ViewState["count"] != null)
{
count = (int)ViewState["count"];
}
count++;
ViewState["count"] = count;
CreateControls();
}
private void CreateControls()
{
int count = 0;
if (ViewState["count"] != null)
{
count = (int)ViewState["count"];
}
while (PlaceHolder1.Controls.Cou nt < count * 7)
{
// -----INVOICE-----
//Control One
Label lblInvoice = new Label();
PlaceHolder1.Controls.Add( lblInvoice );
lblInvoice.ID = "lblInvoice" + PlaceHolder1.Controls.Coun t.ToString ();
lblInvoice.Text = "Invoice #:";
//Control Two
TextBox txtInvoice = new TextBox();
PlaceHolder1.Controls.Add( txtInvoice );
txtInvoice.ID = "txtInvoice:" + PlaceHolder1.Controls.Coun t.ToString ();
txtInvoice.Text = "";
txtInvoice.Height = 18;
// -----AMOUNT-----
//Control Three
Label lblAmount = new Label();
PlaceHolder1.Controls.Add( lblAmount) ;
lblAmount.ID = "lblAmount" + PlaceHolder1.Controls.Coun t.ToString ();
lblAmount.Text = "Amount:";
//Control Four
TextBox txtAmount = new TextBox();
PlaceHolder1.Controls.Add( txtAmount) ;
txtAmount.ID = "txtAmount" + PlaceHolder1.Controls.Coun t.ToString ();
txtAmount.Text = "";
txtAmount.Height = 18;
// -----DATE-----
//Control Five
Label lblDateRecieved = new Label();
PlaceHolder1.Controls.Add( lblDateRec ieved);
lblDateRecieved.ID = "lblDateRecieved" + PlaceHolder1.Controls.Coun t.ToString ();
lblDateRecieved.Text = "Date:";
//Control SIx
TextBox txtDateRecieved = new TextBox();
PlaceHolder1.Controls.Add( txtDateRec ieved);
txtDateRecieved.ID = "txtDateRecieved" + PlaceHolder1.Controls.Coun t.ToString ();
txtDateRecieved.Text = "";
txtDateRecieved.Height = 18;
//Control Seven
Button btnCalendar = new Button();
PlaceHolder1.Controls.Add( btnCalenda r);
btnCalendar.ID = "btnCalendar" + PlaceHolder1.Controls.Coun t.ToString ();
btnCalendar.BackColor = System.Drawing.Color.White ;
btnCalendar.CssClass = "calendarImage";
btnCalendar.Width = 27;
}
}
This is for the Web using C#
Yesterday i posted about creating controls dynamically and building tables. I decided to go a different direction.
I'm now using PlaceHolders. I'm creating 7 controls on a click of a button and everytime the user clicks the Add button another 7 controls are created. it consists of 3 labels. 3 textboxes and 1 button.
How it works right now, all the controls are created in one PlaceHolder and it looks fine when they hit the Add button once. But when the button is hit for the second time it shows 12 controls on one row and 2 controls on another row.
I would like it to show 7 controls per row, this way it is all aligned.
If that isn't possible, is there a way to add the controls to a new PlaceHolder everytime the Add button is clicked.
Also, when i click the Add button and fill out the three fields, then click the Add button again, the first field is blank but the other two fields still have the text i entered.
Thanks a lot in advance. My code is below.
protected void Page_Load(object sender, EventArgs e)
{
CreateControls();
}
protected void btnAdd_Click(object sender, EventArgs e)
{
int count = 0;
if (ViewState["count"] != null)
{
count = (int)ViewState["count"];
}
count++;
ViewState["count"] = count;
CreateControls();
}
private void CreateControls()
{
int count = 0;
if (ViewState["count"] != null)
{
count = (int)ViewState["count"];
}
while (PlaceHolder1.Controls.Cou
{
// -----INVOICE-----
//Control One
Label lblInvoice = new Label();
PlaceHolder1.Controls.Add(
lblInvoice.ID = "lblInvoice" + PlaceHolder1.Controls.Coun
lblInvoice.Text = "Invoice #:";
//Control Two
TextBox txtInvoice = new TextBox();
PlaceHolder1.Controls.Add(
txtInvoice.ID = "txtInvoice:" + PlaceHolder1.Controls.Coun
txtInvoice.Text = "";
txtInvoice.Height = 18;
// -----AMOUNT-----
//Control Three
Label lblAmount = new Label();
PlaceHolder1.Controls.Add(
lblAmount.ID = "lblAmount" + PlaceHolder1.Controls.Coun
lblAmount.Text = "Amount:";
//Control Four
TextBox txtAmount = new TextBox();
PlaceHolder1.Controls.Add(
txtAmount.ID = "txtAmount" + PlaceHolder1.Controls.Coun
txtAmount.Text = "";
txtAmount.Height = 18;
// -----DATE-----
//Control Five
Label lblDateRecieved = new Label();
PlaceHolder1.Controls.Add(
lblDateRecieved.ID = "lblDateRecieved" + PlaceHolder1.Controls.Coun
lblDateRecieved.Text = "Date:";
//Control SIx
TextBox txtDateRecieved = new TextBox();
PlaceHolder1.Controls.Add(
txtDateRecieved.ID = "txtDateRecieved" + PlaceHolder1.Controls.Coun
txtDateRecieved.Text = "";
txtDateRecieved.Height = 18;
//Control Seven
Button btnCalendar = new Button();
PlaceHolder1.Controls.Add(
btnCalendar.ID = "btnCalendar" + PlaceHolder1.Controls.Coun
btnCalendar.BackColor = System.Drawing.Color.White
btnCalendar.CssClass = "calendarImage";
btnCalendar.Width = 27;
}
}
ASKER
Thanks for the response.
Do you think you can plug it into my code above.
When i tried i got this error:
"Failed to load viewstate. The control tree into which viewstate is being loaded must match the control tree that was used to save viewstate during the previous request. For example, when adding controls dynamically, the controls added during a post-back must match the type and position of the controls added during the initial request"
Do you think you can plug it into my code above.
When i tried i got this error:
"Failed to load viewstate. The control tree into which viewstate is being loaded must match the control tree that was used to save viewstate during the previous request. For example, when adding controls dynamically, the controls added during a post-back must match the type and position of the controls added during the initial request"
why don't you post the code that you have with my code in it and i'll tell you what to change. That way I can see all your variables and field declarations in the proper context.
ASKER
Am i supposed to add this section for every control i'm creating? I'm a little bit lost i think.
//Loop starts here to print controls
tableInfo = new Literal();
tableInfo.Text = "<tr><td>";
PlaceHolderControl.Control s.Add(tabl eInfo);
PlaceHolderControl.Control s.Add(MyFi rstTextBox );
tableInfo = new Literal();
tableInfo.Text = "</td><td>";
//Loop starts here to print controls
tableInfo = new Literal();
tableInfo.Text = "<tr><td>";
PlaceHolderControl.Control
PlaceHolderControl.Control
tableInfo = new Literal();
tableInfo.Text = "</td><td>";
ASKER CERTIFIED SOLUTION
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
ASKER
I get an error when i click the Add button the second time.
"Failed to load viewstate. The control tree into which viewstate is being loaded must match the control tree that was used to save viewstate during the previous request. For example, when adding controls dynamically, the controls added during a post-back must match the type and position of the controls added during the initial request"
protected void Page_Load(object sender, EventArgs e)
{
CreateControls();
}
protected void btnAdd_Click(object sender, EventArgs e)
{
int count = 0;
if (ViewState["count"] != null)
{
count = (int)ViewState["count"];
}
count++;
ViewState["count"] = count;
CreateControls();
}
private void CreateControls()
{
int count = 0;
if (ViewState["count"] != null)
{
count = (int)ViewState["count"];
}
Literal tableInfo = new Literal(); //////// your code
tableInfo.Text = "<table>"; ////////// your code
PlaceHolder1.Controls.Add( tableInfo) ;
while (PlaceHolder1.Controls.Cou nt < count * 7)
{
tableInfo = new Literal();////////// your code
tableInfo.Text = "<tr><td>";////////// your code
PlaceHolder1.Controls.Add( tableInfo) ;
// -----INVOICE-----
Label lblInvoice = new Label();
PlaceHolder1.Controls.Add( lblInvoice );
lblInvoice.ID = "lblInvoice" + PlaceHolder1.Controls.Coun t.ToString ();
lblInvoice.Text = "Invoice #:";
TextBox txtInvoice = new TextBox();
PlaceHolder1.Controls.Add( txtInvoice );
txtInvoice.ID = "txtInvoice:" + PlaceHolder1.Controls.Coun t.ToString ();
txtInvoice.Text = "";
txtInvoice.Height = 18;
txtInvoice.Width = 100;
// -----AMOUNT-----
Label lblAmount = new Label();
PlaceHolder1.Controls.Add( lblAmount) ;
lblAmount.ID = "lblAmount" + PlaceHolder1.Controls.Coun t.ToString ();
lblAmount.Text = "Amount:";
TextBox txtAmount = new TextBox();
PlaceHolder1.Controls.Add( txtAmount) ;
txtAmount.ID = "txtAmount" + PlaceHolder1.Controls.Coun t.ToString ();
txtAmount.Text = "";
txtAmount.Height = 18;
txtAmount.Width = 100;
// -----DATE-----
Label lblDateRecieved = new Label();
PlaceHolder1.Controls.Add( lblDateRec ieved);
lblDateRecieved.ID = "lblDateRecieved" + PlaceHolder1.Controls.Coun t.ToString ();
lblDateRecieved.Text = "Date:";
TextBox txtDateRecieved = new TextBox();
PlaceHolder1.Controls.Add( txtDateRec ieved);
txtDateRecieved.ID = "txtDateRecieved" + PlaceHolder1.Controls.Coun t.ToString ();
txtDateRecieved.Text = "";
txtDateRecieved.Height = 18;
txtDateRecieved.Width = 100;
Button btnCalendar = new Button();
PlaceHolder1.Controls.Add( btnCalenda r);
btnCalendar.ID = "btnCalendar" + PlaceHolder1.Controls.Coun t.ToString ();
btnCalendar.BackColor = System.Drawing.Color.White ;
btnCalendar.CssClass = "calendarImage";
btnCalendar.Width = 27;
tableInfo = new Literal();////////// your code
tableInfo.Text = "</td></tr>";////////// your code
}
}
"Failed to load viewstate. The control tree into which viewstate is being loaded must match the control tree that was used to save viewstate during the previous request. For example, when adding controls dynamically, the controls added during a post-back must match the type and position of the controls added during the initial request"
protected void Page_Load(object sender, EventArgs e)
{
CreateControls();
}
protected void btnAdd_Click(object sender, EventArgs e)
{
int count = 0;
if (ViewState["count"] != null)
{
count = (int)ViewState["count"];
}
count++;
ViewState["count"] = count;
CreateControls();
}
private void CreateControls()
{
int count = 0;
if (ViewState["count"] != null)
{
count = (int)ViewState["count"];
}
Literal tableInfo = new Literal(); //////// your code
tableInfo.Text = "<table>"; ////////// your code
PlaceHolder1.Controls.Add(
while (PlaceHolder1.Controls.Cou
{
tableInfo = new Literal();////////// your code
tableInfo.Text = "<tr><td>";////////// your code
PlaceHolder1.Controls.Add(
// -----INVOICE-----
Label lblInvoice = new Label();
PlaceHolder1.Controls.Add(
lblInvoice.ID = "lblInvoice" + PlaceHolder1.Controls.Coun
lblInvoice.Text = "Invoice #:";
TextBox txtInvoice = new TextBox();
PlaceHolder1.Controls.Add(
txtInvoice.ID = "txtInvoice:" + PlaceHolder1.Controls.Coun
txtInvoice.Text = "";
txtInvoice.Height = 18;
txtInvoice.Width = 100;
// -----AMOUNT-----
Label lblAmount = new Label();
PlaceHolder1.Controls.Add(
lblAmount.ID = "lblAmount" + PlaceHolder1.Controls.Coun
lblAmount.Text = "Amount:";
TextBox txtAmount = new TextBox();
PlaceHolder1.Controls.Add(
txtAmount.ID = "txtAmount" + PlaceHolder1.Controls.Coun
txtAmount.Text = "";
txtAmount.Height = 18;
txtAmount.Width = 100;
// -----DATE-----
Label lblDateRecieved = new Label();
PlaceHolder1.Controls.Add(
lblDateRecieved.ID = "lblDateRecieved" + PlaceHolder1.Controls.Coun
lblDateRecieved.Text = "Date:";
TextBox txtDateRecieved = new TextBox();
PlaceHolder1.Controls.Add(
txtDateRecieved.ID = "txtDateRecieved" + PlaceHolder1.Controls.Coun
txtDateRecieved.Text = "";
txtDateRecieved.Height = 18;
txtDateRecieved.Width = 100;
Button btnCalendar = new Button();
PlaceHolder1.Controls.Add(
btnCalendar.ID = "btnCalendar" + PlaceHolder1.Controls.Coun
btnCalendar.BackColor = System.Drawing.Color.White
btnCalendar.CssClass = "calendarImage";
btnCalendar.Width = 27;
tableInfo = new Literal();////////// your code
tableInfo.Text = "</td></tr>";////////// your code
}
}
ASKER
I added the below section of the code inside the loop rather then outside the loop and it works now.
Literal tableInfo = new Literal();
tableInfo.Text = "<table>";
PlaceHolder1.Controls.Add( tableInfo) ;
The only problem now is that the first textbox of each row doesn't hold the text when i click the Add button. The two other textboxes keep the data.
Any ideas?
Thanks for your help.
Literal tableInfo = new Literal();
tableInfo.Text = "<table>";
PlaceHolder1.Controls.Add(
The only problem now is that the first textbox of each row doesn't hold the text when i click the Add button. The two other textboxes keep the data.
Any ideas?
Thanks for your help.
ASKER
Nevermind, i got it to work. I had to add the last section of the code to the placeholder
Literal tableInfo = new Literal();
tableInfo.Text = "<table>";
PlaceHolderControl.Control
//Loop starts here to print controls
tableInfo = new Literal();
tableInfo.Text = "<tr><td>";
PlaceHolderControl.Control
PlaceHolderControl.Control
tableInfo = new Literal();
tableInfo.Text = "</td><td>";
//repeat as above and end loop.