通过ajax获取URL

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.

Try that way:

$.ajax({
  type    : 'POST', 
  url     : "{{ route('route-name', ['param' => $param]) }}",
  data    : formData, 
  dataType: 'POST'
})

Update in your js file

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

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