using ajax to get the values from database on form submit laravel

Question

I have a select list in my form like

 <form class="form-horizontal form-bordered" method="post" action="formaction">
  <div class="form-group">
    <label class="col-md-3 control-label" for="inputSuccess">Amount</label>
        <div class="col-md-6">
           <select class="form-control mb-md" name="amount" id="amount">
                    <option value="10"> 10</option>
                    <option value="20">20</option>
                    <option value="30">30</option>
                    <option value="40">40</option>
                    <option value="50">50</option>
            </select>
        </div>

      <div class="input-group mb-md">
           <button type="submit" class="btn btn-warning btn-sm">Submit</button>
      </div>
</form>

<script>
        $("#sub").click(function(){
            $.ajaxSetup({
                headers: { 'X-CSRF-Token' : $('meta[name=_token]').attr('content') }
            });


            var selectedVal= $("select option:selected").val();
            return $.ajax({
                type: 'GET',
                url: 'getdollarvalue',
                dataType: 'json',
                contentType: "application/json; charset=utf-8",
                data: {
                    "value": selectedVal
                },
                success: function(response){

                   return alert(response);
                }
            });
        });
    </script>

And I have a table in database that stores corresponding values to selected dropdown values like

id      value         conversion
1         10            0.2
2         20            0.32
3         30            0.43
4         40            0.77

and so on

my routes.php

 Route::get('getdollarvalue/{value}', [
        'as' => 'getdollarvalue', 'uses' => 'dashboardController@getResult'
    ]);

and my controller

public function getResult(){
        $result = Input::get('value');

        return $result;
    }

Now, When I submit my form, I want to show the users in alert the corresponding value of the selected one. For example, If user selects 20 from the dropdown, then, on submitting the form, users is supposed to see the corresponding conversion of 20 i.e 0.32 in this case in alert. I know I have to implement ajax for this, I just don't understand how to implement it. Kindly guide me through this one.

VizardCrawler · Accepted Answer · 2015-09-22 05:31:16Z

1

Html:

<form class="form-horizontal form-bordered" method="post" action="formaction">
<div class="form-group">
<label class="col-md-3 control-label" for="inputSuccess">Amount</label>
    <div class="col-md-6">
       <select class="form-control mb-md" name="amount" id="amount">
                <option value="10"> 10</option>
                <option value="20">20</option>
                <option value="30">30</option>
                <option value="40">40</option>
                <option value="50">50</option>
        </select>
    </div>

  <div class="input-group mb-md">
       <button type="submit" id="sub" class="btn btn-warning btn-sm">Submit</button>
  </div>
</form>

Script:

<script>
$("#sub").click(function(){
var selectedVal= $("select option:selected").val();

   $.ajax({
       type:"GET",
       url: "api/URL",//put y
       data:{ val:selectedVal},
       contentType: "application/json; charset=utf-8",
       dataType: "Json",
       success: function(result){
          alert(result.conversion); // Note Send the Json Object from the server side
       }

      });
});
</script>

answered Sep 22, 2015 at 5:31

VizardCrawler

1,30310 silver badges16 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Sid Over a year ago

I am not being able to post the selected dropdown value to my controller, how should I do that?

VizardCrawler Over a year ago

Please check the parameter which you are sending to the server , It should be same i.e { val:selectedVal} the parameter 'val' should be present in the Model class which is about to receive the call

Sid Over a year ago

I have updated my question please have a look and help me out of this.:)

Collectives™ on Stack Overflow

using ajax to get the values from database on form submit laravel

1 Answer 1

3 Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

3 Comments

Your Answer

Sign up or log in

Post as a guest

Related