disable select dropdown during .getjson jquery call and reenable after complete

Question

i have the following code where i getJSON after i click on a select box. Sometimes it takes a long time and the users are clicking on the dropdown again during the server side processing.

Is there anyway to disable the dropdown during the server side call and reenabled it after the processing is complete.

here is my code

 <script type="text/javascript">
        $(document).ready(function() {

            $('#userDropdown').change(function() {
                if (this.selectedIndex != 0) {
                    var URL = "/Users/GetUserJson/" + this.value;

                    $.getJSON(URL, function(data) {

                         var userID = data.UserId;
                         var userColor = data.UserColor;

                         . . . .

Answer 1

Nerdling suggested that you hide the select, but I'd rather just disable it, just like you said yourself:

$('#userDropdown').change(function() {
    // Assign the select in a variable
    var sel = $(this);
    if (this.selectedIndex != 0) {
        // Disable it
        sel.attr('disabled', 'disabled')
        var URL = "/Users/GetUserJson/" + this.value;

        $.getJSON(URL, function(data) {

            var userID = data.UserId;
            var userColor = data.UserColor;

            // Enable it
            sel.removeAttr('disabled');

            ...