Question posted in
You can find the official documentation here.

Jquery ajax – get form data on select change

I am trying to get All form data on select.when someone select country ,then collect aal form data and store in a variable,

  <from name="form1" id="formid">
    <input type="text" name="address">
    <input type="text" name="pincode">
    <input type="hidden" name="price" value="80">
     <select class="form-control" name="country" id="country">
                <option value="">Select Country</option>
                @foreach ($countries as $country) 
                    <option value="{{$country->id}}">
                    {{$country->name}}
                    </option>
                @endforeach
            </select>
          </from>

Here Is my ajax.

<script type="text/javascript">
   $('#country').change(function(){
        var cid = $(this).val();
        if(cid){
        $.ajax({
           type:"get",
           url:" {{url('/ava')}}/"+cid,
           success:function(res)
           {     
           alert(res);  
           }

        });
        }
    });

Here Is my controller When I am trying to send all form data

public function avatax(Request $request){
    $data=$request->all();
    print_r($data);
    die();
$tb = new AvalaraTransactionBuilder($client, "AGELESSZENINC", AvalaraDocumentType::C_SALESINVOICE, 'ABC');
$t = $tb->withAddress('SingleLocation', '123 Main Street',null,null, 'Irvine', $id, '92615', 'US')
    ->withLine(100.0, 1, null, "P0000000")
    ->create();
echo('<h2>Transaction #1</h2>');
echo('<pre>' . json_encode($t, JSON_PRETTY_PRINT) . '</pre>');
}
}
Tags:

3

Answers


  1. 0

    I still don’t know your problem. If you want to get all data in form and use in ajax, you can see my code:

    <script type="text/javascript">

$('#country').change(function(){
        let formData = $('#formid').serialize();
        var cid = $(this).val();
        if(cid){
        $.ajax({
           type:"get",
           url:" {{url('/ava')}}/",
           data: formData,
           success:function(res)
           {     
           alert(res);  
           }

    });
    }
});

    You can see serialize() in https://api.jquery.com/serialize/. May I help you.
    With post method:

    <script type="text/javascript">

$('#country').change(function(){
        let formData = $('#formid').serialize();
        var cid = $(this).val();
        if(cid){
        $.ajaxSetup({
           headers: {
              'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
           }
        });
        $.ajax({
           type:"post",
           url:" {{url('/ava')}}/",
           data: formData,
           success:function(res)
           {     
           alert(res);  
           }

    });
    }
});
    Login or Signup to reply.
  2. 0 
    <script type="text/javascript">
            $('document').ready(function(){
                alert();
                $('#country').change(function(){
                var cid = $('#country').val();
                alert(cid);
                $.ajax({
                   url: 'www.example.com/page.php',
                   method:"post",
                   data:{'country', cid},
                   success:function(res)
                   {     
                   alert(res);  
                   }

                });
                });
            });
    </script>

    in page.php you need to get varible like this.
    echo $_POST[‘country’];

    Login or Signup to reply.
  3. 0

    Well, first of all you should use serialize() method to achieve your goal. This method will serialize your entire form and will assign it to any variable. Here my example with post method:

    $('#country').on('change', function() {
  const formData = $('#formid').serialize();
  console.log(formData);
  $.ajax({
    type: "post",
    data: formData,
    url: " {{url('/ava')}}/",
    success: function(res) {
      alert(res);
    }

  });
});
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<form name="form1" id="formid">
  <input type="text" name="address">
  <input type="text" name="pincode">
  <input type="hidden" name="price" value="80">
  <select class="form-control" name="country" id="country">
    <option value="">Select Country</option>
    <option value="us">USA</option>
    <option value="canada">Canada</option>
    <option value="brazil">Brazil</option>
  </select>
</form>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search