Wyświetlanie okienka Modal po wywołaniu AJAX'a

Mam kolejny problem otóż:

Potwierdzam wysłanie formularza, następuje wysłanie danych z formularza metodą POST poprzez AJAX. Po poprawnym wysłaniu do skryptu PHP ma zostać wyświetlony Modal z Bootstrapa:

<script>
$(function(){
    $('#myform').on('submit', function(e){
        e.preventDefault();
        $.ajax({
            url: 'content/ajax.php',
            type: 'POST',
            data: $('#myform').serialize(),
            success: function(data){
                  $("#test_modal").modal('show');       <----- wyświetlenie
            }
        });
    });
});
</script>
 
<div id="test_modal" class="modal-block modal-header-color modal-block-warning mfp-hide">
    <section class="panel">
        <header class="panel-heading">
            <h2 class="panel-title">Title</h2>
        </header>
        <div class="panel-body">
            <div class="modal-wrapper">
                <div class="modal-icon"><i class="fa fa-warning"></i></div>
                <div class="modal-text">
                    <h4>Title</h4>
                    <p>Jakis tam komunikat</p>
                </div>
            </div>
        </div>
        <footer class="panel-footer">
            <div class="row">
                <div class="col-md-12 text-right">
                    <a id="next_step" href=""><button class="btn btn-warning">Dalej</button></a>
                    <button class="btn btn-default modal-dismiss">Anuluj</button>
                </div>
            </div>
        </footer>
    </section>
</div>
 
 
<form id="myform" class="form-horizontal mb-lg" novalidate="novalidate">
  <input type="text" name="costam">
  <input type="text" name="costam2">
  <input type="submit" value="Wyslij">
</form>

Modal nie wyświetla się. Jeżeli jednak zrobię zwykłego linka do pokazywania Modala to działa:

<a class="mb-xs mt-xs mr-xs modal-basic" href="#test_modal">Pokaz okienko</a>

Używajcie testowania w izolacji!
Twój dialog się nie otwiera, ale pytanie brzmi czy to jak go próbujesz otworzyć w ogóle działa? Wywołaj manualnie

$("#test_modal").modal('show');

i sprawdź co się stanie. Dostaniesz wiele cennych informacji, m.in.:

• jeżeli dialog się otworzy to oznacza, że problem leży w metodzie success. Czy dochodzi do jej wywołania? Czy request się wykonuje prawidłowo?
• jeżeli dialog się nie otworzy, to czy są jakieś błędy? Może tak jak u mnie dostaniesz: VM73:57 Uncaught TypeError: $(...).modal is not a function(…)
  Kolejnym krokiem może być zaczęcie do d**y strony. Czyli otwierasz jsfiddle i doprowadzasz samo okienko do działania. Kopiujesz 1:1 kod z dokumentacji bootstrapa. Teraz jak okienko działa to dobudowujesz do niego formularz i co krok sprawdzasz, czy nic nie popsułeś. Łatwiej dobudować funkcjonalność do czegoś działającego niż szukać błędu w czymś niedziałającym.

Wywołuję manualnie:

$("#test_modal").modal('show');

Niestety nic się nie pojawia - jedynie przyciemnia ekran? Dlaczego go nie wyświetla?

Prawdopodobnie brakuje Ci klasy modal w oknie.

http://getbootstrap.com/javascript/#modals

Dzięki za ten przykład, dostosowałem go pod swój Modal i działa.