I have data as list, I want to break each row with 2 columns. I tried so hard but it is not working. This is sample html. I have 4 data rows, it should show two rows, each row with two columns.
<table>
<tr>
<td>
<table>
<tr>
<td>
<table>
<tr>
<td>TYPE</td>
<td>Blue</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table>
<tr class='bg-red'>
<td>13:45</td>
<td>2017ABC-0001</td>
</tr>
<tr>
<td>12:45</td>
<td>2017WEX-0002</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>
<table>
<tr>
<td>TYPE</td>
<td>Red</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table>
<tr class='bg-red'>
<td>13:45</td>
<td>2017ABC-0001</td>
</tr>
<tr>
<td>12:45</td>
<td>2017WEX-0002</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table>
<tr>
<td>
<table>
<tr>
<td>TYPE</td>
<td>Green</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table>
<tr class='bg-red'>
<td>13:45</td>
<td>2017ABC-0001</td>
</tr>
<tr>
<td>12:45</td>
<td>2017WEX-0002</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
<td>
<table>
<tr>
<td>
<table>
<tr>
<td>TYPE</td>
<td>Yellow</td>
</tr>
</table>
</td>
</tr>
<tr>
<td>
<table>
<tr class='bg-red'>
<td>13:45</td>
<td>2017ABC-0001</td>
</tr>
<tr>
<td>12:45</td>
<td>2017WEX-0002</td>
</tr>
</table>
</td>
</tr>
</table>
</td>
</tr>
</table>
And this is sample code
string result = "<table>";
List<string> listTYPE = GetTYPE();
foreach (var item in listTYPE)
{
result += "<tr><td><table> <tr><td><table><tr><td>TYPE</td><td>"
+ item + "</td></tr></table></td></tr><tr><td><table>";
List<Detail_Product> listDetail = GetDetail(item);
foreach (var detail in listDetail)
{
if (detail.PO_NO.Contains("ABC"))
{
result += "<tr class='class='bg-red''><td>" + detail.CREATE_DATE + "</td><td>" + detail.PO_NO + "</td>";
}
result += "<tr><td>" + detail.CREATE_DATE + " </td><td>" + detail.PO_NO + "</td>";
}
result += "</tr></table></td></tr> </table></td></tr>";
}
result += "</table>";
ViewBag.result = result;
What should I do?, I thought to check if (listLINE.IndexOf(line) > 2) I will break new <tr> but I don't know how to do it.
Related
Below is my html structure (table):
<table>
<tr><td>A</td></tr>
</table>
<table>
<tr><td>B</td></tr>
</table>
<table>
<table>
<table>
<table>
<tbody>
<tr class="A">
<td>
ABC
</td>
<td>
Link
</td>
</tr>
<tr class="B">
<td>
DEF
</td>
<td>
Link2
</td>
</tr>
</tbody>
</table>
</table>
</table>
</table>
I tried to get data as below:
HtmlNode thediv = doc.DocumentNode.SelectSingleNode("//table[3]//table[1]");
⇒ It works well.
But, I tried with code as below to get data ABC/DEF in table 3.
HtmlNode thediv = doc.DocumentNode.SelectSingleNode(
"//table[3]//table[1]//table[2]//table[3]");
⇒ Not OK.
I think what you actually want is
var bothNodes = doc.DocumentNode.SelectNodes("//table[3]//table[1]//tr/td[1]/text()");
That will give you both nodes ABC and DEF of the third table
You can try it here: XPathFiddle
Your code doesn't work because there is no node that fits the second query.
Step by Step:
This is your original html:
<table>
<tr><td>A</td></tr>
</table>
<table>
<tr><td>B</td></tr>
</table>
<table>
<table>
<table>
<table>
<tbody>
<tr class="A">
<td>
ABC
</td>
<td>
Link
</td>
</tr>
<tr class="B">
<td>
DEF
</td>
<td>
Link2
</td>
</tr>
</tbody>
</table>
</table>
</table>
</table>
//table[3] gives you the third table
<table>
<table>
<table>
<table>
<tbody>
<tr class="A">
<td>
ABC
</td>
<td>
Link
</td>
</tr>
<tr class="B">
<td>
DEF
</td>
<td>
Link2
</td>
</tr>
</tbody>
</table>
</table>
</table>
</table>
//table[3]//table[1] gives you the first table that's a descendant of the third table.
<table>
<table>
<table>
<tbody>
<tr class="A">
<td>
ABC
</td>
<td>
Link
</td>
</tr>
<tr class="B">
<td>
DEF
</td>
<td>
Link2
</td>
</tr>
</tbody>
</table>
</table>
</table>
//table[3]//table[1]//table[2] would give you the second table that's a descendant the first table that's a descendant of the third table. And there is only one --> doesn't work.
Hi Manfred Radlwimmer,
Thank for your answer. I did it :).
The code is below:
if (doc.DocumentNode.SelectNodes("//table") != null)
{
HtmlNode thediv = doc.DocumentNode.SelectSingleNode("//table[3]//table[1]//tr/td[1]//tr[3]//table//tr/td[2]//table");
HtmlNodeCollection cells = thediv.SelectNodes("tr");
for (var j = 1; j < cells.Count; ++j)
{
var data= cells[j].InnerText;
}
}
I'm working with some html tables and trying to dig through them with htmlagilitypack. The source html is found here: https://www.ultimate-guitar.com/search.php?title=breaking+benjamin+polyamorous&type%5B1%5D=200&rating%5B0%5D=4&rating%5B1%5D=5
Sample table:
<table cellspacing="1" class="tresults">
<tbody>
<tr>
<th width="175">Artist :</th>
<th>Song :</th>
<th width="115">Rating :</th>
<th width="80">Type :</th>
</tr>
<tr>
<td>
<a href="/tabs/breaking_benjamin_tabs.htm" class="song search_art">
<b>Breaking</b> <b>Benjamin</b>
</a>
</td>
<td>
<a target="_blank" href="http://plus.ultimate-guitar.com/tp/?artist=Breaking+Benjamin&song=Polyamorous" class="song js-tp_link"><b>Polyamorous</b></a>
<a target="_blank" class="js-tp_link" href="http://plus.ultimate-guitar.com/tp/?artist=Breaking+Benjamin&song=Polyamorous"><b
class="play_tab_list"title="Playback"></b></a>
</td>
<td class="gray4"></td>
<td><strong>tab pro</strong>
</td>
</tr>
<tr class="stripe">
<td> </td>
<td>
<b>Polyamorous</b> (ver 2)
</td>
<td class="gray4"><span class="rating"><span class="r_4"></span></span> <span>[ <b class="ratdig">5</b> ]</span>
</td>
<td><strong>tab</strong>
</td>
</tr>
<tr>
<td> </td>
<td>
<b>Polyamorous</b> (ver 4)
</td>
<td class="gray4"><span class="rating"><span class="r_4"></span></span> <span>[ <b class="ratdig">30</b> ]</span>
</td>
<td><strong>tab</strong>
</td>
</tr>
<tr class="stripe">
<td> </td>
<td>
<b>Polyamorous</b> (ver 5)
</td>
<td class="gray4"><span class="rating"><span class="r_4"></span></span> <span>[ <b class="ratdig">12</b> ]</span>
</td>
<td><strong>tab</strong>
</td>
</tr>
<tr>
<td> </td>
<td>
<b>Polyamorous</b> (ver 6)
<span rel="#info_333408" class="tabinfo">info</span>
<div class="dn" id="info_333408">
<font style="font-family:trebuchet ms;font-size:12px;font-weight:bold;line-height:120%"><b><font color="#DDDDCC">+</font> Difficulty:</b> <font color="#DDDDCC">novice</font>
<br>
</font>
</div>
</td>
<td class="gray4"><span class="rating"><span class="r_4"></span></span> <span>[ <b class="ratdig">20</b> ]</span>
</td>
<td><strong>tab</strong>
</td>
</tr>
<tr class="stripe">
<td> </td>
<td>
<b>Polyamorous</b> (ver 7)
</td>
<td class="gray4"><span class="rating"><span class="r_4"></span></span> <span>[ <b class="ratdig">5</b> ]</span>
</td>
<td><strong>tab</strong>
</td>
</tr>
<tr>
<td> </td>
<td>
<b>Polyamorous</b> (ver 8)
<span rel="#info_952279" class="tabinfo">info</span>
<div class="dn" id="info_952279">
<font style="font-family:trebuchet ms;font-size:12px;font-weight:bold;line-height:120%"><b><font color="#DDDDCC">+</font> Difficulty:</b> <font color="#DDDDCC">novice</font>
<br>
</font>
<p style="margin-top:3px"><font style="font-family:trebuchet ms;font-size:12px;font-weight:bold;line-height:120%"><b><font color="#DDDDCC">+</font> Tuning:</b> <font color="#DDDDCC">Drop C#</font></font>
</p>
</div>
</td>
<td class="gray4"><span class="rating"><span class="r_5"></span></span> <span>[ <b class="ratdig">6</b> ]</span>
</td>
<td><strong>tab</strong>
</td>
</tr>
<tr class="stripe">
<td> </td>
<td>
<b>Polyamorous</b> Acoustic
<span rel="#info_258880" class="tabinfo">info</span>
<div class="dn" id="info_258880">
<font style="font-family:trebuchet ms;font-size:12px;font-weight:bold;line-height:120%"><b><font color="#DDDDCC">+</font> Difficulty:</b> <font color="#DDDDCC">novice</font>
<br>
</font>
</div>
</td>
<td class="gray4"><span class="rating"><span class="r_5"></span></span> <span>[ <b class="ratdig">9</b> ]</span>
</td>
<td><strong>tab</strong>
</td>
</tr>
</tbody>
</table>
In order to grab this table from the full html doc, here is a snippet of my C# code:
string source_code = web.DownloadString("https://www.ultimate-guitar.com/search.php?title="+ songArtist + songTitle + "&type%5B1%5D=200&rating%5B0%5D=4&rating%5B1%5D=5");
doc.LoadHtml(source_code);
HtmlNodeCollection resultsTable = doc.DocumentNode.SelectSingleNode("//table[#class='tresults']");
foreach(var cell in resultsTable.Descendants())
{
Console.WriteLine(cell.InnerHtml);
}
I am expecting to have the full contents of the table returned, except it stops at the line: <b class="play_tab_list" title="Playback"></b>
My ultimate goal is to return all of the links in the table, but I cannot even get as far as to see the full table.
This code will print the url for all links on the table.
var doc = new HtmlDocument();
var web = new WebClient();
string source_code = web.DownloadString("https://www.ultimate-guitar.com/search.php?title=breaking+benjamin+polyamorous&type[1]=200&rating[0]=4&rating[1]=5");
doc.LoadHtml(source_code);
HtmlNodeCollection links = doc.DocumentNode.SelectNodes("//a[contains(#class,'link')]");
foreach (var link in links)
{
Console.WriteLine("{0} {1}", link.InnerText, link.Attributes["href"].Value);
}
I have tried different options, but it did not work. The code generated pdf for English but does not work for other languages.
using (var ms = new MemoryStream())
{
// Create an iTextSharp Document which is an abstraction of a PDF but **NOT** a PDF
var doc = new Document();
{
// Create a writer that's bound to our PDF abstraction and our stream
var writer = PdfWriter.GetInstance(doc, ms);
{
// Open the document for writing
doc.Open();
string finalHtml = string.Empty;
// Read your html by database or file here and store it into finalHtml e.g. a string
// XMLWorker also reads from a TextReader and not directly from a string
using (var srHtml = new StringReader(sHtmlText))
{
// Parse the HTML
iTextSharp.tool.xml.XMLWorkerHelper.GetInstance().ParseXHtml(writer, doc, srHtml);
}
doc.Close();
}
}
// After all of the PDF "stuff" above is done and closed but **before** we
// close the MemoryStream, grab all of the active bytes from the stream
return new PDFFormFillerResult(ms, PDFFormFillerResultType.Success, string.Empty);
//bytes = ms.ToArray();
}
Well we had to buy another 3rd party tool which understands UNICODE characters.
I was able to create multi language PDF in English and Japanese.
The prerequisite for achieving this
1. To have appropriate Font which supports the languages you are planning to use.
2. Implement IFontProvider interface from iTextSharp and register the multi language font you will be using.
If you follow these 2 steps, you can create multi language PDF.
Code Sample:
public class smartUIFontProvider: IFontProvider
{
public Font GetFont(string fontname, string encoding, bool embedded, float size, int style, BaseColor color)
{
string myFont = #"C:\Tasks\Projects\SampleProject\iTextDemo_PDF\SmartFontUI\SmartFontUI.otf";
iTextSharp.text.pdf.BaseFont bfR;
bfR = iTextSharp.text.pdf.BaseFont.CreateFont(myFont,
iTextSharp.text.pdf.BaseFont.IDENTITY_H,
iTextSharp.text.pdf.BaseFont.EMBEDDED);
iTextSharp.text.BaseColor clrBlack =
new iTextSharp.text.BaseColor(0, 0, 0);
iTextSharp.text.Font fntHead =
new iTextSharp.text.Font(bfR, 12, iTextSharp.text.Font.NORMAL, clrBlack);
return fntHead;
}
public bool IsRegistered(string fontname)
{
return true;
}
}
static void Main (string[] args)
{
// step 1
Document document = new Document();
Byte[] bytes;
var fileName = "resources\\test_" + System.DateTime.Now.ToString("ddMMyyyy_hhmm") + ".pdf";
var testFile = Path.Combine(System.IO.Path.GetDirectoryName(System.Reflection.Assembly.GetExecutingAssembly().Location), fileName);
MemoryStream ms = new MemoryStream();
// step 2
using (var writer = PdfWriter.GetInstance(document, ms))
{
document.Open();
String example_html = #" <!DOCTYPE html> <html> <head> </head> <body> <h1>Change of Control Application</h1> <br/> <p>Please fill out this form if there are updates to your current organization and its relationship Company has on file with the legal binding entity. Company will review the information and may ask you to provide further information before Company agrees to the requested changes.</p> <br/> <table class='bodyText1LIC general' style='width:700px' id='tblInputForm' > <tr> <td class='bodyText1LIC' colspan='4'> </td> </tr> <tr> <td class='tableBody1' colspan='4'> <h3>Licensee Information</h3> </td> </tr> <tr> <td class='bodyText1SerNo'>1.</td> <td class='bodyText1LIC'>Licensee Name </td> <td valign='top' class='txtboxtd'> 字詰めなどの調整をおすすめします </td> <td> </td> </tr> <tr> <td class='bodyText1LIC' colspan='4'> </td> </tr> <tr> <td class='tableBody1' colspan='4'> <h3>Licensee Primary Contact Information </h3> </td> </tr> <tr> <td class='bodyText1SerNo'>2.</td> <td class='bodyText1LIC'>Name</td> <td class='txtboxtd'> めなどの調整 </td> <td> </td> </tr> <tr> <td class='bodyText1SerNo'>3.</td> <td class='bodyText1LIC'>Job Title</td> <td class='txtboxtd'> T</td> <td> </td> </tr> <tr> <td class='bodyText1SerNo'>4.</td> <td class='bodyText1LIC'>Mailing Address</td> <td class='txtboxtd'>めなどの調整</td> <td> </td> </tr> <tr> <td class='bodyText1SerNo'>5.</td> <td class='bodyText1LIC'>Telephone Number </td> <td class='txtboxtd'>T</td> <td> </td> </tr> <tr> <td class='bodyText1SerNo'>6.</td> <td class='bodyText1LIC'>Email Address </td> <td class='txtboxtd'>abc#test.com</td> <td> </td> </tr> <tr> <td class='bodyText1LIC' colspan='4'> </td> </tr> <tr> <td class='tableBody1' colspan='4'> <h3> Organizational Structure</h3> </td> </tr> <tr> <td class='bodyText1SerNo'> 7.</td> <td class='bodyText1LIC' colspan='3'> Will your Company's Name Change? </td> </tr> <tr> <td></td> <td colspan='3'> Yes</td> </tr> <tr class='nc' id='TrCompanyName'> <td></td> <td class='bodyText1LIC' colspan='2'> a) New company name </td> <td class='txtboxtd'> DSFDASFASDFDSA</td> </tr> <tr class='nc' id='TrEffectiveDate'> <td></td> <td class='bodyText1LIC' colspan='2'> b) Effective Date Company change will take place </td> <td class='txtboxtd'> 04/20/2017</td> </tr> <tr> <td class='bodyText1SerNo'>8.</td> <td class='bodyText1LIC' colspan='3'>Has your Company been Reincorporated or under gone an Internal Reorganization? </td> </tr> <tr> <td></td> <td colspan='3'> No</td> </tr> <tr> <td class='bodyText1LIC' colspan='4'> </td> </tr> <tr> <td class='tableBody1' colspan='4'> <h3>Assets / Stocks to be Acquired </h3> </td> </tr> <tr> <td class='tableBody1' colspan='4'> <h3>Assets to be Acquired</h3> </td> </tr> <tr> <td class='bodyText1SerNo'>9.</td> <td class='bodyText1LIC' colspan='3'>Will some or all of your Company’s Assets be Acquired? </td> </tr> <tr> <td></td> <td colspan='3'> No</td> </tr> <tr> <td class='bodyText1LIC' colspan='4'> </td> </tr> <tr> <td class='tableBody1' colspan='4'> <h3>Stocks to be Acquired </h3> </td> </tr> <tr> <td class='bodyText1SerNo'>10.</td> <td class='bodyText1LIC' colspan='3'>Will some or all of your Company’s Assets be Acquired? </td> </tr> <tr> <td></td> <td colspan='3'> No</td> </tr> <tr> <td class='bodyText1LIC' colspan='4'> </td> </tr> <tr> <td class='tableBody1' colspan='4'> <h3> Effects of Change to Licensee</h3> </td> </tr> <tr> <td class='bodyText1SerNo'> 11.</td> <td class='bodyText1LIC' colspan='3'> Please indicate which Company is the Surviving Legal Entity? </td> </tr> <tr> <td></td> <td class='txtboxtd' colspan='3'> T</td> </tr> <tr> <td class='bodyText1SerNo'>12.</td> <td class='bodyText1LIC' colspan='3'>Please provide the Company that will be the Licensee? </td> </tr> <tr> <td class='txtboxtd'> </td> <td colspan='3'> T</td> </tr> <tr> <td valign='top' class='bodyText1SerNo'>13.</td> <td class='bodyText1LIC' colspan='3'>Will any companies exist to operate as separate Subsidiaries or Affiliates ? </td> </tr> <tr> <td></td> <td colspan='3'> No</td> </tr> <tr> <td class='bodyText1LIC' colspan='4'> </td> </tr> <tr> <td class='tableBody1' colspan='4'> <h3>Existing Agreements</h3> </td> </tr> <tr> <td class='bodyText1SerNo'>14.</td> <td class='bodyText1LIC' colspan='3'>Please identify if any Licenses that will be affected by the Changes described above </td> </tr> <tr> <td></td> <td colspan='3'> No</td> </tr> <tr> <td class='bodyText1LIC' colspan='4'> </td> </tr> <tr> <td class='tableBody1' colspan='4'> <h3>Corporate Documentation</h3> </td> </tr> <tr> <td valign='top' class='bodyText1SerNo'>15.</td> <td class='bodyText1LIC' colspan='3'>Please Select from 1 of the 2 options listed below</td> </tr> <tr> <td></td> <td colspan='3'> Please Describe the Full Legal Structure of this Organization Change in relation to Licensing.</td> </tr> <tr> <td></td> <td colspan='3'> ASDFSDAFDSAFADSFDASF </td> </tr> </table> </body> </html>";
String example_css = #"html { font-family: SmartFontUI; font-size: 14px; } h1, h2, strong { font-family: SmartFontUI; font-weight: bold; display: inline; } h1 { font-size: 18pt; } .main { font-size: 12pt; color: black; font-family: SmartFontUI, Arial, Sans-Serif; background-color: white; text-align: left; line-height: 1.4em; margin: 2%; } .mainDesc { width: 100%; margin: 10px 0; } span { float: left; display: block; width: 100%; margin-bottom: 5px; } .bodyText1SerNo { width: 2em; } .bodyText1LIC { width: 22em; } .txtboxspan { width: 32em; } .tableBody1 { width: 100%; } .nc { margin-left: 100px; } .subtitle { font-size: 16pt; }";
FontFactory.Register(Path.Combine(Environment.GetFolderPath(Environment.SpecialFolder.Fonts), "SmartFontUI.otf"), "SmartFontUI");
XMLWorkerHelper worker = XMLWorkerHelper.GetInstance();
MemoryStream msHtml = new MemoryStream(System.Text.Encoding.UTF8.GetBytes(example_html));
MemoryStream msCss = new MemoryStream(System.Text.Encoding.UTF8.GetBytes(example_css));
smartUIFontProvider smartUIFontObj = new smartUIFontProvider();
worker.ParseXHtml(writer, document, msHtml, msCss, System.Text.Encoding.UTF8, smartUIFontObj);
// step 5
document.Close();
}
bytes = ms.ToArray();
System.IO.File.WriteAllBytes(testFile, bytes);
}
Hello i need to select all tr,but in some tr i have a table with id=WHITE_BANKTABLE.
I need to select only Tr that dont't have this table with id.
My html
<table id=mytable_body>
<TR id=TR_ROW_BANKTABLE class=TR_ROW_BANKTABLE style="BACKGROUND-COLOR: #f6f8fa" align=right bgColor=#f6f8fa>
<TD noWrap align=right w_idth="190"> </TD>
<TD align=right>010073/15922</TD>
</TR>
> **//This Tr with TABLE id=WHITE_BANKTABLE i don't need**
<TR>
<TD colSpan=8 align=center>
<TABLE id=WHITE_BANKTABLE cellSpacing=0 borderColorDark=#edf0f5 cellPadding=3 width="100%" bgColor=white borderColorLight=#edf0f5 border=1 isWhiteTable="Y">
<TBODY>
<TR class=TR_BANKTABLE align=right vAlign=top>
<TD> sdfsd </TD>
<TD>sdfs</TD>
</TR>
</TBODY>
</TABLE>
</TD>
</TR>
<TR id=TR_ROW_BANKTABLE class=TR_ROW_BANKTABLE style="BACKGROUND-COLOR: #f6f8fa" align=right bgColor=#f6f8fa>
<TD noWrap align=right w_idth="190"> </TD>
<TD align=right>010073/15922</TD>
</TR>
</table>
Thanx.
Assuming the above is correctly formatted as XML (insert missing double quotes):
var q =
xml.XPathSelectElements(#"/tr[not(descendant::table[#id = 'WHITE_BANKTABLE'])]");
I have following HTML.
<div id = "aa">
<table width="100%">
<tbody>
<!-- ngRepeat: msg in globalChat -->
<tr class="ng-scope" ng-repeat="msg in globalChat" ng-1375781897068="8">
<td class="ng-binding" ng-1375781897068="9">
A
</td>
</tr>
<tr class="ng-scope" ng-repeat="msg in globalChat" ng-1375781897068="10">
<td class="ng-binding" ng-1375781897068="11">
B
</td>
</tr>
<tr class="ng-scope" ng-repeat="msg in globalChat" ng-1375781897068="12">
<td class="ng-binding" ng-1375781897068="13">
C
</td>
</tr>
<tr class="ng-scope" ng-repeat="msg in globalChat" ng-1375781897068="14">
<td class="ng-binding" ng-1375781897068="15">
D
</td>
</tr>
<tr class="ng-scope" ng-repeat="msg in globalChat" ng-1375781897068="16">
<td class="ng-binding" ng-1375781897068="17">
E
</td>
</tr>
<tr class="ng-scope" ng-repeat="msg in globalChat" ng-1375781897068="18">
<td class="ng-binding" ng-1375781897068="19">
F
</td>
</tr>
<tr class="ng-scope" ng-repeat="msg in globalChat" ng-1375781897068="20">
<td class="ng-binding" ng-1375781897068="21">
G
</td>
</tr>
<tr class="ng-scope" ng-repeat="msg in globalChat" ng-1375781897068="22">
<td class="ng-binding" ng-1375781897068="23">
H
</td>
</tr>
<tr class="ng-scope" ng-repeat="msg in globalChat" ng-1375781897068="24">
<td class="ng-binding" ng-1375781897068="25">
I
</td>
</tr>
<tr class="ng-scope" ng-repeat="msg in globalChat" ng-1375781897068="26">
<td class="ng-binding" ng-1375781897068="27">
J
</td>
</tr>
<tr class="ng-scope" ng-repeat="ms`enter code here`g in globalChat" ng-1375781897068="28">
<td class="ng-binding" ng-1375781897068="29">
K
</td>
</tr>
</tbody>
</table>
</div>
I have used AngularJS to render values
I simply want that if I click on any text in div then only that particular text should be highlighted in div. And by clicking on other text in div previously selected text should be deselected and new text should be selected. How can I do this?
Is this what you were looking for:
http://jsfiddle.net/bT8vs/
The jQuery:
$(document).ready(function(){
$('div p').click(function(){
$('div p').css("background-color", "transparent");
$(this).css("background-color", "yellow");
});
});
This is pretty much the same answer as imconnell, but applied to the given layout: http://jsfiddle.net/rpqvX/7/
$(function() {
$("td.ng-binding").click(function() {
$("td.ng-binding").removeClass("highlight");
$(this).addClass("highlight");
});
})
Just as an alternative, have a look at the following jQuery plugin:
highlight: JavaScript text higlighting jQuery plugin