jquery ajax submit Сериализованная форма без обновления не работает

Question

Здравствуйте, у меня есть большая проблема с моим скриптом, использующим ajax для отправки формы и получения ответа от php-скрипта.

Я хотел бы получить ответ на мой модальных, но когда сценарий исполняется страница переходит на страницу параметров URL и выводит результаты

это видео ошибки https://www.youtube.com/watch?v=BtiY9SMC1A0

function sub (a){ 

    $(a).submit(function(e) { 
    e.preventDefault(); 

     $.ajax({ 
     type: 'post', 
     url: 'creer.php', 
     data: $(a).serialize(), 
     success: function (response) { 
         $('#myModal').modal('show'); 
         $(".mydivinfo").html(response); 
     } 
     }); 

    // i have try withe post methode and that the same 
    /** $.post('creer.php', $(a).serialize(), function (data) { 
     $('#myModal').modal('show'); 
     $(".mydivinfo").html(data); 
    }).error(function() { 
     // This is executed when the call to mail.php failed. 
    });**/ 

    //alert(infos); 

    return false 
    }); 
    } 

модальный HTML код

<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel"> 
     <div class="modal-dialog" role="document"> 
     <div class="modal-content"> 
      <div class="modal-header"> 
      <button type="button" class="close" data-dismiss="modal" aria-label="Fermer"><span aria-hidden="true">&times;</span></button> 
      <h4 class="modal-title" id="myModalLabel">Informations</h4> 
      </div> 
      <div class="modal-body"> 

      <div class="mydivinfo"> 
      </div> 
      </div> 
      <div class="modal-footer"> 
      <button type="button" class="btn btn-default" data-dismiss="modal">Fermer</button> 
      </div> 

     </div> 
    </div>   
    </div> 

и я называю подфункций здесь

<input name="addon" id="addon" type="SUBMIT" class="save btn btn-success btn-block" value="Enregistrer les modifications" onclick="sub(this);"> 

PHP ответ должен быть модальным после успеха

..... 
    echo ' 
    <div class="box box-solid"> 
    <div class="box-header with-border info"> 
    <h3 class="box-title">Succèsses...</h3> 
    <div class="box-tools"> 
    <button class="btn btn-box-tool" data-widget="collapse"><i class="fa fa-minus"></i></button> 
    </div> 
    </div> 
    <div class="box-body no-padding"> 
    <ul class="nav nav-pills nav-stacked"> 
    <li class="active"><a><b>L\'utilisateur '.$user_name.' à été créer</b></a></li> 
    </ul> 
    </div><!-- /.box-body --> 
    </div> 

    <script> 
     $("#myModal").removeClass() 
     $("#myModal").addClass(\'modal modal-success fade\'); 
    </script> 
    '; 

Answer 1

подфункций (а) не требуется,

$(document).ready(function(){ 
    $('form_selector').submit(function(e) { 
    e.preventDefault(); 

     $.ajax({ 
     type: 'post', 
     url: 'creer.php', 
     data: $('form_selector').serialize(), 
     success: function (response) { 
         $('#myModal').modal('show'); 
         $(".mydivinfo").html(response); 
     } 
     }); 

    // i have try withe post methode and that the same 
    /** $.post('creer.php', $(a).serialize(), function (data) { 
     $('#myModal').modal('show'); 
     $(".mydivinfo").html(data); 
    }).error(function() { 
     // This is executed when the call to mail.php failed. 
    });**/ 

    //alert(infos); 

    return false 
    }); 
}); 

Answer 2

зачем вам кнопку отправки на всех?

просто превратить ваш отправить в обычную кнопку:

<button name="addon" id="addon" type="button" class="save btn btn-success btn-block">Enregistrer les modifications</button> 

и ваш JQuery должен быть:

$(document).ready(function(){ 
    $('#addon').click(function(){ 
     $.ajax({ 
     type: 'post', 
     url: 'creer.php', 
     data: $('form_selector').serialize(), // Change the 'form_selector' 
     success: function (response) { 
      $('#myModal').modal('show'); 
      $(".mydivinfo").html(response); 
     } 
     }); 
    }); 
}); 

Answer 3

я нашел проблему :) ТНХ для всех :) этого сценария решить мою проблему и это работает со всеми браузерами: p

$(document).ready(function(){ 
    $('#addon').click(function(){ 

    var data = $('.createform').serialize(); 

    $.ajax({ 
    type: 'post', 
    url: 'creer.php', 
    data: data, 
    success: function (response) { 
     $('#myModal').modal('show'); 
     $(".mydivinfo").html(response); 
     alert(data); 

    } 
    }); 
    return false; 
}); 
});