[5.5] Laravel ET Ajax

Salut,

J'essaie d'afficher le message d'erreur avec ajax dans le framework laravel mais je n'y arrive toujours pas et cela depuis trois jours durant.
Voici mon controller, ma vue et mon code ajax
merci de bien m'aider à resoudre ce casse tête :calim2:

Mon controlleur

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
 
public function create(Request $request)
 
    {
 
       $rules = [
 
          'nom' => 'required',
 
          'prenom' => 'required',
 
        ];
 
 
 
        $validator = Validator::make($request->all(), $rules);
 
        if ($validator->fails()) {
 
        return response()->json([
 
                  'fail' =>true,
 
                  'errors' => $validator->errors()
 
            ]);
 
        }
 
        else{
 
            $post = new Post();
 
            $post->nom = $request->nom;
 
            $post->prenom = $request->prenom;
 
            $post->save();
 
        }
 
        return response()->json($post);
 
    }

------------------Ma VUE-----------------

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
 
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
 
    <div class="modal-dialog">
 
        <div class="modal-content">
 
            <div class="modal-header">
 
                <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">×</span></button>
 
                <h4 class="modal-title" id="myModalLabel">Enregistrement</h4>
 
            </div>
 
            <div class="modal-body">
 
 
 
                <form id="formRegister" class="form-horizontal" role="form" method="POST" action="{{ url('create') }}">
 
                    <input type="hidden" name="_token" value="{{ csrf_token() }}">
 
 
 
                    <div class="form-group">
 
                        <label class="col-md-4 control-label">Nom</label>
 
                        <div class="col-md-6">
 
                            <input type="text" class="form-control" name="nom" id="nom">
 
                            <small class="help-block"></small>
 
                        </div>
 
                    </div>
 
 
 
                    <div class="form-group">
 
                        <label class="col-md-4 control-label">Prenom</label>
 
                        <div class="col-md-6">
 
                            <input type="text" class="form-control" name="prenom" id="prenom">
 
                            <small class="help-block"></small>
 
                        </div>
 
                    </div>
 
 
 
                    <div class="form-group">
 
                        <div class="col-md-6 col-md-offset-4">
 
                            <button type="submit" class="btn btn-primary" id="register">
 
                                Register
 
                            </button>
 
                        </div>
 
                    </div>
 
                </form>
 
 
 
            </div>
 
        </div>
 
    </div>
 
</div>

------------- Code Ajax ---------------

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
 
$(document).ready(function(){
 
 
 
$('#register').click(function() {
 
            $('#myModal').modal();
 
        });
 
 
 
        $(document).on('submit', '#formRegister', function(e) {
 
            e.preventDefault();
 
 
 
            $('input+small').text('');
 
            $('input').parent().removeClass('has-error');
 
 
 
            $.ajax({
 
                method: $(this).attr('method'),
 
                url: $(this).attr('action'),
 
                data: $(this).serialize(),
 
                dataType: "json"
 
            })
 
            .done(function(data) {
 
                $('.alert-success').removeClass('hidden');
 
                $('#myModal').modal('hide');
 
                $('#nom').val('');
 
                $('#prenom').val('');
 
                addRow(data);
 
            })
 
            .fail(function(data) {
 
                $.each(data.responseJSON, function (key, value) {
 
                    var input = '#formRegister input[name=' + key + ']';
 
                    $(input + '+small').text(value);
 
                    $(input).parent().addClass('has-error');
 
                });
 
            });
 
 
 
            function addRow(data){
 
        var row = '<tr>'+
 
              '<td>'+ data.id + '</td>'+
 
              '<td>'+ data.nom + '</td>'+
 
              '<td>'+ data.prenom + '</td>'+
 
              '<td class="text-center"><a href="#" class="btn btn-success" data-toggle="modal" data-target="#modalEdit" type="submit"><span class="fa fa-eye">Editer</a></td>'+
 
              '<td class="text-center"><a href="#" class="btn btn-danger" data-toggle="modal" data-target="#modalEdit" type="submit"><span class="fa fa-eye">Supprimer</a></td>'+
 
              '</tr>';
 
              $('tbody').append(row);
 
             }
 
 
 
        });
 
     })

Je tiens également précisé que je voudrais le faire avec une fenêtre modale ;)