Question

i have a list:

<asp:ListBox ID="lstProblems" runat="server" SelectionMode="Multiple"></asp:ListBox>

and i am populating it this way:

$(function() {
        $.get('../file.txt', function(data) {
            var output = data.split('\n'),
            tmp = '';
            for (i = 0; i < output.length; i++) {
                tmp += '<option value=' + output[i] + '>' + output[i] + '</option>';
            }
            $('#lstProblems').html(tmp);

        });
    });

i would like to know how i can convert this to be a regular HTML list? i need this because of this question: increase height of listbox in IE7

update
i changed the html to:

<select size="4" name="lstProblems" multiple="multiple" id="lstProblems" CssClass="list-problems">

and added this to css:

.list-problems {
    height:600px !important;
    display:inline-block;
}

neither IE nor chrome noticed a difference

could there be something overriding this?

here’s everything that im including:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js" type="text/javascript"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.8.16/jquery-ui.js" type="text/javascript"></script>


<link href="../niceforms/niceforms-default.css" rel="stylesheet" type="text/css" />
<script src="../niceforms/niceforms.js" type="text/javascript"></script>

<link href="../jquery-ui-1.8.16.custom.css" rel="stylesheet" type="text/css" />

here’s the source from IE: http://pastebin.com/7vsF11Yq

Answer 1

Just add a class to the ASP.NET control and then use CSS as per the other question.
The ASP.NET control will be rendered as a standard HTML list with a css class specified.

So change your markup to

<asp:ListBox ID="lstProblems" runat="server" SelectionMode="Multiple" CssClass="list-problems"></asp:ListBox>

And then use the following CSS

.list-problems {
    height:200px !important; 
    display:inline-block;
}