How to save necessary information of HTML file to string variable - c#

A HTML file is generated by Android MobileBiz Pro invoice app. I'm trying to make software for print HTML based invoice via receipt printer
I need to save necessary information of HTML file to string variable as mentioned below. I tried using IndexOf method. but it's not working for me. How can I get this information using visual c#?
string subtotal = 2,976.00;
string total = 2,976.00;
string payment= 2,760.00;
string balance= 216.00;
This is an example of the HTML code:
<tr><td align="right" colspan="3">Subtotal</td><td align="right">2,976.00</td></tr><tr><td align="right" colspan="3"><b>TOTAL</b></td><td align="right"><b>2,976.00</b></td></tr><tr><td align="right" colspan="3">Less Payment</td><td align="right">2,760.00</td></tr><tr class="total"><td align="right" colspan="3"><strong>Balance Due</strong></td><td align="right">216.00</td></tr>
This is a complete HTML code of HTML file
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<style>
body {
font-family:Verdana, Geneva, sans-serif;
font-size: 8pt;
padding: 0 50pt 0 50pt;
}
table td, table th, table.sales th, table td.footer-text {
font-size: 8pt;
}
h1 {
font-family:Verdana, Geneva, sans-serif;
padding-bottom:2px;
margin-bottom:2px;
color:chocolate;
text-transform:uppercase;
font-size: inherit;
font-size: 1.5em;
}
h2 {
font-family:Verdana, Geneva, sans-serif;
padding-bottom:0px;
margin-bottom:0px;
color:chocolate;
text-transform:uppercase;
font-size: 1.3em;
}
h3 {
font-family:Verdana, Geneva, sans-serif;
padding-bottom:2px;
margin-bottom:2px;
}
table.sales td {
padding: 4px 10px 4px 10px;
}
table.sales th {
padding: 5px 10px 5px 10px;
background-color:#CCC;
}
tr.saleline td {
border-bottom-color:chocolate;
border-bottom-width: 1pt;
border-bottom-style: solid;
vertical-align: top;
}
.signature {
display: none;
}
.horizontal-line {
border: 0;
height: 4pt;
color:chocolate;
background-color: chocolate;
}
.total {
font-weight:bold;
font-size:1.1em;
background-color:#CCC;
}
.block1 {
text-align:left;
vertical-align:bottom
}
.block2 {
text-align:right;
vertical-align:bottom
}
.block3 {
text-align:left;
vertical-align:top;
}
.block4 {
text-align:left;
vertical-align:top;
}
.block5 {
text-align:right;
vertical-align:bottom;
}
.block6 {
text-align:left;
vertical-align:top;
margin-top: 15px;
}
.block7 {
text-align:left;
vertical-align:top;
margin-top: 15px;
}
.block8 {
text-align:left;
vertical-align:bottom;
}
.block9 {
text-align:center;
vertical-align:bottom;
}
.block10 {
text-align:right;
vertical-align:bottom;
}
.block11 {
text-align:left;
padding: 25px 0 15px 0;
}
.extracols {
border-style:solid;
border-color:gray;
}
table.extracols {
border-top-width: 1pt;
border-right-width: 0;
border-bottom-width: 1pt;
border-left-width: 1pt;
border-collapse:collapse;
margin: 0 0 15pt 0;
}
table.extracols th {
padding: 5px 10px 5px 10px;
border-top-width: 0;
border-right-width: 1pt;
border-bottom-width: 0;
border-left-width: 0;
border-color:gray;
border-style:solid;
background-color:#CCC;
}
table.extracols td {
padding: 4px 10px 4px 10px;
border-top-width: 0;
border-right-width: 1pt;
border-bottom-width: 0;
border-left-width: 0;
border-color:gray;
border-style:solid;
background-color:#FFF;
}
#footer {
margin-top: 35px;
}
.footer-text {
font-size: inherit;
font-size: 0.97em
}
</style>
</head>
<body style="padding: 20 20 20 20">
<table width="100%">
<tr>
<td style="padding-bottom:20px"><table width="100%">
<tr>
<td style="text-align:left;"></td>
<td class="block2" align="right"><h3>Y.P.Brothers</h3>
No:55/B,<br/>Samagipura,<br/>Sewanagala.
<br/>077-6977139
<br/>mecduino#gmail.com
<br/>
</td>
</tr>
</table></td>
</tr>
<tr>
<td><hr class="horizontal-line"/></td>
</tr>
<tr>
<td><table width="100%">
<tr>
<td style="padding:10px 0 20px 0;"><table width="100%">
<tr>
<td width="33%" class="block3"><strong>Bill To</strong><br />
ANUSHA SURIYA<br/>
</td>
<td class="block4"><strong></strong><br />
</td>
<td class="block5" align="right"><h1>invoice #1</h1>
<b>Date</b>: Oct 9, 2015
<br/><b>Due Date</b>: Oct 9, 2015
</td>
</tr>
</table></td>
</tr>
<tr>
<td>
</td>
</tr>
<tr>
<td><table width="100%" class="sales">
<!-- Headers -->
<tr>
<th align="center">Qty</th> <th align="center">Item</th> <th align="right">Price</th> <th align="right">Amount</th>
</tr>
<!-- Rows -->
<tr class="saleline"> <td align="left">12</td> <td align="left">helaligth 35/=</td> <td align="right">35.00</td> <td align="right">420.00</td> </tr>
<tr class="saleline"> <td align="left">12</td> <td align="left">200p CR SR 195/=</td> <td align="right">195.00</td> <td align="right">2,340.00</td> </tr>
<tr class="saleline"> <td align="left">36</td> <td align="left">Sunlight 35g</td> <td align="right">6.00</td> <td align="right">216.00</td> </tr>
<!-- Totals -->
<tr><td align="right" colspan="3">Subtotal</td><td align="right">2,976.00</td></tr><tr><td align="right" colspan="3"><b>TOTAL</b></td><td align="right"><b>2,976.00</b></td></tr><tr><td align="right" colspan="3">Less Payment</td><td align="right">2,760.00</td></tr><tr class="total"><td align="right" colspan="3"><strong>Balance Due</strong></td><td align="right">216.00</td></tr>
</table></td>
</tr>
</table></td>
</tr>
<tr>
<td><table width="100%" style="margin-top:30px">
<tr>
<td width="50%" class="block6"><h2></h2>
</td>
<td width="50%" class="block7" align="right"><h2></h2>
</td>
</tr>
</table></td>
</tr>
<tr>
<td><table class="block11" width="100%">
<tr>
<td><table></table></td>
</tr>
</table></td>
</tr>
<tr>
<td></td>
</tr>
</table>
<div class="signature">
<table border="0" cellspacing="2" cellpadding="2" align="left">
<tr>
<td style="padding-bottom:30px"></td>
</tr>
<tr>
<td><b>Signed by:</b>
<br/><b>Date:</b>
<br/><b>Signature:</b><br/></td>
</tr>
</table>
</div>
<div id="footer">
<table width="100%" border="0" cellpadding="2">
<tr>
<td align="center"><span class="footer-text">Thank you for your business.</span></td>
</tr>
</table>
</div>
</body>
</html>

You need an html parser, try this one http://htmlagilitypack.codeplex.com/
Load page into HtmlDocument
HtmlWeb htmlWeb = new HtmlWeb();
HtmlDocument htmlDocument = htmlWeb.Load("url");
Get table with specified Id
HtmlNode table = htmlDocument.DocumentNode.Descendants("table").SingleOrDefault(x => x.Id == "tableId");
Loop through nodes to find values
foreach(HtmlNode child in table.ChildNodes)
{
if (child.NodeType != HtmlNodeType.Text)
{
Console.WriteLine(child.Name);
}
}
More you can check here http://www.codeproject.com/Articles/691119/Html-Agility-Pack-Massive-information-extraction-f

You have to use parseHTML function of jquery and then loop through each element to get the values. Below is the working example (It can be more refined as per your need)
$(document).ready(function () {
var str = '<tr><td align="right" colspan="3">Subtotal</td><td align="right">2,976.00</td></tr><tr><td align="right" colspan="3"><b>TOTAL</b></td><td align="right"><b>2,976.00</b></td></tr><tr><td align="right" colspan="3">Less Payment</td><td align="right">2,760.00</td></tr><tr class="total"><td align="right" colspan="3"><strong>Balance Due</strong></td><td align="right">216.00</td></tr>';
var html = $.parseHTML(str);
$.each(html, function (index, element) {
if ($(this).find("td:first").html() == "Subtotal")
console.log($(this).find("td:last").html());
else if ($(this).find("td:first b").html() == "TOTAL")
console.log($(this).find("td:last b").html());
else if ($(this).find("td:first").html() == "Less Payment")
console.log($(this).find("td:last").html());
else if ($(this).find("td:first strong").html() == "Balance Due")
console.log($(this).find("td:last").html());
});
});

Related

C # foreach repeats 300+ times

I have a program that loads a local HTML page with a table from which it will extract several results, which it will integrate into a DataGridView.
[Image of the program that returns the problem...]:
https://i.stack.imgur.com/43iNt.jpg
Here comes the problem, I am using foreach and it repeats the operation 300+ times ...
I do not understand, nor do I find where the problem is.
Could you enlighten me?
Thanks.
[HTML code from which I am trying to extract the data]:
<table cellspacing="0" cellpadding="0" border="0" style="border-width:0px;width:809pt;border-collapse:collapse;">
<tbody>
<tr style="height:16.4pt;">
<td class="sd2f9551a" style="width:42.9pt;height:16.4pt;"></td>
<td class="s054608a3" style="height:15.7pt;padding:2px 2px 2px 2px;width:70.8pt;">601</td>
<td class="s828d7148" style="height:15.7pt;padding:2px 2px 2px 2px;width:106.6pt;">001834820601</td>
<td class="s828d7148" colspan="7" style="height:15.7pt;padding:2px 2px 2px 2px;width:128.1pt;"></td>
<td class="s828d7148" colspan="3" style="height:15.7pt;padding:2px 2px 2px 2px;width:121pt;"></td>
<td class="sf7752056" colspan="6" style="height:15.7pt;padding:2px 2px 2px 2px;width:214pt;"></td>
<td class="s054608a3" style="height:15.7pt;padding:2px 2px 2px 2px;width:78pt;">EMBARCADO</td>
<td class="s9a0851f4" style="width:42.9pt;height:16.4pt;"></td>
</tr>
<tr style="height:15.7pt;">
<td class="sd2f9551a" style="width:42.9pt;height:15.7pt;"></td>
<td class="s054608a3" style="height:15pt;padding:2px 2px 2px 2px;width:70.8pt;">602</td>
<td class="s828d7148" style="height:15pt;padding:2px 2px 2px 2px;width:106.6pt;">001834820602</td>
<td class="s828d7148" colspan="7" style="height:15pt;padding:2px 2px 2px 2px;width:128.1pt;"></td>
<td class="s828d7148" colspan="3" style="height:15pt;padding:2px 2px 2px 2px;width:121pt;"></td>
<td class="sf7752056" colspan="6" style="height:15pt;padding:2px 2px 2px 2px;width:214pt;"></td>
<td class="s054608a3" style="height:15pt;padding:2px 2px 2px 2px;width:78pt;">EMBARCADO</td>
<td class="s9a0851f4" style="width:42.9pt;height:15.7pt;"></td>
</tr>
</tbody>
</table>
[Fragment of the code that returns the problem...]:
foreach (HtmlNode table in doc.DocumentNode.SelectNodes("//tbody"))
{
foreach (HtmlNode row in table.SelectNodes("//tr[(#style='height:16.4pt;') or (#style='height:15.7pt;')]"))
{
DataRow r = dt.NewRow();
int i = 0;
HtmlNodeCollection cells = row.SelectNodes("td");
if (cells == null)
continue;
foreach (HtmlNode cell in cells)
{
r[i] = cell.InnerText;
i++;
}
dt.Rows.Add(r);
}
}

Combo box selectedindexchanged event

i am making a project in which i am stuck on the selected index changed event of ajax tool kit combo box. what i wanted is that when i select the student name in combobox(studentname) i get the values of other columns from a database into the textboxes with out using any button...i have done it in c# windows form but can't done it in asp.net.
my code is `
using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.Configuration;
namespace Final_Project
{
public partial class Teacher_Mangement_page : System.Web.UI.Page
{
SqlConnection con = new SqlConnection();
string teachername;
protected void Page_Load(object sender, EventArgs e)
{
con.ConnectionString = ConfigurationManager.ConnectionStrings["studentdatastring"].ConnectionString;
teachername = "teacher1";//Session["name"].ToString();
if (!IsPostBack)
{
cb();
MultiView1.ActiveViewIndex = 0;
}
}
private void cb()
{
ComboBox1.Items.Clear();
ComboBox2.Items.Clear();
con.Open();
SqlCommand cmd = new SqlCommand();
cmd.Connection = con;
cmd.CommandText = "select studentname,subject from academictable where teachername='"+teachername+"'";
SqlDataReader dr = cmd.ExecuteReader();
while (dr.Read())
{
ComboBox1.Items.Add(dr["studentname"].ToString());
ComboBox2.Items.Add(dr["subject"].ToString());
}
con.Close();
}
protected void ComboBox1_SelectedIndexChanged(object sender, EventArgs e)
{
con.Open();
SqlCommand cmd = new SqlCommand();
cmd.Connection = con;
cmd.CommandText = "select * from academictable where studentname='" + ComboBox1.Text + "' and subject='"+ComboBox2.Text+"' ";
SqlDataReader rd = cmd.ExecuteReader();
while (rd.Read())
{
qt1.Text = rd["quiz1"].ToString();
qt2.Text = rd["quiz2"].ToString();
qt3.Text = rd["quiz3"].ToString();
qt4.Text = rd["quiz4"].ToString();
ast1.Text = rd["assignment1"].ToString();
ast2.Text = rd["assignment2"].ToString();
prot.Text = rd["project"].ToString();
mt.Text = rd["mid"].ToString();
ft.Text = rd["final"].ToString();
}
rd.Close();
con.Close();
}
string subject;
protected void Button3_Click(object sender, EventArgs e)
{
MultiView1.ActiveViewIndex = 1;
subject = ComboBox2.Text;
}
protected void Button5_Click(object sender, EventArgs e)
{
MultiView1.ActiveViewIndex = 0;
}
}
}`
and my html code is `
<!DOCTYPE html>
<html>
<head runat="server">
<title>Bootstrap demo</title>
<link href="bootstrap/bootstrap.css" rel="stylesheet" type="text/css" />
<meta charset="utf-8" />
<meta name="viewport" content="width=device-width, intial-scale=1" />
<style type="text/css">
.style3
{
text-align: center;
}
.style5
{
width: 582px;
text-align: right;
}
.style6
{
text-align: center;
}
.style7
{
width: 468px;
text-align: right;
}
h1
{ color:Aqua;
font-style:italic;
font-family:Broadway;
}
h2
{ color:Highlight;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<center><h1>STUDENT PORTAL</h1></center>
<asp:MultiView ID="MultiView1" runat="server">
<asp:View ID="select_subject" runat="server">
<table class="w-100">
<tr>
<td class="style6" colspan="2">
<h2>SUBJECT SELECTION</h2></td>
</tr>
<tr>
<td class="style7">
<h4>Subject:</h4></td>
<td>
<ajaxToolkit:ComboBox ID="ComboBox2" runat="server"
AutoCompleteMode="SuggestAppend" Width="300px">
</ajaxToolkit:ComboBox>
</td>
</tr>
<tr>
<td class="style6" colspan="2">
<asp:Button ID="Button2" runat="server" Text="Show Attendance" Width="162px" />
<ajaxToolkit:RoundedCornersExtender ID="Button2_RoundedCornersExtender"
runat="server" BehaviorID="Button2_RoundedCornersExtender"
TargetControlID="Button2" />
<asp:Button ID="Button3" runat="server" Text="Show Academic Details"
Width="178px" onclick="Button3_Click" /><ajaxToolkit:RoundedCornersExtender ID="RoundedCornersExtender1"
runat="server" TargetControlID="Button3"/>
</td>
</tr>
</table>
</asp:View>
<asp:View ID="Academic_details" runat="server">
<table class="w-100">
<tr>
<td class="text-center" colspan="2">
<h2>ACADEMIC DETAILS</h2></td>
</tr>
<tr>
<td class="style5">
Student Name:</td>
<td>
<ajaxToolkit:ComboBox ID="ComboBox1" runat="server"
AutoCompleteMode="SuggestAppend"
Width="300px" AutoPostBack="True">
</ajaxToolkit:ComboBox>
</td>
</tr>
<tr>
<td class="style5">
Quiz 1 Marks:</td>
<td>
<asp:TextBox ID="qt1" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Quiz 2 Marks:</td>
<td>
<asp:TextBox ID="qt2" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Quiz 3 Marks:</td>
<td>
<asp:TextBox ID="qt3" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Quiz 4 Marks:</td>
<td>
<asp:TextBox ID="qt4" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Assignment 1 Marks:</td>
<td>
<asp:TextBox ID="ast1" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Assignment 2 Marks:</td>
<td>
<asp:TextBox ID="ast2" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Presentation/Project Marks:</td>
<td>
<asp:TextBox ID="prot" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Sessional Marks:</td>
<td>
<asp:TextBox ID="sest" runat="server" ReadOnly="True" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Mid-Term Marks:</td>
<td>
<asp:TextBox ID="mt" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
Final-Term Marks:</td>
<td>
<asp:TextBox ID="ft" runat="server" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style5">
<em style="font-weight: bold; font-style: normal; color: rgb(106, 106, 106); font-family: arial, sans-serif; font-size: small; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial;">
Grade Point Average</em><span
style="color: rgb(84, 84, 84); font-family: arial, sans-serif; font-size: small; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;"><span> </span>(</span><wbr
style="color: rgb(84, 84, 84); font-family: arial, sans-serif; font-size: small; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial;"><em
style="font-weight: bold; font-style: normal; color: rgb(106, 106, 106); font-family: arial, sans-serif; font-size: small; font-variant-ligatures: normal; font-variant-caps: normal; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial;">GPA</em><span
style="color: rgb(84, 84, 84); font-family: arial, sans-serif; font-size: small; font-style: normal; font-variant-ligatures: normal; font-variant-caps: normal; font-weight: 400; letter-spacing: normal; orphans: 2; text-align: left; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px; -webkit-text-stroke-width: 0px; background-color: rgb(255, 255, 255); text-decoration-style: initial; text-decoration-color: initial; display: inline !important; float: none;">)<span> :</span></span></wbr>
</td>
<td>
<asp:TextBox ID="gpat" runat="server" ReadOnly="True" Width="300px"></asp:TextBox>
</td>
</tr>
<tr>
<td class="style3" colspan="2">
<asp:Button ID="Button4" runat="server" Text="Button" Width="162px" />
<ajaxToolkit:RoundedCornersExtender ID="Button4_RoundedCornersExtender"
runat="server" BehaviorID="Button1_RoundedCornersExtender"
TargetControlID="Button4" />
<asp:Button ID="Button5" runat="server" Text="Back" Width="162px"
onclick="Button5_Click" />
<ajaxToolkit:RoundedCornersExtender ID="Button5_RoundedCornersExtender"
runat="server" BehaviorID="Button5_RoundedCornersExtender"
TargetControlID="Button5" />
</td>
</tr>
</table>
</asp:View>
</asp:MultiView>
<asp:ScriptManager ID="ScriptManager1" runat="server">
</asp:ScriptManager>
</form>
</body>
`

HTMLAgility pack C# unclosed colgroup tag

I have a string (HTML) being posted to server side and then it is validated using HTMLAgility pack. In the HTML there is an unclosed colgroup tag.
After sanitizing, the closing colgroup tag appears but right between closing "tbody" and "table" tag
BEFORE:
<table width="3265" class="mce-item-table" style="width: 2452pt; border-collapse: collapse;" border="0" cellspacing="0" cellpadding="0">
<colgroup><col width="80" style="width: 60pt;">
<col width="245" style="width: 184pt;" span="13"> <!-- MISSING COLGROUP tag-->
<tbody><tr height="20" style="height: 15pt;">
<td width="80" height="20" style="width: 60pt; height: 15pt; color: blue; text-decoration: underline; text-underline-style: single;"><span style="color: blue;">31109173</span></td>
<td width="245" style="width: 184pt; font-family: Arial; font-size: 9pt;">31109173</td>
<td width="245" align="right" style="width: 184pt; font-family: Arial; font-size: 9pt;">May 09,2017 9:54 AM</td>
<td width="245" align="right" style="width: 184pt; font-family: Arial; font-size: 9pt;">May 08,2017 5:21 PM</td>
</tr>
<tr height="20" style="height: 15pt;">
<td height="20" style="height: 15pt; color: blue; text-decoration: underline; text-underline-style: single;"><span style="color: blue;">30933775</span></td>
<td style="font-family: Arial; font-size: 9pt;">30933775</td>
<td align="right" style="font-family: Arial; font-size: 9pt;">May 09,2017 9:50 AM</td>
<td align="right" style="font-family: Arial; font-size: 9pt;">Apr 28,2017 6:22 PM</td>
</tr>
</tbody></table>
AFTER:
<table width="3265" class="mce-item-table" style="width: 2452pt; border-collapse: collapse;" border="0" cellspacing="0" cellpadding="0">
<colgroup><col width="80" style="width: 60pt;">
<col width="245" style="width: 184pt;" span="13">
<tbody><tr height="20" style="height: 15pt;">
<td width="80" height="20" style="width: 60pt; height: 15pt; color: blue; text-decoration: underline; text-underline-style: single;"><span style="color: blue;">31109173</span></td>
<td width="245" style="width: 184pt; font-family: Arial; font-size: 9pt;">31109173</td>
<td width="245" align="right" style="width: 184pt; font-family: Arial; font-size: 9pt;">May 09,2017 9:54 AM</td>
<td width="245" align="right" style="width: 184pt; font-family: Arial; font-size: 9pt;">May 08,2017 5:21 PM</td>
</tr>
<tr height="20" style="height: 15pt;">
<td height="20" style="height: 15pt; color: blue; text-decoration: underline; text-underline-style: single;"><span style="color: blue;">30933775</span></td>
<td style="font-family: Arial; font-size: 9pt;">30933775</td>
<td align="right" style="font-family: Arial; font-size: 9pt;">May 09,2017 9:50 AM</td>
<td align="right" style="font-family: Arial; font-size: 9pt;">Apr 28,2017 6:22 PM</td>
</tr>
</tbody></colgroup></table>
<!-- ^^ </colgroup> has appeared above-->
I tried setting "OptionFixNestedTags" flag to true. I still get the same result.
I tried various options from HTMLAgility pack and setting them true. This didn't work.
OptionFixNestedTags = true;
OptionAutoCloseOnEnd = true;
There is a nice Nuget package which sanitizes the html. The problem which I faced was tackled here -> HtmlSanitizer
Hope this helps.

CSS not displaying the same across different broswers

This is what my page should look like, this is displayed in IE:
This is what it looks like in Firefox:
This is my code:
#using CustPortal.serviceclass
#model CustomerData
<br/>
<div class="leftdiv">
<fieldset>
<legend>Customer Info</legend>
#Html.Partial("CustomerInfo", Model)
</fieldset>
</div>
<div class="rightdiv">
<fieldset>
<legend>Balance</legend>
<div>
#Html.Partial("AccountBalance", Model)
</div>
</fieldset>
</div>
<div>
<table style="width: 100%" id="ThinLineTable">
<tr>
<th class="ThinLineTdLeft ThinLineTh" style="width: 15%">Date</th>
<th class="ThinLineTdLeft ThinLineTh" style="width: 15%">Refer#</th>
<th class="ThinLineTdLeft ThinLineTh" style="width: 30%">Description</th>
<th class="ThinLineTdRight ThinLineTh" style="width: 10%">Qty</th>
<th class="ThinLineTdRight ThinLineTh" style="width: 15%">Total</th>
<th class="ThinLineTdRight ThinLineTh" style="width: 15%">Balance</th>
</tr>
#foreach (var item in (IEnumerable<TransactionHistory>) ViewBag.TransactionHistory)
{
<tr>
<td class="ThinLineTdLeft">#item.TransactionDate</td>
<td class="ThinLineTdLeft">#item.ReferenceNumber</td>
<td class="ThinLineTdLeft">#item.Description</td>
<td class="ThinLineTdRight">#item.Quantity</td>
<td class="ThinLineTdRight">#item.Total</td>
<td class="ThinLineTdRight">#item.Balance</td>
</tr>
}
</table>
</div>
And my css:
.ThinLineTdRight {
padding: 5px;
border: solid 1px #d4d0d0;
text-align: right;
}
.ThinLineTdLeft {
padding: 5px;
border: solid 1px #d4d0d0;
text-align: left;
}
.ThinLineTh {
background-color: #e8eef4;
}
.rightdiv {
float: right;
width: 49%;
text-align: left;
}
.leftdiv {
float: left;
width: 49%;
text-align: left;
}
I'm not great with CSS, I'm still learning. Can anyone tell me what I am doing wrong to make it display differently in FF than in IE?
Thank you!

Accordion menu in windows phone 8 by using webbrowser control

I am using the following HTML page to make an accordion control:
<!DOCTYPE >
<html >
<head >
<title></title>
<script language="JavaScript" type="text/javascript" >
function Show() {
document.getElementById("tdfirst").style.display = 'block';
}
function Hide() {
document.getElementById("tdfirst").style.display = 'none';
}
function Show2() {
document.getElementById("tdsecond").style.display = 'block';
}
function Hide2() {
document.getElementById("tdsecond").style.display = 'none';
}
function Show3() {
document.getElementById("tdthird").style.display = 'block';
}
function Hide3() {
document.getElementById("tdthird").style.display = 'none';
}
</script>
<style type="text/css">
.style1 {
width: 164px;
}
.style2
{
height: 98px;
}
.style3
{
width: 110px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div>
<table>
<tr style="border-style: solid; border-width: thin; border-color: inherit;">
<div id="div1" >
<td class="style1"
style="border: thin solid #000000; text-align: right;">
<table><tr><td>Menu1</td><td class="style3">
<img alt="" onclick="Show()" src="Image/down%20arrow.jpg"
style="height: 15px; margin-left: 0px" /><img
alt="" onclick="Hide()" src="Image/up%20arrow.jpg" style="height: 15px" /></td></tr></table> </td>
</div>
</tr>
<tr>
<div id="div2">
<td id="tdfirst" class="style2"
style="border: thin solid #000080; text-align: left;display:none;"; >SubMenu1</td>
</div>
</tr>
</table>
<div>
<table>
<tr style="border-style: solid; border-width: thin; border-color: inherit;">
<div id="div3" >
<td class="style1"
style="border: thin solid #000000; text-align: right;">
<table><tr><td>Menu2</td><td class="style3">
<img alt="" onclick="Show2()" src="Image/down%20arrow.jpg"
style="height: 15px; margin-left: 0px" /><img
alt="" onclick="Hide2()" src="Image/up%20arrow.jpg" style="height: 15px" /></td></tr></table> </td>
</div>
</tr>
<tr>
<div id="div4">
<td id="tdsecond" class="style2"
style="border: thin solid #000080; text-align: left;display:none;"; >SubMenu2</td>
</div>
</tr>
</table>
<table>
<tr style="border-style: solid; border-width: thin; border-color: inherit;">
<div id="div5" >
<td class="style1"
style="border: thin solid #000000; text-align: right;">
<table><tr><td>Menu3</td><td class="style3">
<img id="imgdown" alt="" onclick="Show3()" src="Image/down%20arrow.jpg"
style="height: 15px; margin-left: 0px" /><img id="imgup"
alt="" onclick="Hide3()" src="Image/up%20arrow.jpg" style="height: 15px" /></td></tr></table> </td>
</div>
</tr>
<tr>
<div id="div6">
<td id="tdthird" class="style2"
style="border: thin solid #000080; text-align: left;display:none;"; >SubMenu3</td>
</div>
</tr>
</table>
</div>
</form>
</body>
</html>
When I try to display this HTML in a WebBrowser control, nothing appears and the control is blank.
XAML:
<phone:WebBrowser HorizontalAlignment="Left" Margin="0" VerticalAlignment="Top" x:Name="webBrowser1" Grid.Row="1" IsScriptEnabled="True" />
.cs:
  webBrowser1.Navigate(new Uri("/Html_Pages/AboutUs.html", UriKind.Relative));
Can anyone see what I'm doing wrong? I'm using VS2012 and the WP8 emulator.
Hope This will help you. NavigateToString()
private void goNavigateToStringButton_Click(object sender, RoutedEventArgs e)
{
// Load HTML document as a string
Uri uri = new Uri(#"pack://application:,,,/HTMLDocumentWithoutScript.html", UriKind.Absolute);
Stream stream = Application.GetResourceStream(uri).Stream;
using (StreamReader reader = new StreamReader(stream))
{
// Navigate to HTML document string
this.webBrowser.NavigateToString(reader.ReadToEnd());
}
}
from : NavigateToString() method

Categories