php - Bootbox.js Confirm choice before submitting form -
hello have decided use bootbox.js simple way incorporate bootstrap modal can make user confirm choice before form posted , changes made.
i using laravel, jquery, bootstrap , bootbox.js in default layout file:
layout.blade.php
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script>window.jquery || document.write('<script src="js/vendor/jquery-1.9.1.min.js"></script>')</script> <script src="js/plugins.js"></script> <script src="js/main.js"></script> <script src="js/vendor/bootstrap.js"></script> <script src="js/vendor/modernizr-2.6.2.min.js"></script> <script src="js/vendor/bootbox.js"></script> user page:
{{form::open('choice')}} @foreach($items $item) <tr> <td>{{ html::image($item->image, '', array('class' => 'img img-rounded', 'width' => '100px', 'height' => '100px')) }}</td> <td>{{$item->name}}</td> <td>{{ $item->desc }}</td> <td>{{ form::radio('item', $item->item_id)}}</tr> @endforeach </tbody> </table> {{ form::submit('confirm choice', array('class' => 'btn btn-success btn-block')) }} <script> $(document).ready(function() { $(document).on("click", ".alert", function(e) { bootbox.confirm("are happy decision have made?", "i have changed mind", "i happy choice", function(result) { if (result) { console.log("user confirmed"); } else { console.log("user declined"); } }); }); }); </script> {{form::close()}} i not know how make modal appear before , prevent submission. post if user has confirmed choice?
adding e.preventdefault() in onclick handler prevent form submission.
<script> $(document).ready(function() { $(document).on("click", ".alert", function(e) { e.preventdefault(); bootbox.confirm("are happy decision have made?", "i have changed mind", "i happy choice", function(result) { if (result) { console.log("user confirmed"); } else { console.log("user declined"); } }); }); }); </script> 
Comments
Post a Comment