ContentPlaceHolder wrapperCPH = (ContentPlaceHolder)this.Master.FindControl("ContentPlaceHolder1");
HtmlTable tblCumulativeCredits = (HtmlTable)wrapperCPH.FindControl("tblCumulativeCredits");
//If your table is not inside of a ContentPlaceHolder, you can just test with "this.FindControl("yourHTMLTableID");
HtmlTableRow tableRow = new HtmlTableRow();
HtmlTableCell tableCellAmount = new HtmlTableCell();
HtmlTableCell tableCellCurrency = new HtmlTableCell();
tableCellAmount.InnerText = item.amount.ToString();
tableCellCurrency.InnerText = item.currencyCode.code;
tableRow.Cells.Add(tableCellAmount);
tableRow.Cells.Add(tableCellCurrency);
tableRow.Cells.Add(tableCellCurrency);
tblCumulativeCredits.Rows.Add(tableRow);
HTML:
<table id="tblCumulativeCredits" runat="server">
<tr>
<th class="th">Amount</th>
<th class="th">Currency1</th>
<th class="th">Currency2</th>
</tr>
</table>
Now imagine I'm adding rows using this code sample in a loop and I know that my Currency1 = Currency2 in some case. So I'm using same Cell object as the above example. But there goes something interesting, if I add same currencies like the example; it only adds the first one, the third cell (Currency3) is empty.
It only adds the second currency if I create a new Cell instance, and add it:
tableRow.Cells.Add(tableCellAmount);
tableRow.Cells.Add(tableCellCurrency1);
tableRow.Cells.Add(tableCellCurrency2);
I think this is the first time I saw that an "Add()" method is working this way. Shouldnt it be creating a new instance of the given parameter (cell object) under the hood? I'd appreciate if anyone can explain what is the logic behind this? Thank you
I think it has nothing to do with the implementation af the "Add" method, instead I think this happens during the rendering.
Just remember that you are adding the same instance two times and that not only means the value of the cell (maybe also some kind of reference that exmplain the "overwriting" behavior).
So, you better create a new instance.
Cheers
Related
I am looking for a way to add list items to the same column, not separate columns. However I am not sure how to make it appear in vertical line instead of horizontal.
The way I have it now is:
#foreach (var item in result.NumberList)
{
<td class="col">#item</td>
}
So to visualize it, this is how it looks:
Column
number number2 number3
And I want it to look like that:
Column
number
number2 ----All the numbers should appear vertically in the same row.
number3
Thanks In Advance
You should do :
#foreach (var item in result.NumberList)
{
<tr>
<td class="col">#item</td>
</tr>
}
tr elements create a new table row.
You should search for HTML tables.
I'm using Archetype property editor and trying to grab only the first fieldset using foreach:
foreach (var fieldset in Umbraco.Content(5369).GetPropertyValue<Archetype.Models.ArchetypeModel>("myProperty"))
{
var icon = Umbraco.TypedMedia(fieldset .GetValue("icon"));
<img src="#icon.Url" />
<span>#fieldset.GetValue("iconTitle")</span>
}
Fieldset is of type {Archetype.Models.ArchetypeFieldsetModel}.
How can I get only the first fieldset ?
EDIT Tried:
var fieldset = Umbraco.Content(5369).GetPropertyValue<Archetype.Models.ArchetypeModel>("hotelFacilitesIcons").Fieldsets;
This gives me Archetype.Models.ArchetypeModel.Fieldsets' is inaccessible due to its protection level
Tried:
var fieldset = Umbraco.Content(5369).GetPropertyValue<Archetype.Models.ArchetypeModel>("myPropertyAlias");
var facility = fieldset.GetPropertyValue<List<Archetype.Models.ArchetypeFieldsetModel>>("myFieldSetAlias");
This gives me: 'Archetype.Models.ArchetypeModel' does not contain a definition for 'GetPropertyValue' from second line
I'll have a stab at perhaps trying to point you in the right direction. Looking at a previous project I have been involved in there is a Archetype.Models.ArchetypeFieldsetModel type so perhaps your content property might return a collection of Archetype.Models.ArchetypeFieldsetModel instead of Archetype.Models.ArchetypeModel?
E.g.
var fieldset = Umbraco.Content(5369).GetPropertyValue<List<Archetype.Models.ArchetypeFieldsetModel>>("myProperty").FirstOrDefault();
var icon = Umbraco.TypedMedia(fieldset .GetValue("icon"));
<img src="#icon.Url" />
<span>#fieldset.GetValue("iconTitle")</span>
I have sort of done the same thing in my case wanted to make sure the first archetype has got its first value set before getting all the others so how i got around it was by creating a var with the archetypes (which will give you a list fo one or more) then get the first one and check its value like below;
var contentSectionArchtype = Model.Content.GetPropertyValue<ArchetypeModel>("myArchetypeAlias");
var firstSection = contentSectionArchtype.First();
then the first section was always the first archetype which i would then check its first value before looping through all of them, hope that helps.
I need to add <thead> tags to my loop somehow. The tableHEaderRow class only uses <tr><th> tags, and I need them nested in a <thead> tag for styling purposes.
I have tried using a variety of methods including string writer, and literal controls but I can't seem to get it to work.
TableHeaderRow thr = new TableHeaderRow();
tbl.Controls.Add(new LiteralControl("<thead>")); // This is the line I need to add
foreach (DataColumn col in dt.Columns)
{
TableHeaderCell th = new TableHeaderCell();
th.Text = col.Caption;
thr.Controls.Add(th);
}
tbl.Controls.Add(new LiteralControl("</thead>")); // This is the line I need to add
tbl.Controls.Add(thr);
...
...
tbl.RenderControl(w);
tableString = sw.ToString();
// Then my aspx page displays my tableString variable.
What other ways Can I try to add the <thead> tags into my loop manually?
I am using System.Web.UI.WebControls.
You set a TableRow control as being in a <thead> with the TableSelection property.
For example: <asp:TableRow TableSection="TableHeader"/> will generate a TableRow control in the <thead> section of the table.
Dynamically, you can also set rowControl.TableSection = TableRowSection.TableHeader;
The three options are TableHeader, TableBody and TableFooter.
I use jquery DataTable in my MVC3 project. The table is dynamically generated through code behind. The only thing (so far) that I have troubles with, is the tbody.
I want to add a tbody section with ID, without any rows, from code behind.
I've been looking a lot, and the best thing I got is:
TableRow tb = new TableRow();
tb.TableSection = TableRowSection.TableBody;
tb.ID = "Body";
But that way, I get a row in the tbody section, with one row with the id..
What I want to get is:
<tbody id="Body"></tbody>
How can I get that result from code behind?
Thanks
Such thing is not possible with the generic Table control, it simply doesn't support giving ID to its <tbody>.
What you can do though is assign the desired ID as custom attribute of the table:
Table1.Attributes["data-tbodyid"] = "Body";
Then using jQuery assign this on the fly to the table's <tbody>:
$(document).ready(function () {
$("table").each(function () {
var tbodyId = $(this).data("tbodyid");
if (tbodyId && tbodyId.length > 0)
$(this).find("tbody").eq(0).attr("id", tbodyId);
});
});
I ended up using HtmlGenericControl:
HtmlGenericControl tb = new HtmlGenericControl("tbody");
tb.ID = grid.GridBodyName;
Of course, the table itself, the header, the footer and its cells should also be HtmlGenericControl.
Adding the body to the table, and the cells to the header\footer should be done that way:
HTMLTable.Controls.Add(tb);
My code is below. I want to add space between cells in tableCell()
something the equivalent of
<td></td> <td></td>
I am NOT looking for cellpadding or cellspacing because they both add space between the left cell border and the left table border (wall); I want to add space between two CELLS, not the table and the cell;
protected void Page_Init(object sender, EventArgs e)
{
Table tb = new Table();
tb.ID = "tb1";
for (int i = 0; i < iCounter; i++)
{
TableRow tr = new TableRow();
TextBox tbox = new TextBox();
tbox.ID = i.ToString();
TableCell tc = new TableCell();
tc.Controls.Add(tbox);
tr.Cells.Add(tc);
tb.Rows.Add(tr);
}
pnlScheduler.Controls.Add(tb);
}
Any ideas?
Try this:
TableCell tc = new TableCell();
HtmlGenericControl div = new HtmlGenericControl("div");
div.Style.Add("padding-left", "5px");
div.Style.Add("padding-right", "5px");
div.Controls.Add(tbox);
tc.Controls.Add(div);
tr.Cells.Add(tc);
tb.Rows.Add(tr);
An alternative might be this (I modified your code and added a label, which you can add alternate to every "tc.Controls.Add(tbox);"
protected void Page_Init(object sender, EventArgs e)
{
Table tb = new Table();
tb.ID = "tb1";
for (int i = 0; i < iCounter; i++)
{
TableRow tr = new TableRow();
TextBox tbox = new TextBox();
TextBox tLabel = new Label();
tbox.ID = i.ToString();
tLabel.width = 10;
TableCell tc = new TableCell();
tc.Controls.Add(tbox);
tc.Controls.Add(tLabel);
tc.Controls.Add(tbox);
tc.Controls.Add(tLabel);
tc.Controls.Add(tbox);
tc.Controls.Add(tLabel);
tr.Cells.Add(tc);
tb.Rows.Add(tr);
}
pnlScheduler.Controls.Add(tb);
}
*edit
My apologies for the margin, I don't think it is possible with margins, however I was able to create a css that can be applied to the middle cells give them padding on both the left and right sides.
but to get around the fact that the first and last elements don't push out against the wall of the table you have to apply the class to only the middle td's
example of css code
table
{
border:1px solid black;
border-collapse: collapse;
table-layout: fixed;
}
td.middle
{
border:1px solid black;
padding-left: 20px;
padding-right: 20px;
}
and then your middle td's would be created with the <td class="middle"></td>
however to convert this type of code to c# I'm not entirely sure. I will keep looking on how to apply this class to only specific elements, but your best bet would be to create a flag that checks the element to make sure that they aren't the first or last ones in the table, unless you are adding them manually then you just add the class manually as needed.
However might I suggest that if this is for page layout, your better off having css do the work for you instead of using table design. But if it's to show data in a table format then never mind, I said nothing.
Hope this helps. will post if I find anything else.
you could always add "empty" cells of the desired with.
For giving space between the table cells we have to use table's cellpadding and cellspacing property.
<table cellspacing="1" cellpadding="2">
</table>
<TABLE CELLSPACING="X">
The X in the line, is replaced with the number of pixels you want between the cells.
<TABLE CELLPADDING="X">
The X in the line, is replaced with the number of pixels you want between the text and cell edge.
When you're ready to add two cells with this spacing, create a table instead; with one row and two td's like:
<table cellspacing="2"><tr><td>stuff</td><td>more stuff></td></tr></table>
Apply a left margin to the table's td (except the last one in each row).
You can do it by assigning a common class, or by applying a class that reset the margin only to the last td.
You can use jQuery either and inject margin, but doing it via css only is cleaner.