2011-02-03 6 views
0

私は座席予約プログラムを作りたいと思います。私は、チェックボックスをクリックすると、チェックボックスの値をラベルに置きます。チェックボックスの値をラベルに入れます

<table> 
      <tr> 
      <td><label> Naam </label></td> 
      <td> <div> <?php echo form_input($username); ?></div></td> 
      <td><label> Naam </label></td> 
      <td> <div> <?php echo form_input($username2); ?></div></td> 
     </tr> 
     <tr> 
      <td><label>e-mail </label></td> 
      <td><div> <?php echo form_input($email); ?></div></td> 
      <td><label>e-mail </label></td> 
      <td><div> <?php echo form_input($email2); ?></div></td> 
     </tr> 
     <tr> 
      <td><label> gsm-nummer </label></td> 
      <td><div> <?php echo form_input ($gsmnummer); ?> </div></td> 
      <td><label> gsm-nummer </label></td> 
      <td><div> <?php echo form_input ($gsmnummer2); ?> </div></td> 
     </tr> 
     <tr> 
      <td><label>zitplaats</label></td> 
      <td><div id="seatDiv"> <?php echo form_label('seat'); ?> </div></td> 
       <td><label>zitplaats</label></td> 
      <td><div id="seatDiv2"> <?php echo form_label('seat'); ?> </div></td> 
     </tr> 
     <tr> 
     <td> <?php echo form_submit(array('name'=> 'verzend','value' => 'verzend')); ?> </td> 
     <td> <?php echo form_submit(array('name'=> 'plaats','value' => 'Bevestig plaats')); ?> </td> 
     <?php echo form_close(); ?> 

    <?php echo form_open('user/register3'); ?> 
      <td><?php echo form_submit(array('name'=> 'Voeg_toe','value' => 'voeg toe')); ?> </td> 
     </tr> 
    </table> 

    <?php echo form_close(); ?> 
<table> 
    <tr> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z01" align="center" onchange="javascript:process()"/> </th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z02" align="center" onchange="javascript:process()"/></th> 
     <th width="6" scope="col">&nbsp; </th> 
     <th width="6" scope="col">&nbsp;</th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z03" align="center" onchange="javascript:process()"/> </th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z04" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z05" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z06" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z07" align="center" onchange="javascript:process()"/></th> 
     <th width="6" scope="col">&nbsp; </th> 
     <th width="11" scope="col">&nbsp;</th> 
     <th width="26" scope="col">&nbsp; <input type="checkbox" name="check" value="Z08" align="center" onchange="javascript:process()"/> </th> 
     <th width="20" scope="col">&nbsp; <input type="checkbox" name="check" value="Z09" align="center" onchange="javascript:process()"/></th> 
</tr> 
<tr> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z10" align="center" onchange="javascript:process()"/> </th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z11" align="center"/></th> 
     <th width="6" scope="col">&nbsp; </th> 
     <th width="6" scope="col">&nbsp;</th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z12" align="center" onchange="javascript:process()"/> </th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z13" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z14" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z15" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z16" align="center" onchange="javascript:process()"/></th> 
     <th width="6" scope="col">&nbsp; </th> 
     <th width="6" scope="col">&nbsp;</th> 
     <th width="26" scope="col">&nbsp; <input type="checkbox" name="check" value="Z17" align="center" onchange="javascript:process()"/> </th> 
     <th width="20" scope="col">&nbsp; <input type="checkbox" name="check" value="Z18" align="center" onchange="javascript:process()"/></th> 
</tr> 
<tr> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z19" align="center" onchange="javascript:process()"/> </th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z20" align="center" onchange="javascript:process()"/></th> 
     <th width="6" scope="col">&nbsp; </th> 
     <th width="6" scope="col">&nbsp;</th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z21" align="center" onchange="javascript:process()"/> </th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z22" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z23" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z24" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z25" align="center" onchange="javascript:process()"/></th> 
     <th width="6" scope="col">&nbsp; </th> 
     <th width="6" scope="col">&nbsp;</th> 
     <th width="26" scope="col">&nbsp; <input type="checkbox" name="check" value="Z26" align="center" onchange="javascript:process()"/> </th> 
     <th width="20" scope="col">&nbsp; <input type="checkbox" name="check" value="Z27" align="center" onchange="javascript:process()"/></th> 
</tr> 
<tr> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z28" align="center" onchange="javascript:process()"/> </th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z29" align="center" onchange="javascript:process()"/></th> 
     <th width="6" scope="col">&nbsp; </th> 
     <th width="6" scope="col">&nbsp;</th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z30" align="center" onchange="javascript:process()"/> </th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z31" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z32" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z33" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z34" align="center" onchange="javascript:process()"/></th> 
     <th width="6" scope="col">&nbsp; </th> 
     <th width="6" scope="col">&nbsp;</th> 
     <th width="26" scope="col">&nbsp; <input type="checkbox" name="check" value="Z35" align="center" onchange="javascript:process()"/> </th> 
     <th width="20" scope="col">&nbsp; <input type="checkbox" name="check" value="Z36" align="center" onchange="javascript:process()"/></th> 
</tr> 
<tr> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z37" align="center" onchange="javascript:process()"/> </th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z38" align="center" onchange="javascript:process()"/></th> 
     <th width="6" scope="col">&nbsp; </th> 
     <th width="6" scope="col">&nbsp;</th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z39" align="center" onchange="javascript:process()"/> </th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z40" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z41" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z42" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z43" align="center" onchange="javascript:process()"/></th> 
     <th width="6" scope="col">&nbsp; </th> 
     <th width="6" scope="col">&nbsp;</th> 
     <th width="26" scope="col">&nbsp; <input type="checkbox" name="check" value="Z44" align="center" onchange="javascript:process()"/> </th> 
     <th width="20" scope="col">&nbsp; <input type="checkbox" name="check" value="Z45" align="center" onchange="javascript:process()"/></th> 
</tr> 
<tr> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z46" align="center" onchange="javascript:process()"/> </th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z47" align="center" onchange="javascript:process()"/></th> 
     <th width="6" scope="col">&nbsp; </th> 
     <th width="6" scope="col">&nbsp;</th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z48" align="center" onchange="javascript:process()"/> </th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z49" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z50" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z51" align="center" onchange="javascript:process()"/></th> 
     <th width="23" scope="col">&nbsp; <input type="checkbox" name="check" value="Z52" align="center" onchange="javascript:process()"/></th> 
     <th width="6" scope="col">&nbsp; </th> 
     <th width="6" scope="col">&nbsp;</th> 
     <th width="26" scope="col">&nbsp; <input type="checkbox" name="check" value="Z53" align="center" onchange="javascript:process()"/> </th> 
     <th width="20" scope="col">&nbsp; <input type="checkbox" name="check" value="Z54" align="center" onchange="javascript:process()"/></th> 
    </tr> 
</table> 

procces関数は、以前に書かれた関数であり、チェックボックスを1つしか選択できません。

+0

jQueryのではなく、サーバー、クライアントの側に作用します。これを念頭に置いて、PHP /サーバーサイドスクリプトではなくレンダリングされたHTML(ビューソース)を投稿できますか? –

答えて

0
<label id="SeatNumber">  
<input type="checkbox" name="check" value="Z08" align="center" onchange="javascript:process(this)"/> 
$("SeatNumber").html(this.value); 
+0

このコードはどこに置くべきですか? – Steaphann

1

あなたのonchange方法でこのような何かを行うことができます。

$("#seatDiv").html($(this).val()); 

持つ:

<tr> 
     <td><label>seat</label></td> 

     <td><div id="seatDiv"> <?php echo form_label('seat'); ?> </div></td> 
</tr> 

をあなたのhtmlに。

JQueryを使用すると、この動作をすべてのシートチェックボックスに簡単に追加できます。

はちょうどページのグローバル・スクリプトでこれを入れて、これはすべてのチェックボックスを自動的に行うました:

$(document).ready(function() { 
$("input[name=check]").change(function() { 
    $("#seatDiv").html($(this).val()); 
} 

}

+0

しかし私はまた、私のチェックボックスにonchangeメソッドproccessを持っています。これは動作するはずですか?   Steaphann

+0

実際にできることは、新しい動作を管理するいくつかのグローバルスクリプトを追加することです。私の答えの追加のコードを確認してください – Saaman

+0

しかし、私は2人の予約をしたい場合は、知っている。私は関数を2回コピーしましたが、#seatDivを#seatDiv2に変更しました。プロジェクトが実行され、2番目のシートを選択すると、1番目のシートもte秒に変更されます。 – Steaphann

0
$('input[name=checkbox]').click(function(){ 
$('#labelId').text($(this).val()); 

}); 
+0

このコードはどこに置く必要がありますか? – Steaphann

+0

あなたのjsファイル内の任意の場所..それは動作します – Vivek

関連する問題