lundi 17 juillet 2017

Stop bootstrap modal from closing when submitting a blank form to allow Laravel messages to display

I'm using a bootstrap modal window for user to fill out a form, and I'm processing the validation using Laravel 5. The issue I'm having is that the modal window closes when the user hits the submit button, even if the form fields are blank. When the user logs back in to the form, the messages are displayed.

I tried adding the 'required' option to the input elements; however, it doesn't display the laravel error but rather the HTML error.

How can I stop the modal window from closing if any of the required fields are not filled in?

MY MODAL CODE

<div class="modal fade" id="editItemModal" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal">&times;</button>
                 @include('includes.info-box-error')
                <h4 class="modal-title">Modal Title</h4>
            </div>

            <div class="modal-body">
                <form action="" method="post" name="myEditForm" >
                    <div class="form-group">
                        <label for="code">Code:</label>
                        <input type="text" size="5" maxlength="5" minlength="3" class="form-control" name="code" id="code" required> 
                    </div>

                    <div class="form-group">
                        <label for="description">Description:</label>
                        <input type="text" class="form-control" name="description" id="description" required>     
                    </div>

                    <div class="form-group">
                        <label for="amount">Amount:</label>
                        <input type="number" class="form-control" name="amount" id="amount" size="5" maxlength="5" required>
                    </div>

                    <div class="form-group">
                        <label for="newImage">Upload Image</label>
                        <input type="file" class="form-control" name="newImage" id="newImage">
                    </div>

                    <div class="form-group">
                        <label for="radio">Type:</label>
                        <div class="radio">
                            <label><input type="radio" name="optradio" value="in">In</label>
                            <label><input type="radio" name="optradio" value="out">Out</label>
                        </div>
                    </div> 

                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
                        <button type="submit" class="btn btn-primary pull-right">Submit</button>
                        <input type="hidden" name="_token" value=""/>
                    </div>                
                </form>

            </div><!--Modal Body-->
        </div><!--Modal Content-->
    </div><!--Modal Dialog-->
</div><!--Modal-->  

MY PHP CODE

 <?php
 namespace App\Http\Controllers;
 use Illuminate\Http\Request;
 use \App\Product;

 class ProductsController extends Controller
 {
   public function getIndex()
      {
     $products = Product::orderBy('created_at', 'desc')->paginate(10);
    return view('index', ['products' => $products]);
}

public function postNewProduct(Request $request)
{
    $this->validate($request, [
        'code' => 'required|max: 5|alpha_num|unique:products',
        'description' => 'required|max: 20',
        'amount' => 'required|numeric'
    ]);

    $product = new Product();
    $product->code = strtoupper($request['code']);
    $product->description = ucfirst($request['description']);
    $product->in = $request['amount'];
    $product->out = 0;
    $product->save();

    return redirect()->route('index')->with(['success' => 'New product successfully added.']);


}
}



via Chebli Mohamed

Aucun commentaire:

Enregistrer un commentaire