diff --git a/app/Http/Controllers/BudgetController.php b/app/Http/Controllers/BudgetController.php
index 76d3683f16..a4a6866fe1 100644
--- a/app/Http/Controllers/BudgetController.php
+++ b/app/Http/Controllers/BudgetController.php
@@ -79,7 +79,7 @@ class BudgetController extends Controller
      *
      * @return \Illuminate\Http\JsonResponse
      */
-    public function amount(Request $request, Budget $budget)
+    public function amount(Request $request, BudgetRepositoryInterface $repository, Budget $budget)
     {
         $amount      = strval($request->get('amount'));
         $start       = Carbon::createFromFormat('Y-m-d', $request->get('start'));
@@ -88,9 +88,15 @@ class BudgetController extends Controller
         if (0 === $amount) {
             $budgetLimit = null;
         }
+
+        // calculate left in budget:
+        $spent    = $repository->spentInPeriod(new Collection([$budget]), new Collection, $start, $end);
+        $currency = app('amount')->getDefaultCurrency();
+        $left     = app('amount')->formatAnything($currency, bcadd($amount, $spent), true);
+
         Preferences::mark();
 
-        return Response::json(['name' => $budget->name, 'limit' => $budgetLimit ? $budgetLimit->id : 0, 'amount' => $amount]);
+        return Response::json(['left' => $left, 'name' => $budget->name, 'limit' => $budgetLimit ? $budgetLimit->id : 0, 'amount' => $amount]);
     }
 
     /**
diff --git a/app/Repositories/Budget/BudgetRepository.php b/app/Repositories/Budget/BudgetRepository.php
index f5329ab466..aa60bda9a8 100644
--- a/app/Repositories/Budget/BudgetRepository.php
+++ b/app/Repositories/Budget/BudgetRepository.php
@@ -37,6 +37,7 @@ use FireflyIII\Repositories\Account\AccountRepositoryInterface;
 use FireflyIII\User;
 use Illuminate\Database\Eloquent\Builder;
 use Illuminate\Support\Collection;
+use Log;
 use Navigation;
 use stdClass;
 
@@ -611,6 +612,7 @@ class BudgetRepository implements BudgetRepositoryInterface
                          ->where('budget_limits.start_date', $start->format('Y-m-d'))
                          ->where('budget_limits.end_date', $end->format('Y-m-d'))
                          ->get(['budget_limits.*'])->count();
+        Log::debug(sprintf('Found %d budget limits.', $limits));
         // there might be a budget limit for these dates:
         /** @var BudgetLimit $limit */
         $limit = $budget->budgetlimits()
@@ -620,6 +622,7 @@ class BudgetRepository implements BudgetRepositoryInterface
 
         // if more than 1 limit found, delete the others:
         if ($limits > 1 && null !== $limit) {
+            Log::debug(sprintf('Found more than 1, delete all except #%d', $limit->id));
             $budget->budgetlimits()
                    ->where('budget_limits.start_date', $start->format('Y-m-d'))
                    ->where('budget_limits.end_date', $end->format('Y-m-d'))
@@ -627,19 +630,23 @@ class BudgetRepository implements BudgetRepositoryInterface
         }
 
         // delete if amount is zero.
-        if (null !== $limit && bccomp('0', $amount) < 0) {
+        // Returns 0 if the two operands are equal,
+        // 1 if the left_operand is larger than the right_operand, -1 otherwise.
+        if (null !== $limit && bccomp($amount, '0') <= 0) {
+            Log::debug(sprintf('%s is zero, delete budget limit #%d', $amount, $limit->id));
             $limit->delete();
 
             return new BudgetLimit;
         }
         // update if exists:
         if (null !== $limit) {
+            Log::debug(sprintf('Existing budget limit is #%d, update this to amount %s', $limit->id, $amount));
             $limit->amount = $amount;
             $limit->save();
 
             return $limit;
         }
-
+        Log::debug('No existing budget limit, create a new one');
         // or create one and return it.
         $limit = new BudgetLimit;
         $limit->budget()->associate($budget);
@@ -647,6 +654,7 @@ class BudgetRepository implements BudgetRepositoryInterface
         $limit->end_date   = $end;
         $limit->amount     = $amount;
         $limit->save();
+        Log::debug(sprintf('Created new budget limit with ID #%d and amount %s', $limit->id, $amount));
 
         return $limit;
     }
diff --git a/public/js/ff/budgets/index.js b/public/js/ff/budgets/index.js
index e4b31c615e..7683f944cd 100644
--- a/public/js/ff/budgets/index.js
+++ b/public/js/ff/budgets/index.js
@@ -38,7 +38,7 @@ $(function () {
     /*
      When the input changes, update the percentages for the budgeted bar:
      */
-    $('input[type="number"]').on('input', updateBudgetedAmounts);
+    $('input[type="number"]').on('change', updateBudgetedAmounts);
 
     //
     $('.selectPeriod').change(function (e) {
@@ -104,46 +104,55 @@ function updateBudgetedAmounts(e) {
     "use strict";
     var target = $(e.target);
     var id = target.data('id');
-
+    var leftCell = $('td[class$="left"][data-id="' + id + '"]');
+    var link = $('a[data-id="'+id+'"][class="budget-link"]');
     var value = target.val();
     var original = target.data('original');
-    var difference = value - original;
 
-    var spentCell = $('td[class="spent"][data-id="' + id + '"]');
-    var leftCell = $('td[class="left"][data-id="' + id + '"]');
-    var spentAmount = parseFloat(spentCell.data('spent'));
-    var newAmountLeft = spentAmount + parseFloat(value);
-    var amountLeftString = accounting.formatMoney(newAmountLeft);
-    if (newAmountLeft < 0) {
-        leftCell.html('<span class="text-danger">' + amountLeftString + '</span>');
-    }
-    if (newAmountLeft > 0) {
-        leftCell.html('<span class="text-success">' + amountLeftString + '</span>');
-    }
-    if (newAmountLeft === 0.0) {
-        leftCell.html('<span style="color:#999">' + amountLeftString + '</span>');
-    }
+    // disable input
+    target.prop('disabled', true);
 
-    if (difference !== 0) {
-        // add difference to 'budgeted' var
+    // replace link (for now)
+    link.attr('href','#');
+
+    // replace "left" with spinner.
+    leftCell.empty().html('<i class="fa fa-fw fa-spin fa-spinner"></i>');
+
+    // send a post to Firefly to update the amount:
+    var newUri = budgetAmountUri.replace("REPLACE", id);
+
+    $.post(newUri, {amount: value, start: periodStart, end: periodEnd}).done(function (data) {
+
+        // difference between new value and original value
+        var difference = value - original;
+
+        // update budgeted value
         budgeted = budgeted + difference;
 
-        // update original:
-        target.data('original', value);
+        // fill in "left" value:
+        leftCell.html(data.left);
+
+        // update "budgeted" input:
+        target.val(data.amount);
+
+        // enable thing again
+        target.prop('disabled', false);
+
+        // set new original value:
+        target.data('original', data.amount);
+
         // run drawBudgetedBar() again:
         drawBudgetedBar();
 
-        // send a post to Firefly to update the amount:
-        var newUri = budgetAmountUri.replace("REPLACE", id);
-        $.post(newUri, {amount: value, start: periodStart, end: periodEnd}).done(function (data) {
-            // update the link if relevant:
-            if (data.repetition > 0) {
-                $('.budget-link[data-id="' + id + '"]').attr('href', 'budgets/show/' + id + '/' + data.repetition);
-            } else {
-                $('.budget-link[data-id="' + id + '"]').attr('href', 'budgets/show/' + id);
-            }
-        });
-    }
+        // update the link if relevant:
+        link.attr('href', 'budgets/show/' + id);
+        if (data.limit > 0) {
+            link.attr('href', 'budgets/show/' + id + '/' + data.limit);
+        }
+    });
+
+
+    return;
 }
 
 /**