只读文本的HTML标签

Question

Which html element should I use when using a Label for text?

I need to set the text of the element to a client name that is selected from an jqueryui autocomplete control.

I've tried using a span, which works in Chrome but not in IE. Is there a recommended way of doing this?

html:

<p>
     <label for="ClientLabel">Client:</label>
     <span id="ClientLabel" style="width: 160px; font-weight: bold;" />
</p>

autocomplete javascript:

$('#ClientSearchAutocomplete').autocomplete(
            {
                source: "/Report/ClientAutocompleteJSON",
                select: function (event, ui) {                    
                    $('#ClientLabel').text(ui.item.value);
                    $('#ClientLabel').val(ui.item.id);                        
                }
            });

Answer 1

Input with type text has a text value and a readonly property. It will look like a input box which you may want to style so as not to confuse the user.

<input type="text" name="ClientName" value="YourValue" readonly="readonly" />

Answer 2

The .val() method is used to get the values of form elements such as input, select and textarea. You are trying to use val() on a span which obviously doesn't work.

Replace it with a readonly input or store the ID in another hidden input element.