how to disable the multiple selection from the list box using jquery? or javascript?

Question

I have a list box in my page..

<td><%=Html.ListBox("listServiceTypes", Model.ServiceTypeListAll, new { style = "width: 500px;height:200px;" })%>

I need to disabled selecting multiple items from the list box? I am doing something like selecting one item and click delete button my page its delting one item from list box.. but If I select multple Items its throwing an error message/.?

Can any body help me out how to deactive or disable multiple items from list box

Answer 1

You could do that with the following jQuery:

$(function(){
  $("select[name='listServiceTypes']").removeAttr('multiple');
});

However, it would be much better to do it at the server side. Rather than using Html.ListBox, it would be better to use Html.DropDownList:

<%=Html.DropDownList("listServiceTypes", 
                Model.ServiceTypeListAll, 
                new { style = "width: 500px;height:200px", size=4 }); %>

This removes the need from having to do any jQuery/JavaScript to remove the multiple attribute as it produces pretty much the same HTML but without the multiple attribute. Having a value for size that is greater than 1 tells the browser to display it as a multi-line list box.

Answer 2

This script will turn off multiple selection for all select controls on the page.

<script type="text/javascript">
    $(document).ready(function () {
        $('select').removeAttr('multiple');
    });
</script>