0

これが可能かどうかはわかりませんが、そうあるべきだと思われます...

各ステートメントのphpで実行されているjavascriptポップアップボックスがあります。アプリケーションは座席表のようなものです。データベース テーブルには、それぞれ 10 席とテーブル ID を持つ 50 の宴会テーブルがあります。

データベースにクエリを実行し、テーブルのアクティブ フィールドが yes に設定されているすべてのフィールドを要求します。次に、テーブルごとにポップアップフォームを表示して、ユーザーが各座席の名前を入力できるようにします。問題はこれです。フォームの最初のインスタンスを開くと、テーブル ID が 1 と表示されます。フォームの 2 番目のインスタンスを開くと、テーブル ID 2 を表示したいのですが、テーブル ID 1 と表示されます。フォームの各インスタンスを取得するにはどうすればよいですか「次の」テーブルを表示するには？

私が使用しているコードは次のとおりです。

     global $wpdb;
$seatings = $wpdb->get_results("SELECT * FROM bb_cl_seating WHERE table_active='yes' ");

    if (count($seatings)===0){
    echo "<h2>There are no tables - Would you like to add one?</a>"; 
    } else  {
    foreach($seatings as $seating){
?>

    <!-- link that opens popup -->

<a class="popup-with-form" href="#table-form" onclick="jQuery('#table-form-<?php echo $seating->table_id; ?>').show(); return false;">Open form</a><br />
<!-- form itself -->
<form method="post" id="table-form-<?php echo $seating->table_id; ?>" class="white-popup-block mfp-hide">
    <h1>Celebrity Luncheon Seating</h1>
    <fieldset style="border:0;">

        <ol>
            <li>
            Table Number: <?php echo $seating->table_id; ?>
            </li>
            <li>
                <label for="seat_one">Seat One</label>
                <input name="seat_one" type="text" id="seat_one" value="<?php echo $seating->seat_one; ?>" size="50" />
            </li>
            <li>
                <label for="seat_two">Seat Two</label>
                <input name="seat_two" type="text" id="seat_two" value="<?php echo $seating->seat_two; ?>" size="50" />
            </li>
            <li>
                <label for="seat_three">Seat Three</label>
                <input name="seat_three" type="text" id="seat_three" value="<?php echo $seating->seat_three; ?>" size="50" />
            </li>
            <li>
                <label for="seat_four">Seat Four</label>
                <input name="seat_four" type="text" id="seat_four" value="<?php echo $seating->seat_four; ?>" size="50" />
            </li>
            <li>
                <label for="seat_five">Seat Five</label>
                <input name="seat_five" type="text" id="seat_five" value="<?php echo $seating->seat_five; ?>" size="50" />
            </li>
            <li>
            <input name='table_id' type='hidden' id='table_id' value='<?php echo $seating->table_id; ?>' /><input name='table_active' type='hidden' id='table_active' value='<?php echo $seating->table_active; ?>' /><input name="update" type="submit" id="Submit" value="update" />
        </ol>
    </fieldset>
</form>

<?php   } // closes for each ?>

    <script type="text/javascript">
    jQuery(document).ready(function( $ ) {

    $('.popup-with-form').magnificPopup({
        type: 'inline',
        preloader: false,
        focus: '#seat_one',

        // When elemened is focused, some mobile browsers in some cases zoom in
        // It looks not nice, so we disable it:
        callbacks: {
            beforeOpen: function() {
                if($(window).width() < 700) {
                    this.st.focus = false;
                } else {
                    this.st.focus = '#name';
                }
            }
        }
    });
});

</script>
4

2 に答える 2

0

jQuery function $('.popup-with-form') をループに入れて、多くの関数を生成し、クリックしようとすると、すべてが呼び出されて他のものが収集されますが、うまくいきません。 .

したがって、を使用する場合は、jquery 関数をループに入れないでください。[ドット] 演算子。

以下のコードを試してください

  global $wpdb;
$seatings = $wpdb->get_results("SELECT * FROM bb_cl_seating WHERE table_active='yes' ");

if (count($seatings)===0){
echo "<h2>There are no tables - Would you like to add one?</a>"; 
} else  {
foreach($seatings as $seating){  ?>

 <!-- link that opens popup -->
<a class="popup-with-form" href="#table-form">Open form</a><br />

<?php  } } ?>


<!-- form itself -->
<form id="table-form" class="white-popup-block mfp-hide">
<h1>Celebrity Luncheon Seating</h1>
<fieldset style="border:0;">

    <ol>
        <li>
        Table Number: <?php echo $seating->table_id; ?>
        </li>

    </ol>
</fieldset>


jQuery(document).ready(function( $ ) {
// pop up form script
$('.popup-with-form').magnificPopup({
    type: 'inline',
    preloader: false,
    focus: '#name',

    // When elemened is focused, some mobile browsers in some cases zoom in
    // It looks not nice, so we disable it:
    callbacks: {
        beforeOpen: function() {
            if($(window).width() < 700) {
                this.st.focus = false;
            } else {
                this.st.focus = '#name';
            }
        }
    }
});

});

</script>
于 2013-09-21T19:10:49.877 に答える