从div提取文本

Question

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

Answer 1

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.

Answer 2

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