Twitter Bootstrap modal - "uzak" içerik yükleme

Question

"Uzak" içeriği, temelde bir HTTP isteği (aynı sitede) aracılığıyla gönderilen bilgileri yüklemeye çalışıyorum. döndürülen içeriğin kendisi gibi bilgileri geri atar: modal kutusu uzaktan içerik göstermek için

<div class="modal-header"> 
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">&times; </button> 
<h3>Change Your Password</h3> 
</div> 
<div class="modal-body"> 
<form> 
    <fieldset> 
     <label>Your current password</label> 
     <input type="password" placeholder="password"> 
     <label>Confirm current password</label> 
     <input type="text" placeholder="password"> 

     <button type="submit" class="btn">Submit</button> 
    </fieldset> 
</form> 
</div> 
<div class="modal-footer"> 
    <a href="#" class="btn btn-primary" data-dismiss="modal">Close</a> 
</div> 

Ancak, ben zaten modal-body sınıfını gösteren gerektiğine inanıyoruz:

<div class="modal fade hide" id="ajax"> 
    <div class="modal-body"> 
     <p>body content to be replaced</p> 
    </div> 
</div> 

nasıl Bu adımı atarım ve tam modal div içeriğini sağlar ve düzgün şekilde gösterilmesini sağlar mıyım?

Answer 1

Modal gövdeyi bir web sayfasıyla doldurmak istediğiniz gibi görünüyor. Bir a etiketini kullanarak ve veri hedefi kullanarak modal uygulayarak herhangi nitelikleri: Uzak bir url sağlanırsa, içerik jQuery'nin yük aracılığıyla yüklenir

<a id="file_attach" data-toggle="modal" href="http://fiddle.jshell.net/jhfrench/6K8rD/show/" data-target="#utility" class="btn">Modal 1</a>

Twitter documentation notlar

yöntem ve .modal-vücut içine enjekte edildi. Verileri api kullanıyorsanız, uzaktan kaynağını belirtmek için alternatif olarak href etiketini kullanabilirsiniz.

bir örnek için http://jsfiddle.net/jhfrench/qv5u5/ bakınız (ve birden çağıran bağlantıları arasında bir modal resuse hakkında ayrıntılı bilgi için How can I reuse one Bootstrap modal div? bakınız).