#742 - avoid page reload inline save

BudgetMasterServer/src/main/java/de/deadlocker8/budgetmaster/transactions/TransactionImportController.java

@@ -285,14 +285,14 @@ public class TransactionImportController extends BaseController
 	}
 
 	@PostMapping("/{index}/newTransactionInPlace")
-	public String newTransactionInPlace(WebRequest request,
+	public String newTransactionInPlace(Model model, WebRequest request,
 										@PathVariable("index") Integer index,
 										@ModelAttribute("NewTransactionInPlace") CsvTransaction newCsvTransaction)
 	{
 		final Optional<CsvTransaction> transactionOptional = getTransactionByIndex(request, index);
 		if(transactionOptional.isEmpty())
 		{
-			return ReturnValues.REDIRECT_IMPORT;
+			throw new ResourceNotFoundException();
 		}
 
 		final CsvTransaction csvTransaction = transactionOptional.get();
@@ -303,7 +303,11 @@ public class TransactionImportController extends BaseController
 		final Transaction newTransaction = transactionImportService.createTransactionFromCsvTransaction(csvTransaction);
 		transactionService.getRepository().save(newTransaction);
 
-		return ReturnValues.REDIRECT_IMPORT;
+		model.addAttribute(ModelAttributes.CATEGORIES, categoryService.getAllEntitiesAsc());
+		model.addAttribute(TransactionModelAttributes.SUGGESTIONS_JSON, transactionService.getNameSuggestionsJson());
+		model.addAttribute(ModelAttributes.CSV_TRANSACTION, csvTransaction);
+		model.addAttribute(ModelAttributes.CSV_TRANSACTION_INDEX, index);
+		return ReturnValues.TRANSACTION_IMPORT_ROW;
 	}
 
 	private void removeAllAttributes(WebRequest request)

BudgetMasterServer/src/main/resources/static/js/transactionImport.js

@@ -33,8 +33,51 @@ $(document).ready(function()
         }
     }
 
+    initCsvTransactions();
+});
+
+function initCsvTransactions()
+{
+    initCsvTransactionForms();
     initCsvTransactionButtons();
+}
+
+function initCsvTransactionForms()
+{
+    const forms = document.querySelectorAll('[name="NewTransactionInPlace"]');
+
+    for(let i = 0; i < forms.length; i++)
+    {
+        let form = forms[i];
+        $(form).submit(function(event)
+        {
+            const csvTransactionId = form.dataset.index;
+
+            $.ajax({
+                type: 'POST',
+                url: $(this).attr('action'),
+                data: new FormData(form),
+                processData: false,
+                contentType: false,
+                success: function(response)
+                {
+                    $('#transaction-import-row-' + csvTransactionId).replaceWith(response);
+                    initCsvTransactions();
+                },
+                error: function(response)
+                {
+                    M.toast({
+                        html: "Error saving transaction",
+                        classes: 'red'
+                    });
+                    console.error(response);
+                }
+            });
+
+            event.preventDefault();
         });
+    }
+}
 
 function initCsvTransactionButtons()
 {
@@ -71,7 +114,7 @@ function performCsvTransactionGetRequestWithoutReload(button, errorMessage)
         success: function(data)
         {
             $('#transaction-import-row-' + csvTransactionId).replaceWith(data);
-            initCsvTransactionButtons();
+            initCsvTransactions();
         },
         error: function(response)
         {

BudgetMasterServer/src/main/resources/templates/transactions/transactionImportMacros.ftl

@@ -189,7 +189,7 @@
 
 <#macro renderCsvTransaction csvTransaction index>
     <tr class="transaction-import-row <#if csvTransaction.getStatus().name() == 'SKIPPED'>transaction-import-row-skipped</#if>" id="transaction-import-row-${index}">
-        <form name="NewTransactionInPlace" method="POST" action="<@s.url '/transactionImport/' + index + '/newTransactionInPlace'/>">
+        <form name="NewTransactionInPlace" method="POST" action="<@s.url '/transactionImport/' + index + '/newTransactionInPlace'/>" data-index="${index}">
             <input type="hidden" name="${_csrf.parameterName}" value="${_csrf.token}"/>
             <td data-order="${locale.getString(csvTransaction.getStatus().getLocalizationKey())}" data-search="${locale.getString(csvTransaction.getStatus().getLocalizationKey())}"><@statusBanner csvTransaction.getStatus()/></td>
             <td data-order="${csvTransaction.getDate()}" data-search="${csvTransaction.getDate()}">${csvTransaction.getDate()}</td>