-1

I have problem getting my url in Ajax

my html

<input type="text" class="proId" value="{{$order->id}}">

my js:

    <script type="text/javascript">
      $('#pay-button').click(function (event) {
        $.ajaxSetup({
            headers: { 'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content') }
          });
        event.preventDefault();
        // $(this).attr("disabled", "disabled");
        var proId = document.getElementsByClassName('proId').value;
            $.ajax({
              url: '{{url('orderspayonline')}}/'+encodeURI(proId),
              type: "POST",
              cache: false,

              success: function(data) {
                var resultType = document.getElementById('result-type');
                var resultData = document.getElementById('result-data');

                function changeResult(type,data){
                  $("#result-type").val(type);
                  $("#result-data").val(JSON.stringify(data));
                }

//rest of it...
              }
            });
        });
    </script>

I get 404 undefined in network as result, I suppose to get http://domain/orderspayonline/id

I need to use document.getElementsByClassName (getting class) instead of id because i have more than 1 row in my table.

mafortis
  • 6,750
  • 23
  • 130
  • 288
  • The variable `proId` is a node list. I don't believe that will work in your ajax URL. Try logging the url string to the console to see what it looks like. – AdamJB Feb 22 '18 at 08:54
  • Possible duplicate of [How do I return the response from an asynchronous call?](https://stackoverflow.com/questions/14220321/how-do-i-return-the-response-from-an-asynchronous-call) –  Feb 22 '18 at 11:17

2 Answers2

0

Try that way:

$.ajax({
  type    : 'POST', 
  url     : "{{ route('route-name', ['param' => $param]) }}",
  data    : formData, 
  dataType: 'POST'
})
Adam Kozlowski
  • 5,606
  • 2
  • 32
  • 51
0

Update in your js file

url: '{{url("orderspayonline")}}/'+encodeURI(proId),

Use double quotes inside. Using single quotes inside terminates the string.

Sunny Kumar
  • 534
  • 12
  • 35
  • only gets first row id – mafortis Feb 22 '18 at 08:57
  • see i have table and each row `` is covered with this form the button suppose to work for all rows not only first one, any idea? – mafortis Feb 22 '18 at 09:01
  • it is, value="{{$order->id}}" – mafortis Feb 22 '18 at 09:04
  • @mafortis As I said in my comment on your post, if you use classes then the `proId` will be a node list (an object). You therefore can't get the `.value` property of it as it will return `undefined`. – AdamJB Feb 22 '18 at 09:04
  • Use $('#pay-button{{$order->id}}').click(function (event) { ... } and also change in id attribute in your html.. – Sunny Kumar Feb 22 '18 at 09:06
  • @AdamJB I changed proId to something random, no luck. – mafortis Feb 22 '18 at 09:14
  • In your html id="pay-button{{$order->id}}" and in your js $('#pay-button{{$order->id}}').click(function (event) { ... }. Write both the codes inside the loop. – Sunny Kumar Feb 22 '18 at 09:17
  • @SunnyKumar `$('#pay-button{{$order->id}}').click(function (event) { $.ajaxSetup({........` and `` not working :\ – mafortis Feb 22 '18 at 09:22