6

送信したいフォームがありますが、ユーザーが送信ボタンをクリックすると、フォームの処理を続行するか、キャンセルしてフォームページに戻すTwitterブートストラップモーダルが表示されます。通常のJavaScript確認をブートストラップモーダルに変えることは可能ですか?

<form action="http://localhost.testing/modal-processing.php" class="form-horizontal" role="form" method="GET">
    <label>Landlord<span class="mandatory">*</span></label>
    <select class="form-control input-sm chosen chzn-select" tabindex="1" data-placeholder="Choose a landlord" data-rule-required="true" name="landlord_id" id="landlord_id">
        <option value=""></option>
        <option value="31" >Liam Lawlor</option>
        <option value="34" >Damian Lavelle</option>
        <option value="35" >Mick Lally</option>
        <option value="36" >Joanne Lavelle</option>
        <option value="37" >Liam Lacey</option>
        <option value="38" >Laura Luney</option>
        <option value="39" >Lenihan Enterprises</option>
    </select>

    <!-- modal caller -->
    <a href="#modal-dialog" class="modal-toggle" data-toggle="modal" data-href="http://localhost.testing/modal-processing.php" data-modal-type="confirm" data-modal-title="Delete Property" data-modal-text="Are you sure you want to delete {$property.address_string}?" data-modal-confirm-url="{$base_url}residential-lettings/properties/do-delete/property/{$property.id}"><i class="icon-trash"></i> Modal Submit</a>

    <!-- proper submit -->
    <input type="submit">
</form>
4

2 に答える 2

10

jQueryを介してフォーム送信をトリガーするために使用されるモーダルでリンク/ボタン(つまり、「btnYes」)を有効にすることにより、Bootstrapモーダルを確認として使用できます...

$('#btnYes').click(function() {
    // handle form processing here  
    $('form').submit(); 
});

これは実際のデモです: http://bootply.com/88094

于 2013-10-16T13:39:36.567 に答える
0

モーダル ボタンにクリック リスナーを追加するのは正しいことです。

$('#myModalButton').click(function(){
  //submit form
  // $('#myForm').submit(); // not working for me
  // $('#myForm')[0].submit(); //works, but is ugly
  $('#myForm').trigger('submit');  //works great
});

私が知る限り、 $('form') は配列を返します。$('form#myForm') でも配列が返されます。

そう、

$('form')[0].submit();

動作するはずです。

$('#myForm').trigger('submit');

私がそれを機能させることができる唯一の方法です。

于 2014-08-14T17:34:33.400 に答える