I have a page where users can place orders, Order numbers increment.

Is it possible to disable the button until the process is plete? i.e until the order is successfully placed.

What my clients face is, when they click on the place order button, the process bees slow since their network is bad. Unknowingly, they click the place order again assuming the process failed. At the long run, they will have orders of the same items (duplicates). 001, 002, 003 all having the same food items since they keep clicking on the place button.

Code

 public function save(Request $request)
 {
    $food = new Food(array(
        'name'  => $request->get('name'),
        'price' => $request->get('price'),
    ));

    return redirect('admin')->with('status','Order successfully placed');
}

I have a page where users can place orders, Order numbers increment.

Is it possible to disable the button until the process is plete? i.e until the order is successfully placed.

What my clients face is, when they click on the place order button, the process bees slow since their network is bad. Unknowingly, they click the place order again assuming the process failed. At the long run, they will have orders of the same items (duplicates). 001, 002, 003 all having the same food items since they keep clicking on the place button.

Code

 public function save(Request $request)
 {
    $food = new Food(array(
        'name'  => $request->get('name'),
        'price' => $request->get('price'),
    ));

    return redirect('admin')->with('status','Order successfully placed');
}

• javascript
• php
• jquery
• laravel

• 2 How are you submitting the order? If you are using ajax then you can disable the button before the ajax query and then enable it again once the client receives a response. Your question is lacking important detail and source code of what you have tried so far. – NewToJS Commented Jan 5, 2018 at 12:13
• 1 Post the code of submitting the order pls – Luis felipe De jesus Munoz Commented Jan 5, 2018 at 12:14
• @NewToJS, i save my order the standard way its been done in laravel for store not with ajax. Kindly check my update – LearnLaravel Commented Jan 5, 2018 at 12:17
• @LuisfelipeDejesusMunoz please check my update – LearnLaravel Commented Jan 5, 2018 at 12:17
• 1 You could disable the button with javascript and add a loading icon. – Jerodev Commented Jan 5, 2018 at 12:22

1 Answer 1

You can disable form's submit button after clicking on submit button using jQuery.

<script>
$(document).ready(function() {
    $(document).on('submit', 'form', function() {
        $('button').attr('disabled', 'disabled');
    });
});
</script>