Вызов функции из контроллера в JS

Question

Как и в моем коде ниже, я пытаюсь запустить функцию pay() после запуска скрипта. Я вставил запрос ajax в скрипт для обработки pay(), но после успешного выполнения функции getPaidSetup pay() не запускается.

Я делаю это правильно, пожалуйста? Любая помощь приветствуется.

 <script>
         document.addEventListener("DOMContentLoaded", function(event) {
      document.getElementById("submit").addEventListener("click", function(e) {

        getpaidSetup({
          PBFPubKey: PBFKey,
          customer_email: "eg.com",
          customer_firstname: "Temi",
          customer_lastname: "Adelewa",
          custom_description: "Pay Internet",
          amount: 2000,
          customer_phone: "2342423423",
          currency: "USD",
          country: "US",
          "txref": "MG-" + Date.now(),
          onclose: function() {},
          callback: function(response) {
            var flw_ref = response.tx.flwRef; // collect flwRef returned and pass to a                  server page to complete status check.
            console.log("This is the response returned after a charge", response);
            if (
              response.tx.chargeResponseCode == "00" ||
              response.tx.chargeResponseCode == "0"
            ) 
            {
              // redirect to a success page

            } 
            else 
            {
              // redirect to a failure page.
            }
          }
        });

     $.ajax({
        url: "/monthly_plan/basic",
        type: "post",
        data: {field_name :'data'}
     });

      });


    });



    </script>

Контроллер

 public function pay(Request $request)
    {
        $starter = new Payment(array(
            'plan_id' => 1,

        ));

        $starter->save();
    }

Маршрут

Route::post('/monthly_plan/basic',['uses'=>'Controller@pay']);