How to display data to select option from ajax post response to view in laravel

Question

I want to display the option to view from ajax POST. In browser console, the console.log(el.devc_name) can display. But why doesn't it appear to the option with id offerDropdown?

    <form method="POST" name="formSellout" id="formSellout" action="/sellout/addserialnumber" style="color:#FFF">
        <div class="row">
            <div class="col-lg-4 col-md-6 col-xs-6">
                <input class="form-control ui-autocomplete-input" type="text" id="serial_number" name="serial_number" value="" placeholder="Fill The Serial Number"/>
            </div>
            <div class="col-lg-2 col-md-6 col-xs-6">
                <button class="btn btn-danger" type="submit" id="addSN" style="width: 100%">
                    <i class="dripicons-document-new"></i>
                    Insert Data
                </button>
            </div>
        </div><br/> 
        <div class="row">
            <div class="col-lg-4 col-md-6 col-xs-6">
                <select class="form-control" id="offerDropdown" name="offerDropdown">
                    <option> Offer </option>
                </select>
            </div>
        </div><br/>

The Ajax

 $("#addSN").on("click", function(){
        event.preventDefault()
        $.ajax({
            method: "POST",
            url: "/sellout/addserialnumber",
            data: $("#formSellout").serialize(),
            success: function(response) { 
                if(response.length) {
                response.forEach(el => {
                    $("#offerDropdown").append(`<option value='${el.devc_name}'> ${el.devc_name}</option>`)
                    console.log(el.devc_name)
                    })
                }             
            },
            error: function(error) {

            }
        })
        $("#addSN").hide()
    })

The controller:

 public function addSerialNumber(Request $request)
    {
        $sn = $request->all();
        $offer = Product::select('devc_name')->where('sn_bundling', $sn['serial_number'])->get();
        return response()->json($offer);
    }

The route:

    Route::post('sellout/addserialnumber', 'SellOutController@addSerialNumber');

here's the database I need to send the data from devc_name field to select option

Ariful Islam · Accepted Answer · 2020-07-29 11:25:14Z

Your code is almost ok. But below code doesn't make sense at all. response.length return integer value. But in if(response.length) you have checked condition that is not possible . because reponse.length doesn't provide boolean, it provides integer. So modify your code by

$("#addSN").on("click", function(){
    event.preventDefault()
    $.ajax({
        method: "POST",
        url: "/sellout/addserialnumber",
        data: $("#formSellout").serialize(),
        success: function(response) { 
            if(response.length) {
            response.forEach(el => {
                $("#offerDropdown").append(`<option value='${el.devc_name}'> ${el.devc_name}</option>`)
                console.log(el.devc_name)
                })
            }             
        },
        error: function(error) {

        }
    })
    $("#addSN").hide()
})

Modified code

$("#addSN").on("click", function(){
        event.preventDefault()
        $.ajax({
            method: "POST",
            url: "/sellout/addserialnumber",
            data: $("#formSellout").serialize(),
            success: function(response) { 
                if(response.length > 0) {
                response.forEach(el => {
                    $("#offerDropdown").append(`<option value='${el.devc_name}'> ${el.devc_name}</option>`)
                    console.log(el.devc_name)
                    })
                }             
            },
            error: function(error) {

            }
        })
        $("#addSN").hide()
    })

Collectives™ on Stack Overflow

How to display data to select option from ajax post response to view in laravel

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related