How to convert Flask {{ }} {% %} syntax into ASP.NET equivalent - c#

I wrote some code in Flask that I'm trying to convert into ASP.NET as that is what the larger website is written in, and I'm not sure how to convert this simple syntax from Flask to ASP.NET.
<table class="table">
<tr>
<td> First Name </td>
<td> Last Name </td>
</tr>
{% for i in range(5) %}
<tr>
<td id="fn_{{i}}">{{i}}</td>
<td id="ln_{{i}}">{{i}}</td>
</tr>
{% endfor %}
</table>
What is the C# equivalent of {% and {{ in this context? I've seen that <% %> might be it, but I'm not sure how to use it. I've tried the following, but the variable "i" goes out of scope when I try and use it.
<table class="table">
<tr>
<td> First Name </td>
<td> Last Name </td>
</tr>
<% for (int i=0;i<5;i++) %>
<tr>
<td id="fn_<% i %>"><% i %></td>
<td id="ln_<% i %>"><% i %></td>
</tr>
</table>

You just need to add some parentheses. The missing brackets is why your variable goes out of scope.
<table class="table">
<tr>
<td> First Name </td>
<td> Last Name </td>
</tr>
<% for (int i=0;i<5;i++) { %> <!-- added parenthesis here -->
<tr>
<td id="fn_<%= i %>"><%= i %></td>
<td id="ln_<%= i %>"><%= i %></td>
</tr>
<% } %> <!-- and here -->
</table>

You use it like this. But I'm not a fan. The code becomes hard to read. If you use Webforms better use a GridView or Repeater. In Razor it becomes much better to implement a for-loop inline.
<table class="table">
<tr>
<td>First Name </td>
<td>Last Name </td>
</tr>
<% for (int i = 0; i < 5; i++) { %>
<tr>
<td id="fn_<%= i %>"><%= i %></td>
<td id="ln_<%= i %>"><%= i %></td>
</tr>
<% } %>
</table>

Related

Implementing Different Font Styles in a Single FormView C#

I'm trying to add different font styles and sizes to one of the fields below. I'm using a FormView and am extracting the data using <%Eval("fieldname")%>. For this question I'm looking at the 'Comments' Eval field.
The output for this field will look like this:
"- this is a comment.
Commented by John Doe 27/09/2016 16:58
-another comment.
Commented by John Doe 27/09/2016 16:59"
Now my question is how to change the font styles of both comment value (- this is a comment.) and the user who commented (Commented by John...).
Basically, I want the comment to standout than the commented by section.
I'd appreciate any help. Thanks in advance!
<asp:FormView runat="server" ID="fvReport" DataKeyNames="ReportId" DataSourceID="SqlDataSource2" BorderStyle="None">
<ItemTemplate>
<div class="body2">
<h4><%# Eval("Report_Type") %> Report ID No. <%# Eval("ReportId") %></h4>
<table>
<tr>
<th colspan="5">Shift Details</th>
</tr>
<tr style="border: solid .5px;">
<td>Staff Name:</td>
<td style="width: 285px">
<%# Eval("StaffName") %>
</td>
<td></td>
<td></td>
</tr>
<tr>
<td style="width: 19%">Shift Type:
</td>
<td>
<%# Eval("ShiftName") %>
</td>
<td style="text-align:right;">Shift Date:</td>
<td>
<%# Convert.ToDateTime(Eval("ShiftDate")).ToString("dddd, dd MMMM yyyy") %>
</td>
</tr>
<tr>
<th colspan="4">Report</th>
</tr>
<tr>
<td colspan="4">
<%# Eval("Report") %>
</td>
</tr>
<tr>
<th colspan="4">Comments</th>
</tr>
<tr>
<td colspan="4">
<%# Eval("Comments") %>">
</td>
</tr>
<tr>
<td colspan="2"> </td>
<td colspan="2"></td>
</tr>
</table>
</div>
</ItemTemplate>
<EditItemTemplate>
</EditItemTemplate>
</asp:FormView>
I'm assuming that comments is just a record(not like records set) and if you want to use same font for all comments
<tr>
<td colspan="4" style>
<span style="font-size:12px;....">
<%# Eval("Comments")
.ToString()
.Substring(
0,
Eval("Comments")
.ToString()
.IndexOf(" Commented by")) %>">
</span>
<span style="font-size:8px;....">
<%# Eval("Comments")
.ToString()
.Substring(
Eval("Comments")
.ToString()
.IndexOf(" Commented by")) %>">
</span>
</td>
</tr>

c# htmlagilitypack get tags by inline attributes

this is my html :
<table>
<tbody>
<tr>
<table>
...
</table>
</tr>
<tr>
<table>
...
</table>
</tr>
<tr>
<table>
<tr>
<td width="165"></td>
<td width="165"></td>
<td width="165"></td>
</tr>
</table>
</tr>
</tbody>
</table>
there are lots of table, how to get td tags only with [width="165"] attribute? i am using htmlagilitypack in c#
You can use HAP's SelectNodes() method passing the following XPath as argument :
//td[#width=165]

Repeater Control With SeparatorTemplate

How to create horizontal line after each row in repeater control ? I think that I should use "SeparatorTemplate", I tried but didn't work. Can you tell me where to put the separator in the code, to make each line separated ?
This is my code
<asp:Repeater ID="EmployeesRepeater" runat="server">
<HeaderTemplate>
<table>
<tr>
<th>
First Name
</th>
<th>
Last Name
</th>
<th>
Title
</th>
<th>
HomePhone
</th>
</tr>
</HeaderTemplate>
<ItemTemplate>
<tr>
<td>
<%#Eval("FirstName") %>
</td>
<td>
<%#Eval("LastName") %>
</td>
<td>
<%#Eval("Title") %>
</td>
<td>
<%#Eval("HomePhone") %>
</td>
</tr>
</ItemTemplate>
<FooterTemplate>
</table>
</FooterTemplate>
You could just put in a new row with an <hr> in it in your ItemTemplate.
Eg:
<ItemTemplate>
<tr>
<td>
<%#Eval("FirstName") %>
</td>
<td>
<%#Eval("LastName") %>
</td>
<td>
<%#Eval("Title") %>
</td>
<td>
<%#Eval("HomePhone") %>
</td>
</tr>
<tr>
<td colspan="4"><hr></td>
</tr>
</ItemTemplate>
or use the SeparatorTemplate:
<SeparatorTemplate>
<tr>
<td colspan="4"><hr></td>
</tr>
</SeparatorTemplate>
Here is some documentation on how a the SeperatorTemplate works.
EDIT: The SeparatorTemplate is great for when you need to do summary formatting or something that requires more HTML, controls, binding, etc. If you are looking for just adding lines you should be just using css to style the rows appropriately to get the desired output.
If you set the appropriate style to the tr element should be enough. There's no need to create an extra row just for adding a separator.
For example:
<ItemTemplate>
<tr class="item">
....
style
{
.item {
border-bottom:1px solid #cfcfcf;
}
}

Read in HTML file and replace with variables

I have an HTML file that will act as a template for an email that I am going to send out. There are fields in the html that are variable. I was wondering if there is a robust way to replace the placeholders in the HTML file with the variables. I know I could string.Replace all of them, but that isn't ideal since I have a lot of variables. Here is what the html file looks like
<html>
<head>
<title></title>
</head>
<body>
<div>
Please read the Cruise Control Details Below<br>
<br>
<table width='100%'>
<tr>
<td width='100%' colspan='5'>
<font size='4'><b>Release Details</b></font>
</td>
</tr>
<tr>
<td width='20%'>
<b>RFC Ticket #</b>
</td>
<td>
%release.RFCTicket%
</td>
<td>
</td>
<td>
</td>
<td width='10%'>
</td>
<td width='20%'>
<b>Project / Release Name</b>
</td>
<td width='20%'>
%release.ReleaseName%
</td>
</tr>
<tr>
<td width='20%'>
<b>Release Date</b>
</td>
<td width='20%'>
%release.ReleaseDateString%
</td>
<td>
</td>
<td>
</td>
<td width='10%'>
</td>
<td width='20%'>
<b>Release Time</b>
</td>
<td width='20%'>
%release.ReleaseTimeString%
</td>
</tr>
<tr>
<td width='20%'>
<b>CAB Approval Status</b>
</td>
<td width='20%'>
%release.CABApproval%
</td>
</tr>
<tr>
<td width='100%' colspan='5'>
</td>
</tr>
<tr>
<td width='100%' colspan='5'>
<font size='4'><b>Contact Information:</b></font>
</td>
</tr>
<tr>
<td width='20%'>
<b>Project / Team Lead</b>
</td>
<td width='20%'>
%release.TeamLead%
</td>
<td width='10%'>
</td>
<td width='20%'>
<b>On Call DSE</b>
</td>
<td width='20%'>
%release.OnCallDSE%
</td>
</tr>
<tr>
<td width='20%'>
<b>Phone</b>
</td>
<td width='20%'>
%release.ContactInfo%
</td>
<td>
</td>
<td>
</td>
<td>
</td>
<td width='10%'>
</td>
<td width='20%'>
<b>Phone</b>
</td>
<td width='20%'>
%release.OnCallDSEContact%
</td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td width='100%' colspan='5'>
<font size='4'><b>Migration Details:</b></font>
</td>
</tr>
<tr>
<td width='20%'>
<b>Deploy Dashboard</b>
</td>
<td width='20%'>
</td>
<td width='10%'>
</td>
<td width='20%'>
<td>
</td>
<td>
</td>
<b>Deploy Task</b>
</td>
<td width='20%'>
</td>
</tr>
%createTaskTable(ParseSpecialInstuctions().Split('|'))%</table>
</div>
I would like to replace the values in between the "%%" with the variable in code that represents them. I could easily
string.Replace("%release.RFCTicket%",release.RFCTicket);
But that's a bit convoluted in my opinion since I have like 10 or so variables in the file. Are there any built in methods that do what I am asking? Any help would be appreciated, thanks!
Use a regular expression to find your matches. I believe the appropriate regular expression would be along the lines of:
%release.\S+%
From there, you can examine each match, and parse the member name from the match. From there you can get the value of the member from your instance (release in this case) via reflection, and do a string replace.
Something like this. It could use some refactoring to eliminate redundant calls, and I don't know if it fully works, but you get the idea...
var regex = new Regex("%release.\S+%");
var match = r.Match(htmlText);
while (match.Success)
{
var value = match.Value;
var memberName = ParseMemberName(value); //Some code you write to parse out the member name from the match value
var propertyInfo = release.GetType().GetProperty(memberName);
var memberValue = propertyInfo.GetValue(release, null);
htmlText = htmlText.Replace(value, memberValue != null ? memberValue.ToString() : string.Empty);
match = match.NextMatch();
}
This is a talor made Probel for a preprocessed t4 template
You can have your help preformated in the template and allow the template engine to do the replacement. A small example below.
<div>
Please read the Cruise Control Details Below<br>
<br>
<table width='100%'>
<tr>
<td width='100%' colspan='5'>
<font size='4'><b>Release Details</b></font>
</td>
</tr>
<tr>
<td width='20%'>
<b>RFC Ticket #</b>
</td>
<td>
<#= RCFTicketVariable #>
</td>
You can use the Apache Velocity Engine port to .Net to do the templating for you
http://velocity.apache.org/engine/
http://velocity.apache.org/engine/devel/user-guide.html
http://nvelocity.sourceforge.net/
I would consider using REGEX (regular expressions) and giving the placeholders some sort of a special tag (ex: ) so you loop for all the tags that begin with .
Then you fill your data with a list or datatable and do 1 single loop for the whole replaces.
check these for help:
http://msdn.microsoft.com/en-us/library/twcw2f1c.aspx
http://www.regular-expressions.info/examples.html (ur exact case is mentioned under Grabbing HTML Tags)

Print Multiple HTML Tables on Separate Pages

I'm trying to allow a user to print multiple tables depending on what they select in the GridView. It will then select more data (from a hidden GridView) and print all the tables accordingly. What I am doing right now is taking the table at the bottom of my page, giving it a div id, and then using jJavascript to open that div in a new window. However, I'd like to be able to print multiple tables at a time, and possibly even print them on individual pages. Is there a special way to go about doing this? Some sort of special function?
Javascript
<script type='text/javascript'>
//<![CDATA[
function printContent() {
str = document.getElementById('main-content').innerHTML
newwin = window.open('', 'printwin', 'left=20,top=30,width=600,height=400')
newwin.document.write('<HTML>\n<HEAD>\n')
newwin.document.write('<TITLE>Print Page</TITLE>\n')
newwin.document.write('<script>\n')
newwin.document.write('function chkstate(){\n')
newwin.document.write('if(document.readyState=="complete"){\n')
newwin.document.write('window.close()\n')
newwin.document.write('}\n')
newwin.document.write('else{\n')
newwin.document.write('setTimeout("chkstate()",2000)\n')
newwin.document.write('}\n')
newwin.document.write('}\n')
newwin.document.write('function print_win(){\n')
newwin.document.write('window.print();\n')
newwin.document.write('chkstate();\n')
newwin.document.write('}\n')
newwin.document.write('<\/script>\n')
newwin.document.write('</HEAD>\n')
newwin.document.write('<BODY onload="print_win()">\n')
newwin.document.write(str)
newwin.document.write('</BODY>\n')
newwin.document.write('</HTML>\n')
newwin.document.close()
} //]]>
</script>
How I fill my table
GridViewRow row = DefaultGrid.SelectedRow;
int rowIndex = DefaultGrid.SelectedIndex;
HiddenGrid.SelectedIndex = rowIndex;
GridViewRow row2 = HiddenGrid.SelectedRow;
//int id = Convert.ToInt32(row.Cells[25].Text);
fName = row2.Cells[0].Text;
lName = row2.Cells[1].Text;
addr = row2.Cells[2].Text;
addr2 = row2.Cells[3].Text;
city = row2.Cells[4].Text;
state = row2.Cells[5].Text;
zip = row2.Cells[6].Text;
country = row2.Cells[7].Text;
email = row2.Cells[8].Text;
phone = row2.Cells[9].Text;
ccType = row2.Cells[10].Text;
ccNum = row2.Cells[11].Text;
ccExp = row2.Cells[12].Text;
length = row2.Cells[13].Text;
delivery = row2.Cells[14].Text;
price = row2.Cells[15].Text;
source = row2.Cells[16].Text;
joined = row2.Cells[17].Text;
url = row2.Cells[18].Text;
orderResults = row2.Cells[19].Text;
pubName = row2.Cells[20].Text;
sourceCode = row2.Cells[21].Text;
dt = row.Cells[1].Text.ToString();
The table itself
<div id = 'main-content' style = "overflow: auto; height:50%; width:100%" />
<table id="details">
<tr>
<td style="width: 100px;">Name: </td>
<td><%=fName %> <%=lName %></td>
</tr>
<tr>
<td>Address: </td>
<td><%=addr %></td>
</tr>
<tr>
<td>Address 2: </td>
<td><%=addr2 %></td>
</tr>
<tr>
<td>City: </td>
<td><%=city %></td>
</tr>
<tr>
<td>State: </td>
<td><%=state %></td>
</tr>
<tr>
<td>Zip: </td>
<td><%=zip %></td>
</tr>
<tr>
<td>Country: </td>
<td><%=country %></td>
</tr>
<tr>
<td>Email: </td>
<td><%=email %></td>
</tr>
<tr>
<td>Phone: </td>
<td><%=phone %></td>
</tr>
<tr>
<td>CCType: </td>
<td><%=ccType %></td>
</tr>
<tr>
<td>CCNum: </td>
<td><%=ccNum %></td>
</tr>
<tr>
<td>CCExp: </td>
<td><%=ccExp %></td>
</tr>
<tr>
<td>Length: </td>
<td><%=length %></td>
</tr>
<tr>
<td>Delivery: </td>
<td><%=delivery %></td>
</tr>
<tr>
<td>Price: </td>
<td><%=price %></td>
</tr>
<tr>
<td>Source: </td>
<td><%=source %></td>
</tr>
<tr>
<td>Joined: </td>
<td><%=joined %></td>
</tr>
<tr>
<td>URL: </td>
<td><%=url %></td>
</tr>
<tr>
<td>orderResults</td>
<td><%=orderResults %></td>
</tr>
<tr>
<td>PubName: </td>
<td><%=pubName %></td>
</tr>
<tr>
<td>Source Code: </td>
<td><%=sourceCode %></td>
</tr>
<tr>
<td>Date/Time: </td>
<td><%=dt %></td>
</tr>
</table>
</div>
You can use CSS's page-break-before to print content on separate pages:
<table style="page-break-before: always;">
...
</table>
This would insert a page break before all tables. You'll probably want to apply this to all tables after the first.
To make sure there's a page break, use the page-break-before: always CSS styling on each element you want to make a page break.

Categories

Resources