I'm trying to calculate two numbers and display them but when I click Calculate Total nothing happens and no numbers are displayed. I've been looking for a solution for hours now and just can't figure out why nothing happens when I click the button. If someone could help me out a little bit I'd be very grateful!

```js
function calcTotal() {
  var intValue1 = parseInt(document.GetElementById('Value1').value);
  var intValue2 = parseInt(document.GetElementById('Value2').value);
  var strOper = document.GetElementById('operators').value;

  if (strOper === '+') {

    document.GetElementById('Total').value = intValue1 + intValue2;
    else if (strOper === '-') {
      document.GetElementById('Total').value = intValue1 - intValue2;
    } else if (strOper === '*') {
      document.GetElementById('Total').value = intValue1 * intValue2;
    } else {
      document.GetElementById('Total').value = intValue1 / intValue2;
    }
  }
  document.getElementById('submit').onclick = calcTotal();
```

```html
<table class="table1">
  <tr>
    <td class="label">
      <label id="lblValue1" for="txtValue1">Value 1:</label>
    </td>
    <td class="control">
      <input class="formFields" type="text" id="Value1" name="txtValue1" required>
    </td>
  </tr>
  <tr>
    <td>
      <select name="dropdown" id="operators">
        <option value="+" selected>+</option>
        <option value="-">-</option>
        <option value="*">*</option>
        <option value="/">/</option>
      </select>
    </td>
  </tr>
  <tr>
    <td class="label">
      <label id="lblValue2" for="txtValue2">Value 2:</label>
    </td>
    <td class="control">
      <input class="formFields" type="text" id="Value2" name="txtValue2" required>
    </td>
  </tr>
</table>

<hr>

<table>
  <tr>
    <td class="label">
      <label id="lblTotal" for="txtTotal">Total:</label>
    </td>
    <td class="control">
      <input class="textview" type="text" id="Total" name="txtTotal">
    </td>
  </tr>
</table>
<table>
  <tr>
    <td class="label">
      <input id="submit" class="button" name='cmdCalcTotal' type="button" value="Calculate Total" onclick="calcTotal();">
    </td>
  </tr>

</table>
```

Thanks in advance!!!!
['https://Stackoverflow.com/questions/55885621', 'https://Stackoverflow.com', 'https://Stackoverflow.com/users/11421201/']
You can use [Laravel Queues](https://laravel.com/docs/5.8/queues#introduction) to defer the time consuming part (like api calls) to background jobs.

> 
> Queues allow you to defer the processing of a time consuming task, such as sending an email, until a later time. Deferring these time consuming tasks drastically speeds up web requests to your application.
> 
> 
>
You could consider using **Guzzle's Promises** and sent requests in paralel. 

The library is located here: <https://github.com/guzzle/promises>.

Guzzle client wraps the promises with magic methods like...

```php
$promise = $client->getAsync('http://httpbin.org/get');
$promise = $client->deleteAsync('http://httpbin.org/delete');
$promise = $client->headAsync('http://httpbin.org/get');
$promise = $client->optionsAsync('http://httpbin.org/get');
$promise = $client->patchAsync('http://httpbin.org/patch');
$promise = $client->postAsync('http://httpbin.org/post');
$promise = $client->putAsync('http://httpbin.org/put');

```

... the documentation for this can be found here:

**Guzzle Async Requests:** <http://docs.guzzlephp.org/en/stable/quickstart.html#async-requests>

It has a few concepts, like `wait`, `then`, `queue` and `resolve`. Those help you make asynchronous requests while being in full control on what to resolve synchronous.

With this it would also be possible to retrieve aggregated results, meaning, for example, that you could query your users-api and your projects-api and wait for some of the results to come back so that you can create one single json response containing the combined data from two sources. 

This makes it very neat for projects that implement API-gateway.