We Keep Coding

how to get the text that has been selected from listitem of an unordered list in content page in asp.net

I need to know which listitem is selected from the unordered list which is there in the master page.
So basically when i click on any list item from the content page i need to know the is of the item that is clicked and perform some action.
i tried the following code but i am not able to add the click action and get the id of the selected list.
Control list = this.Master.FindControl("mainsection").FindControl("maindiv").FindControl("sideNav").FindControl("sideNavMenu");
Please help me
Edited code :
<ul id = "sortable1">
<li id = "Coffee">Coffee</li>
<li id = "tea">Tea
<ul>
<li id = "Black tea">Black tea</li>
<li id = "green tea">Green tea</li>
</ul>
</li>
<li id = "Milk">Milk</li>
<li style="display: list-item;" class="emptyMessage">No more contacts available</li></ul>

Add <asp:HiddenField ID="hdnListId" runat="server"></asp:HiddenField> in your html. Give clickable class to each li you want to save id.
Add following javascript.
$(function() {
$("li.clickable").click(function() {
$('#' + '<%=hdnListId.ClientID%>').val(this.id);
});
});
On server side, You can simply get value from hdnListId.Value

Hide <li> element if a scope value is null

I want to hide certain items in my list depending on whether a scope value is null.
This is my controller:
angular.module("umbraco").controller("my.custom.grideditorcontroller", function ($scope) {
$scope.control.heading;
$scope.control.punkt1 = null;
$scope.control.punkt2 = null;
$scope.control.punkt3 = null;
$scope.control.punkt4 = null;
$scope.control.punkt5 = null;
});
I have 5 li elements as well, that I want to show/hide depending on whether each of these scope properties has
This is one of my li elements:
<li ng-hide="control.punkt5 == null">#Model.punkt5</li>
This doesn't work, as the element is still being shown.
My properties use 2-way binding with my input elements:
<input type="text" ng-model="control.punkt1" placeholder="Indtast første punkt...">
But the input and the li elements are located in 2 separate HTML documents, since I am creating a grid editor for Umbraco.
This is my folder structure: https://i.imgur.com/ZbejcOl.png
Where the infobox.cshtml file contains the li elements, and the infobox.html file contains the input elements.
I tried using razoe code in my ng-hide/show condition, but that didn't return any boolean values. What is the correct way to approach this without using razor?
My render view (infobox.cshtml) receives a dynamic model of type JObject, but I can't use any of its methods in my ng-hide condition as it is c#. I've tried everything as mentioned in my previous post.
Edit:
<div ng-controller="my.custom.grideditorcontroller">
<div class="list-group">
<div class="list-group-item">
<h4 class="list-group-item-heading">#Model.heading</h4>
<ul class="ul-with-bullets">
<li ng-show="IsProperty(#Model,'punkt1')">#Model.punkt1</li>
<li ng-show="#Model.GetType().GetProperty("punkt2") != null">#Model.punkt2</li>
<li ng-show="#Model.GetType().GetProperty("punkt3") != null">#Model.punkt3</li>
<li ng-show="#Model.GetType().GetProperty("punkt4") != null">#Model.punkt4</li>
<li ng-hide="control.punkt5">#Model.punkt5</li>
</ul>
</div>
</div>
</div>

use this code
$scope.control={
punkt1:null,
punkt2:null,
punkt3:null,
punkt4:null,
punkt5:null
};
and now in your view you can check your control properties

comparing the page's url to a's href

i am trying to do that when the page's url equals the <a>'s href than it will change something's class.
it does changes the page on a click on the link, but it doesnt change the class of the <li>
here is what i have done:
html:
<div id='settingNev' >
<ul >
<li id="L1" runat="server"><a id="A1" href="../newsFeed/allEr.aspx" runat="server"><span>Er</span></a></li>
<li id="L2" runat="server"><a id="A2" href="../newsFeed/allEe.aspx" runat="server"><span>Ee</span></a></li>
</ul>
</div>
code behind:
if (A1.HRef.ToString() == Request.Url.ToString())
{
L1.Attributes.Add("class", "active");
}
if (A2.HRef.ToString() == Request.Url.ToString())
{
L2.Attributes.Add("class", "active");
}
the class active works, i have checked it.
by the way this code is on a master page connected to both pages in the <div id='settingNev' >.
Tnx for the help :D

The problme is A1.HRef returns relative url. On the other hands, Request.Url returns absolute url.
In order to fix it, you want to use server control for hyper link, and resolve it back to absolute path.
<ul>
<li id="L1" runat="server">
<asp:HyperLink runat="server" ID="A1HyperLink"
NavigateUrl="~/newsFeed/allEr.aspx">
<span>Er</span>
</asp:HyperLink>
</li>
</ul>
string url = Request.Url.PathAndQuery;
string a1 = ResolveUrl(A1HyperLink.NavigateUrl);
if (string.Equals(a1, url, StringComparison.InvariantCulture))
{
L1.Attributes.Add("class", "active");
}
Another method
Resolve A1's relative path to absolute path using ResolveUrl
<div id='settingNev' >
<ul >
<li id="L1" runat="server"><a id="A1"
href="../newsFeed/allEr.aspx"
runat="server"><span>Er</span></a></li>
</ul>
</div>
string url = Request.Url.PathAndQuery;
string a1 = ResolveUrl(A1.HRef);
if (string.Equals(a1, url, StringComparison.InvariantCulture))
{
L1.Attributes.Add("class", "active");
}

You need to convert the relative url to absolute in order to compare with the page url.
For some odd reason, I couldn't find any Url helper that supports parent paths in URL so the only workaround I can think of is using Server.MapPath() for this:
string pagePath = Server.MapPath(Request.FilePath);
Dictionary<HtmlAnchor, Label> anchorMapping = new Dictionary<HtmlAnchor, Label>();
anchorMapping.Add(A1, L1);
anchorMapping.Add(A2, L2);
foreach (HtmlAnchor currentAnchor in anchorMapping.Keys)
{
if (Server.MapPath(currentAnchor.HRef).Equals(pagePath))
{
anchorMapping[currentAnchor].Attributes.Add("class", "active");
break;
}
}

Extract text from a div

I am trying to make a DropDownList using divs and jquery (so that I can style it as I want)...and its working but the problem is I cant get the selected value from the list..
After selection of the option I am copying the selected value into the a div.. and I want to extract this using c# (in .aspx.cs page)... I've tried to do it using string builder and innerHtml(after adding runat="server" to the div).. but it doesn't work ...code is as follows
.aspx Page:
<div class="ddl">
<div id="lowertriangle" class="lowertriangle"></div>
<div id="uppertriangle" class="uppertriangle"></div>
<div id="label" class="labeldiv_dd" runat="server"></div>//***This is the div from which I want to extract value***
<div id="options" class="optionsidv_dd">
<ul id="options_ul">
<li id="0">Select One Option</li>
<li id="1">Option 1</li>
<li id="2">Option 2</li>
<li id="3">Option 3</li>
<li id="4">Option 4</li>
<li id="5">Option 5</li>
</ul>
</div>
</div>
aspx.cs page
Method 1 that I tried:
string sel_text = label.InnerHtml;
display_sel_value.Text = sel_text.ToString();
2nd method:
var sb = new StringBuilder();
label.RenderControl(new HtmlTextWriter(new StringWriter(sb)));
string s = sb.ToString();
Kindly point out my mistakes and help me in this regard(in extracting innerHTML of the div that is).
Thanks

No, putting content in a div won't work.
Your example isn't complete enough to see all that happens, but let's assume that you're in a standard <form>, you're setting the div's inner HTML to a value with Javascript and then you're submitting in the standard way.
Then one way to do what you want is to use a hidden input and setting its value attribute instead of its contents.
<input id="label" class="labeldiv_dd" runat="server" type="hidden">
In the codebehind, the C# can retrieve the value from this control after submitting with the .Value property.

Ok guys thx for your replies..I found a way around the problem...I used HiddenField control to store the selected value using jQuery like so
$("#options_ul li").click(function () {
var text = this.innerHTML;
***$('#<%= selectedvalue.ClientID %>').val(text);***
$("#options_ul li").css("background-color", "#c2c2c2");
$(this).css("background-color", "white");
//var prev = this.id;
//document.getElementById("label").innerHTML = text;
toggleHeight();
});
and then accessed it server side using
selectedvalue.value;
PS: "selectedvalue" is id of the hiddenfield control

Dynamic loading a list from a model MVC 4

so I'm still pretty new in ASP.net MVC design. I am facing a small problem, which might have already been answered, but don't seem to find an answer that will fit my purpose. Here is what's happening:
Say I have a model with 2 links: Category & Item, and it's a 1 to many relation. What I want to do is generate a list containing Category.Title (which I have completed, using the code following) and clicking on the each list item will generate a list of all Item.Title values of that category. The base idea of the html is:
<div id="cat"><!--float = left-->
<ul>
<li>List<li>
</ul>
</div>
<div id="item"> <!--float = right -->
<ul>
<li>List<li>
</ul>
</div>
Here is how everything is linked up so far:
public ActionResult Equipment()
{
ViewBag.Cat= getCat(1); // Will return a list of categories of ID 1
return View();
}
As for the view:
#{ List<X.Models.Category> catX = ViewBag.Cat; }
BODY:
<div id="pl_categories">
<ul id="pl_ec_ul">
#foreach (X.Models.Category item in catX)
{
<li id="pl_ec_li">
<div id="pl_ec_liItem">
#item.catTitle
</div>
</li>
}
</ul>
</div>
<div id="pl_values">
<ul id="pl_ev_ul">
<li id="pl_ev_li">
<div id="pl_ev_liItem">
???
</div>
</li>
</ul>
I have seen a bunch of examples, but they all involve dropdowns or what not. Here are a quick checklist of what I am trying to accomplish:
On page laod, default selected category will be the first in the list. If list is null, a simple "No Categories" is shown. Edit: if the category is empty, it will show No Items in Category.
On clicking an item in the category it will show the items of that category under pl_values.
I have tried to make this is small as possible but there are a lot more factors I need to consider. However, if I can solve this, I am certain to figure out the rest. If something however is not clear, please let me know and I can try and clarify it. Any help will be appreciated. Thank you.

For your item 1, you could try something like this (assuming your OK using jQuery):
$(document).ready(function() {
var count = $("#pl_ec_ul li").length;
if(count <= 0) {
$("#pl_categories").html("<p>No Categories</p>");
}
});