I has a problem to creating HTML-list base on array in c#.
I tried using split.string, foreach, and etc,. but still can't figured out the logic... :(..
Anyone can help me to solve my problem ?
Here is my Array
List<string> listMenu = new List<string>();
listMenu.Add("Dashboard~View1");
listMenu.Add("Dashboard~View2");
listMenu.Add("Customer");
listMenu.Add("Part");
listMenu.Add("Part~Part1~Part11");
listMenu.Add("Part~Part1~Part12");
listMenu.Add("Part~Part2~Part21");
listMenu.Add("Part~Part2~Part22");
listMenu.Add("Part~Part3~Part31~Part311");
listMenu.Add("Part~Part3~Part31~Part312");
listMenu.Add("Branch");
And I want to create HTML list like this :
<div id=menu>
<ul>
<li>Dahboard
<ul>
<li> View1 </li>
<li> View2 </li>
</ul>
</li>
<li> Customer
</li>
<li> Part
<ul>
<li> Part1
<ul>
<li> Part11
</li>
<li> Part12
</li>
</ul>
</li>
<li> Part2
<ul>
<li> Part21
</li>
<li> Part22
</li>
</ul>
</li>
<li> Part3
<ul>
<li> Part31
<ul>
<li> Part 311
</li>
</ul>
</li>
<li> Part 312
</li>
</ul>
</li>
</ul>
</li>
<li> Branch
</li>
</ul>
</div>
There are two ways you can use to create this list dynamically:
You can use HtmlGenericControl structure as below:
HtmlGenericControl c = new HtmlGenericControl("div");
c.Attributes.Add("id", "menu");
HtmlGenericControl ul1 = new HtmlGenericControl("ul");
c.Controls.Add(ul1);
HtmlGenericControl li1 = new HtmlGenericControl("li");
li1.InnerText = "Dashboard";
ul1.Controls.Add(li1);
mainDiv.Controls.Add(c);
You can create a string with StringBuilder and assign this string as InnerHtml to your main div, as below:
StringBuilder s = new StringBuilder();
s.Append(#"<div id=menu>
<ul>
<li>Dahboard
<ul>
<li> View1 </li>
<li> View2 </li>
</ul>
</li>
</ul>
</div> "); //you can alter this string dynamically
mainDiv.InnerHtml = s.ToString();
You should add System.Web.UI.HtmlControls as using to use
HtmlControls
You should add System.Text as using in order to use StringBuilder.
Bonus: You can find from here why you should use StringBuilder
instead of adding string with '+'.
Related
I am trying to convert from html to .txt with HTML AGILITY PACK.
I would like to retain the numberings or letterings from the ordered or unordered list to keep the same rendering.
Given a HTML like :
<h1> Title </h1>
<h2> Sub Title </h2>
<ol>
<li style="list-style-type: lower-alpha;"> First element </li>
<li style="list-style-type: lower-alpha;"> Second element </li>
<li style="list-style-type: lower-alpha;"> Third element </li>
</ol>
<h3> Diferent title</h3>
<ol>
<li style="list-style-type: lower-roman;"> First element </li>
<li style="list-style-type: lower-roman;"> Second element </li>
</ol>
<h3> Diferent title</h3>
<p> Some text </p>
<ol>
<li> First element </li>
<li> Second element </li>
</ol>
<h3> Unordered list title</h3>
<ul>
<li> First element </li>
<li> Second element </li>
</ul>
I cannot find the way. I tried with this:
var htmlDoc = new HtmlDocument();
htmlDoc.LoadHtml(html);
var htmlBody = htmlDoc.DocumentNode.SelectSingleNode("//body");
var lists = htmlDoc.DocumentNode.SelectNodes("//ol"); //todas las <ol>
foreach (HtmlNode node in lists)
{
var elementInList = node.SelectNodes(".//li").Count;
Console.WriteLine("elementInList "+ elementInList);
for ( int i=0; i < elementInList;i++){
Console.WriteLine( i+1 + ". "+ node.SelectNodes(".//li")[i].InnerHtml);
}
But I do want it to appear in the text like that, to substitute the < li > in order to have the position like " 1. First Element" (not in the console)
Thank you in advance
I have this HTML header with <nav><ul><li> sections , the problem is that I'm trying to hide the LI section with id recfAct when in my CodeBehind brpt gets false
HTML
<header class="header" id="header1">
<h2>LISTADO tabla [TParUsuPerfil]</h2>
<nav class="menu">
<ul>
<li id="refAct">Actualizar </li>
<li id="refSalir">Salir </li>
</ul>
</nav>
</header>
C#
Boolean bRpt;
bRpt = wsObj.ValidarExiste(Session["LoginUsername"].ToString()); //gets false or true in brpt
Update :
Just need to add the tag runat ="server" and then i can call it in code behind
Html:
<li id="refAct" runat="server">Actualizar </li>
<li id="refSalir">Salir </li>
CodeBehind:
refAct.Visible = true;
I'm having a hard time to make <li> class to active when page is loaded. Here's my scenario I copied a sample Dropdown in a certain website to integrate it in my website. I'm using C# Asp.Net
_Layout.cshtml
<body>
<div id="header">
#Html.Partial("_HeaderPartial")
</div>
<!--SIDEBAR Navigation-->
<aside id="menu">
// The Dropdown
#Html.Partial("_SidebarPartial")
</aside>
<div id="wrapper">
#RenderBody()
<footer class="footer">
#Html.Partial("_FooterPartial")
</footer>
</div>
<div id="right-sidebar" class="animated fadeInRight">
#Html.Partial("_RightSidebarPartial")
</div>
</body>
_SidebarPartial
<ul class="nav" id="side-menu">
<li>
<span class="nav-label">Dashboard</span>
</li>
<li>
<span class="nav-label">Analytics</span>
</li>
<li>
<span class="nav-label">Interface</span><span class="fa arrow"></span>
<ul class="nav nav-second-level">
<li>Panels design</li>
<li>Typography</li>
<li>Colors & Buttons</li>
<li>Components</li>
<li>Alerts</li>
<li>Modals</li>
</ul>
</li>
<li>
<span class="nav-label">App views</span><span class="fa arrow"></span>
<ul class="nav nav-second-level">
<li>Contacts</li>
<li>Projects</li>
<li>Project detail</li>
<li>App plans</li>
<li>Social board</li>
</ul>
</li>
<li>
<span class="nav-label">Charts</span><span class="fa arrow"></span>
<ul class="nav nav-second-level">
<li>ChartJs</li>
<li>Flot charts</li>
<li>Inline graphs</li>
</ul>
</li>
<li>
<span class="nav-label">Box transitions</span><span class="fa arrow"></span>
<ul class="nav nav-second-level">
<li><span class="label label-success pull-right">Start</span> Overview </li>
<li>Columns from up</li>
</ul>
</li>
</ul>
As I commented, here is a small example with an id attribute on the list:
<ul class="nav" id="side-menu">
<li id="interfaces">
<span class="nav-label">Interface</span><span class="fa arrow"></span>
<ul class="nav nav-second-level">
<li>Panels design</li>
<li>Typography</li>
<li>Colors & Buttons</li>
<li>Components</li>
<li>Alerts</li>
<li>Modals</li>
</ul>
</li>
</ul>
And then you could add the following line to the document.ready function:
$("#interfaces").attr("class", "active");
Check this out. This will also help you
just write the following code inside document.ready function
$('#interfaces').addClass('active');
Cheers
I have to parse html like this:
<div class="navig-nav">
<ul class="navig" id="navigmenu">
<li class="navig-expanded navig-selected">Company</li>
<li class="navig-sub"><div>Summary</div></li>
<li class="navig-sub">Some</li>
<li class="navig-sub">Interesting</li>
<li class="navig-sub">Information</li>
<li class="navig-item"><div>From</div></li>
<li class="navig-item"><div>Web</div></li>
<li class="navig-item"><div>Page</div></li>
</ul>
</div>
In this menu (as you can see) all classes has more than one child. How can I get "any_url_2" using csQuery if I have just the name "Interesting"?
What about
dom["a:contains('Interesting')"];
Well here's a more complete query:
CQ dom = "your html here";
var result = dom["a[href='any_url_2']:contains('Interesting')"];
if (result.Length == 1)
{
Console.WriteLine(result[0].Attributes["href"]);
}
Is this:
dom[".navig-sub"].Find("a:contains('Interesting')")
a good answer?
I have the following HTML
<div id='cssmenu'>
<ul>
<li class= 'has-sub'>
<a href=store.aspx?id=dLYTWvt8EsHOq7Ps2wJA9A%3d%3d&digest=tNy7s/jOrynR4pvMVN6d6Q==><span>Armed Combat</span></a>
<ul>
<li class= 'has-sub'>
<a href=store.aspx?id=xEDEzZWDRkX8%2fbXoMX2pSQ%3d%3d&digest=tNy7s/jOrynR4pvMVN6d6Q==><span>Armed Combat 1-2</span></a>
<ul>
<li class= 'active'><a href=store.aspx?id=TxlSRrnSZ6HDgj%2b2ZSxRhg%3d%3d&digest=tNy7s/jOrynR4pvMVN6d6Q==><span>Dance -1</span></a></li>
<li class= 'active'><a href=store.aspx?id=Y7JxNAXSuG1T%2f0cpjQXSwA%3d%3d&digest=tNy7s/jOrynR4pvMVN6d6Q==><span>Dance - 2</span></a></li>
<li class= 'active'><a href=store.aspx?id=%2fcoJMcJTjWp3%2bPuimR5AhA%3d%3d&digest=tNy7s/jOrynR4pvMVN6d6Q==><span>Armed Combat 1-5</span></a></li>
</ul>
</li>
<li class= 'has-sub'>
<a href=store.aspx?id=KC2g4igBzXisbsbKu%2fKrzw%3d%3d&digest=tNy7s/jOrynR4pvMVN6d6Q==><span>Armed Combat 1-3</span></a>
<ul>
<li class= 'active'><a href=store.aspx?id=8DCHnP%2b4KQVYDTGxVt9snQ%3d%3d&digest=tNy7s/jOrynR4pvMVN6d6Q==><span>Death -1</span></a></li>
<li class= 'active'><a href=store.aspx?id=nGEm4rbNMQ%2bQfyO44ECmpA%3d%3d&digest=tNy7s/jOrynR4pvMVN6d6Q==><span>Death - 1</span></a></li>
</ul>
</li>
<li class= 'has-sub'><a href=store.aspx?id=feki%2bXDs66obnO1e2dxHWg%3d%3d&digest=tNy7s/jOrynR4pvMVN6d6Q==><span>Armed Combat 1-4</span></a></li>
<li class= 'has-sub'><a href=store.aspx?id=5O394Lww9oxD1vHbIY7LWw%3d%3d&digest=tNy7s/jOrynR4pvMVN6d6Q==><span>Armed Combat 1-6</span></a></li>
</ul>
</li>
<li class= 'active'><a href=store.aspx?id=RIe63RBggHzj76SUwDHKMg%3d%3d&digest=tNy7s/jOrynR4pvMVN6d6Q==><span>Dance</span></a></li>
</ul>
</div>
And in reqid
var reqid = "<%=Request["id"]%>";
In reqid I will get urlencoded based on menu selection
My jQuery code here
$(function () {
var str = $("#cssmenu").find('li').find('a').attr('href');
if ($(str).has(reqid)) {
var str2 = $("#cssmenu").find('li').find('a').text();
$('#selectedmenuitem').html(str2);
}
});
If the href attribute encoded url contains selected menu item encodedurl i want to get the matched url .text() to the #selectedmenuitem label id.
I checked with contains, am not getting. Please suggest me what are other possibilities for this.
use indexOf function of Javascript
http://www.w3schools.com/jsref/jsref_indexof.asp
Use following jquery code
$(function () {
var str2= $("#cssmenu").find("li").find("a[href*='" + reqid + "']").text();
$('#selectedmenuitem').html(str2);
});