サンプルスクリプト」カテゴリーアーカイブ

javascript 複数のチェックボックスに一括でチェックを入力する

複数のチェックボックスに対して、一括でチェックを入力するチェックボックス


//一括チェックボックス
<input type=”checkbox” name=”allchk_0″ value=”1″ onclick=”allChk0(this.form.allchk_0)” >
//個別チェックボックス
<input type=”checkbox” name=”check1[1]” value=”1″ >
<input type=”checkbox” name=”check1[2]” value=”1″ >
<input type=”checkbox” name=”check1[3]” value=”1″ >
<input type=”checkbox” name=”check1[4]” value=”1″ >
<input type=”checkbox” name=”check1[5]” value=”1″ >
<input type=”checkbox” name=”check1[6]” value=”1″ >
<input type=”checkbox” name=”check1[7]” value=”1″ >
<input type=”checkbox” name=”check1[8]” value=”1″ >
<input type=”checkbox” name=”check1[9]” value=”1″ >
<input type=”checkbox” name=”check1[10]” value=”1″ >
<input type=”checkbox” name=”check1[11]” value=”1″ >
<input type=”checkbox” name=”check1[12]” value=”1″ >
<input type=”checkbox” name=”check1[13]” value=”1″ >
<input type=”checkbox” name=”check1[14]” value=”1″ >
<input type=”checkbox” name=”check1[15]” value=”1″ >
//一括チェック入力script
<script type=”text/javascript”><!–
function allChk0( Obj ) {
flg = Obj.checked;
document.form.elements[‘check1[1]’].checked = flg;
document.form.elements[‘check1[2]’].checked = flg;
document.form.elements[‘check1[3]’].checked = flg;
document.form.elements[‘check1[4]’].checked = flg;
document.form.elements[‘check1[5]’].checked = flg;
document.form.elements[‘check1[6]’].checked = flg;
document.form.elements[‘check1[7]’].checked = flg;
document.form.elements[‘check1[8]’].checked = flg;
document.form.elements[‘check1[9]’].checked = flg;
document.form.elements[‘check1[10]’].checked = flg;
document.form.elements[‘check1[11]’].checked = flg;
document.form.elements[‘check1[12]’].checked = flg;
document.form.elements[‘check1[13]’].checked = flg;
document.form.elements[‘check1[14]’].checked = flg;
document.form.elements[‘check1[15]’].checked = flg;
}
// –></script>

PHPと連携して一括チェックボックスを使う。

<?php
    //配列を定義
    $str_arr = array(1=>’aaa’,2=>’bbb’,3=>’ccc’,4=’ddd’,5=>’eee’);
?>
//一括チェックボックス
<input type=”checkbox” name=”allchk” value=”1″ onclick=”allChk(this.form.allchk)” />
<?php
//個別チェックボックスを配列より生成
foreach($str_arr as $key => $elemet){
    if($elemnt){
        ?>
        <input type=”checkbox” name=”check1[<?=key?>]” value=”1″ />
        <?php
    }
}
?>
<script type=”text/javascript”><!–
    function allChk<?=$index?>( Obj ) {
        flg = Obj.checked;
        <?php
        foreach($str_arr as $key => $element){
            if($element){
                ?>
                document.form.elements[‘check1[<?=$key?>]’].checked = flg; // ON・OFFを切り替え
                <?php
            }
        }
        ?>
    }
// –></script>

javascript TEXTAREAの入力制限

とあるWEBアプリを構築していたのですが、TABLE内に配置したTEXTAREAがネックになっていました。
なぜかと言うと、入力の時はTEXTAREAタグ内に文字列が表示されるので、何文字・何行あっても枠のサイズは決まっていたのでレイアウトが崩れることはなかったのですが、それを閲覧モードで表示すると文字数・行数によってはレイアウトが大幅に崩れてしまう。
ウィンドウ内の座標をもとに、レイアウトをしているのでTABLE内のレイアウトが崩れると大変なことになるんです。

そこで、TEXTAREAタグの入力制限を設けようと思い四苦八苦。

やっとのことでできました。

続きを読む