Возврат ответа от запроса JSON с использованием формы Ajax в шаблоне Laravel blade

Question

Хорошо, поэтому у меня есть API, основанный на Laravel, я пытаюсь вернуть его JSON ответ в виде с его собственными данными формы.

HTML:

<form id="translate" action="translate" method="GET">
    <div class="form-group"><label for="from" name="from">Translate from</label><select class="form-control" id="from"><option value="latin" selected="selected">Latin alphabet</option><option value="deepling">Jekhr</option></select></div>
    <div class="form-group"><label for="message" name="message">Message</label><textarea class="form-control" id="message"></textarea></div>
    <div class="form-group"><div class="form-row"></div></div>
    <button class="btn btn-primary btn-block" type="submit">Translate!</button>
</form>

Базовый URL API:

http://localhost/translate?text=Hello World&method=Latin&pronunciation

Поэтому я пытаюсь написать Ajax запрос для получения JSON ответа с данными формы и отображения его в таблице DOM, например:

Translated Message = $json["translated"]

Pronunciation = $json["pronounce"]

Кто-нибудь может мне помочь?

Редактировать:

Вот решение, которое я получил на основе комментария:

$("#translate").submit(function(e) {

e.preventDefault();

var form = $(this);
var url = form.attr('action');

$.ajax({
    type: "GET",
    url: url,
    data: form.serialize(),

    success: function(data)
    {
        $('#translateTable tbody tr').remove();
        $('#translateTable tbody').append("<tr><td>Request</td><td>" + data.requested + "</td></tr><tr><td>Translation</td><td>" + data.translated + "</td></tr><tr><td>Pronounce</td><td>" + data.pronounce + "</td></tr>");
        $('#translateTable').show();
    }
    });

});