20

私は最近、Java/jboss を使用して Twitter のブートストラップをいじっています。モーダル インターフェイスからフォームを送信しようとしています。

フォームはモーダル自体の外部にあり、これがどのように可能になるかわかりません

モーダル自体をフォームに追加して、HTML5 form="form_list" を使用しようとし、フォームをモーダル本体に追加して、jquery を使用して送信を強制しようとしましたが、何も機能していないようです

以下は、必要なものを拡張しようとしていたサンプル モーダルです。以前は [OK] ボタンを編集して jquery 関数を呼び出そうとしていました。

<div class='modal small hide fade' id='myModal' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'>
    <div class='modal-header'>
        <button type='button' class='close' data-dismiss='modal' aria-hidden='true'>×</button>
        <h3 id='myModalLabel'>Delete Confirmation</h3>
    </div>
    <div class='modal-body'>
        <p class='error-text'>Are you sure you want to delete the user?</p>
    </div>");
    <div class='modal-footer'>
        <button class='btn btn-danger' data-dismiss='modal' aria-hidden='true'>Cancel</button>
        <button class='btn btn-success' data-dismiss='modal'>Ok</button>
    </div>
</div>
4

5 に答える 5

2

古いですが、読者がモーダルの使用方法の完全な例を持っていると役立つかもしれません。

私は次のようにしています（作業例jsfiddle）：

$('button.btn.btn-success').click(function(event)
{

event.preventDefault();

$.post('getpostcodescript.php', $('form').serialize(), function(data, status, xhr)
    {
        // do something here with response;
        console.info(data);
        console.info(status);
        console.info(xhr);
    })
    .done(function() {
        // do something here if done ;
        alert( "saved" );
    })
    .fail(function() {
        // do something here if there is an error ;
        alert( "error" );
    })
    .always(function() {
        // maybe the good state to close the modal
        alert( "finished" );
        // Set a timeout to hide the element again
        setTimeout(function(){
          $("#myModal").hide();
        }, 3000);
    });
});

モーダルをより簡単に扱うには、eModal を使用することをお勧めします。これにより、ブートストラップ 3 モーダルの基本的な使用を高速化できます。

于 2015-12-31T11:01:13.647 に答える