diff --git a/app/static/css/main.css b/app/static/css/main.css index 80ad07a..d5dc8b6 100644 --- a/app/static/css/main.css +++ b/app/static/css/main.css @@ -293,4 +293,8 @@ h1, h2, h3, h4, h5, h6{ #dish_choices { margin: 0.5em 1em 1.5em; + transition: opacity 0.2s; +} +#dish_choices.loading { + opacity: 0.2; } diff --git a/app/templates/order.html b/app/templates/order.html index 8099c18..e0bf1d8 100644 --- a/app/templates/order.html +++ b/app/templates/order.html @@ -207,10 +207,14 @@ {% if order.location %} function updateChoices() { + $("#submit-reveals-options-msg").hide(0); + $dish_choices = $("#dish_choices"); + $dish_choices.addClass("loading"); + var dish_id = $("#dish_id").val(); var url = "{{ url_for('general_bp.location_dish', location_id=order.location.id, dish_id='DISHID') }}".replace("DISHID", encodeURI(dish_id)); - $dish_choices = $("#dish_choices"); $dish_choices.find("select").attr("disabled", "disabled"); + $.get(url) .done(function(data) { $dish_choices.html(""); @@ -254,8 +258,11 @@ ); choiceSelect.select2({"sorter": sortArg}); } + $dish_choices.removeClass("loading"); }).fail(function() { $("#dish_choices").html("Could not load choices"); + $dish_choices.removeClass("loading"); + $("#submit-reveals-options-msg").show(0); }); } $("#dish_id").on("change", updateChoices);