3

foreach ループからチェックボックスのリストを生成し、それぞれに ID を与えています。作成されたチェックボックスに応じて、表示される一連の div を以下に追加しました。id 変数を jQuery if ステートメントにロードし、.toggle を使用して対応する div を表示または非表示にできると考えていました。

<?php 
//Call Programs
$getPrograms = Doctrine::getTable('Program')->createQuery()->where('subsection=?', 'mfa')->orWhere('subsection=?', 'mps')->orWhere('subsection=?', 'mat')->orWhere('subsection=?', 'ma')->orderBy('title ASC')->execute(); ?>

    <div class="form_row">
     <label>
    <span><sup class="required_form_item">*</sup>Select Program</span>
    </label>
        <div class="buttonColumn" style="margin-left:170px;">
        //loop the records in with checkboxes
        <?php foreach ($getPrograms as $prog): ?>
              <?php 
              $subsection = $prog->getSubsection();
              $subsection = strtoupper($subsection);

              $trimProg = trim($prog->getTitle(), ' ');
              $removeChars = array(" ", "&");
              $trimProg = str_replace( $removeChars, '', $trimProg ); 
              $trimProg = preg_replace('/\s\s+/', '_', $trimProg);

              ?>
              //custin id matches record title
              <input type="checkbox" name="program" class="isChecked" id="<?php echo $trimProg; ?>" value="<?php echo $subsection . " " . $prog->getTitle() ?>" /><?php echo $subsection . " " . $prog->getTitle() ?><br />
        <?php endforeach ?>
        </div>
    </div>

次の div は、一致するチェックボックスがチェックされるまで、display:none に設定されます。

    <div class="form_row sessionTime" id="Program1" style="display:none;">
    Please choose an session time:
    <input type="checkbox" name="schedule" value="5:00 pm" />5:00 pm<br />
    </div>

    <div class="form_row sessionTime" id="program2" style="display:none;">
    Please choose an session time:
    <input type="checkbox" name="schedule" value="10:00 pm" />10:00 pm<br />
     </div>    
    ...

そして、これは私がうまくいくと思っていたものです...しかし、残念ながら...そうではありません

$('.isChecked').click( function() {

    if ( $(this).is(':checked') ) {
      $thisID = $(this).attr("id");
      $('.'+ $thisID).show();
    }
    else {
      $('.'+ $thisID).hide();
    }
  }
);
4

2 に答える 2

1

このようにではなく、 「Program1」をclass名前として使用する必要がありますid

<div class="form_row sessionTime Program1" style="display:none;">
  Please choose an session time:
  <input type="checkbox" name="schedule" value="5:00 pm" />5:00 pm<br />
</div>

そして、jQuery コードが機能するはずです。これは、次のように簡略化できます。

$('.isChecked').click( function() {
  if ( $(this).is(':checked') ) {
    $('.'+ this.id).show();
  }
  else {
    $('.'+ this.id).hide();
  }
});
于 2012-06-27T19:19:53.577 に答える
1

私はこのコードを自宅でテストしましたが、あなたが望むように動作します

<html>
<head>
    <script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>
    <script>
        $(document).ready(
            function()
            {
                $('.isChecked').click( 
                    function() 
                    {

                        if ( $(this).is(':checked') ) 
                        {
                             $(this).show();
                        }
                        else
                        {
                            $(this).hide();
                        }
                    }
                ); 
            }
        );
    </script>
</head>
<body>
    <form>
        <input type="checkbox" name="program" class="isChecked"/>
        <input type="checkbox" name="program" class="isChecked"/>
        <input type="checkbox" name="program" class="isChecked"/>
        <input type="checkbox" name="program" class="isChecked"/>
    </form>
</body>

コードの問題は、アクションリスナーをバインドする前にDOM全体がロードされるのを待つ $(document).ready() ハンドラーに起因すると思います。さらに、jquery コードが機能しませんでした。私のバージョンは機能しているようですが、チェックボックスが非表示になると、ユーザーはそれらを処理できなくなります。

そうでなければ、テンプレートで Doctrine リクエストを行うのは非常に悪い考えだと思います。

さよなら ！

于 2012-06-27T15:56:46.837 に答える