dimanche 4 mars 2018

in laravel i am using ajax to call bootstrap modal , but hide.bs.modal does not clear the modal data in blade template

i use Ajax in Laravel to call a bootstrap modal ( i get bootstrap modal content from my blade file ) , this modal ( which reads from addstudent.blade.php ) containes two forms , one form is for readng and croping an image , and when it is done, it posts and then sends its data to the other form and they both go to controller , this part works very well , here is its code :

    $('#frm-insert').on('submit',function (e) {
        $('#cropitbaby').on('submit',function (e) {
            e.preventDefault();
        });
        $('#cropitbaby').submit();
        var passdata = $("input#image-data").val();
        $("input#usercropedimage").val(passdata);
        var data = $(this).serialize();
        var url = $(this).attr('action');
        var post = $(this).attr('method');
        e.preventDefault();
        $.ajax({
            type:post,
            url:url,
            data:data,
            dataty:'json',
            success:function (data) {
                var tr = $('<tr/>',{
                    id : data.id
                });
                tr.append($('<td/>',{
                    text:data.id
                })).append($('<td/>',{
                    text:data.cell_phone
                })).append($('<td/>',{
                    text:data.email
                })).append($('<td/>',{
                    text:data.created_at_shamsi
                })).append($('<td/>',{
                    text:data.gender
                })).append($('<td/>',{
                    text:data.username
                })).append($('<td/>',{
                    text:data.family
                })).append($('<td/>',{
                    text:data.name
                })).append($('<td/>',{


                    html : '<a href="#" class="btn btn-info btn-sm" id="view" data-id="' + data.id + '">تغییر رمز</a> '
                    + '<a href="#" class="btn btn-success btn-sm" id="edit" data-id="' + data.id + '">ویرایش</a> ' +
                    '<a href="#" class="btn btn-danger btn-sm" id="del" data-id="' + data.id + '">حذف</a>'
                }));



                $('#student-info').append(tr);
            }
        })
    })

but i have another button ( and like frm-insert ) it also uses ajax to show and update the data : here is the code for show :

    $('body').delegate('#student-info #edit','click',function (e) {
        var id = $(this).data('id');

        $.get("",{id:id},function (data) {

            $('#frm-update').find('#id').val(data.id);
            $('#frm-update').find('#namee').val(data.name);
            $('#frm-update').find('#familyy').val(data.family);
            $('#frm-update').find('#usernamee').val(data.username);
            $('#frm-update').find('#bdd').val(data.birth_date);
            $('#frm-update').find('#celll').val(data.cell_phone);
            $('#frm-update').find('#nacc').val(data.national_code);

            $('#frm-update').find('#emaill').val(data.email);
            $('#frm-update').find('#genderr').val(data.gender);



            $('.user_image').find('#defaultimagee').attr('src',data[0].image);



            $('#student-update').modal('show');

        })


    })

and this is the code for updating :

    $('#frm-update').on('submit',function (e) {
        var communication;
        $('#cropitbabyy').on('submit',function (e) {
            e.preventDefault();
        });
        $('#cropitbabyy').submit();
        var passdata = $("input#image-dataa").val();
        console.log(passdata);
        $("input#usercropedimagee").val(passdata);
        var data = $(this).serialize();
        var url = $(this).attr('action');
        var post = $(this).attr('method');
        e.preventDefault();
        $.ajax({
            type: post,
            url: url,
            data: data,
            dataty:'json',
            success: function (data) {
                console.log(data.name);
                var tr = $('<tr/>',{
                    id : data.id
                });
                tr.append($('<td/>',{
                    text:data.id
                })).append($('<td/>',{
                    text:data.cell_phone
                })).append($('<td/>',{
                    text:data.email
                })).append($('<td/>',{
                    text:data.created_at_shamsi
                })).append($('<td/>',{
                    text:data.gender
                })).append($('<td/>',{
                    text:data.username
                })).append($('<td/>',{
                    text:data.family
                })).append($('<td/>',{
                    text:data.name
                })).append($('<td/>',

                    {
                        html : '<a href="#" class="btn btn-info btn-sm" id="view" data-id="' + data.id + '">تغییر رمز</a> '
                        + '<a href="#" class="btn btn-success btn-sm" id="edit" data-id="' + data.id + '">ویرایش</a> ' +
                        '<a href="#" class="btn btn-danger btn-sm" id="del" data-id="' + data.id + '">حذف</a>'
                    }))



                $('#student-info tr#' + data.id).replaceWith(tr);

            }
        });
    });

now the problem is " when i click the update button , although it shows the user image and data , but on update for image , it gets the image that i entered in the register and updates the user image to that image of the register , even though if i chose a photo in insert bootstrap and close the modal without saving . i have tried this code to clear the data from insert bootstrap in my addstudent.blad.php but it dosn't work :

    $(document).on('hide.bs.modal','#myModal', function () {
    $('#myModal')
        .find("input#image-data,input#usercropedimage,textarea,select")
        .val('')
        .end()
        .find("input[type=checkbox], input[type=radio]")
        .prop("checked", "")
        .end();
});

what should i do ? ( remember i'm using ajax all over the place and i get the bootstrap content from my blade files . thank you beforehand for helping.



from Newest questions tagged laravel-5 - Stack Overflow http://ift.tt/2thjS9K
via IFTTT

Aucun commentaire:

Enregistrer un commentaire