mailformproは機能いっぱいでとても便利なのでいつも重宝している。今まではほぼ標準のままで特に困った事もなかったのだけれど、今回はフォームのチェックボックスを排他にしたかったので（一方にチェックを入れると他方のチェックが入らない、みたいな）、ちょっとjavascriptで考えてみた。

まぁまず普通に、チェックを入れた側のidを使って

ischecked = document.formid.checkboxid.checked;

みたいな感じで値を取得して、

if ( ischecked == true ) {
  処理;
}

みたいにして順番に確認していけばいいかなー、と思ってそのように書いてみた。
ローカルではちゃんと動作したのでネット上にあげてみたら、あれ動かない。

firefoxのコンソールで確認していると、チェックボックスにチェックを入れた時にonblurで動作するようにしていたのだけれど、onblurが全然効いていない。はて、と思ってコンソールをよく眺めてみると、そうかmailformproのcgiがonblurでの処理を持っていっちゃってるのねー、という事に気がついた。

じゃあcgiに埋め込んでしまえばいいんだよね、と思いonblurでの処理を書いているところを探したら、実際にはmailformpro.cgiじゃなくてlibrarysフォルダ内のcore.jsの中に書かれている。チェックボックスに関わる処理は、

else if(e.type == 'checkbox' || e.type == 'radio'){

から始まるあたりっぽい。なのでそこに自作関数を埋め込んだ。実際にはdisablecb();みたいなの書いておいて、実際のdisablecb();の処理は別の外部jsファイルに書いたのだけれど。

それでonblurなりonclickなりのイベントで好きなjavascriptを動かす事ができたのだけれど、最初に書いたみたいな値の参照が出来ない・・・で、うちはjQuery使っているので、それで値を参照してみたらどうかなと。

ischecked = $(#checkboxid).prop('checked');

って感じで書いてみたら、無事にチェックボックスのチェック値が参照できた。

これで、onclick時にチェックボックスのチェック値が分かって別idのチェックボックスの値も変えられるのでOKかなー、と思ったのだけれど、肝心な「どのチェックボックスをクリックしてるのか」が分からないのでスマートな動作にならない。はてどうしたものか・・・と思いつつcore.jsを眺めてると、どうやらdisablecb(this.id);て感じにthis.idを引数にしておくと、クリックしたチェックボックスのidが取得できるみたい。

あとは排他になる組み合わせが20個くらいあって、それをどう処理していけばいいかなーという点も考えたのだけど、それはもう配列使って決め打ちで処理する事に決定。

クソみたいなコードだけどここに書いておこう。あくまで備忘録だし。

//チェックボックスの重複を確認する
function disablecb(thisid) {
    //idの組み合わせを配列にする
    var array = [
        ["hoge01","fuga01"],//0 idがhoge01、fuga01の組み合わせ 以下同様
        ["hoge02","fuga02"],//1
        ["page04","hoge03"], //2
        ["page05","hoge04"],//3
        ["hoge06","page06"],//4
    ];
    for (i=0;i<5;i++) {
        //arrayidにチェックボックスのidを入れる
        var arrayid1 = array[i][0];
        var arrayid2 = array[i][1];
        //クリックされた要素で条件分岐
        if ( thisid == arrayid1 ) { //要素がarrayid1の時
            $("#"+arrayid2).prop('checked',false); //arrayid2のチェック外す
        } else if ( thisid == arrayid2 ) { //要素がarrayid2の時
            $("#"+arrayid1).prop('checked',false); //arrayid1のチェック外す
        };
    };
}

こんな感じで書いておいて、 disablecb(this.id); をcore.jsの該当部分に書いておけば、onclickで動作してくれるハズ。

こんな感じで、チェックが入っている数を数えたり、その数値に単価を掛けて値段を出したり、さらにそれらの小計を計算したりもできる・・・ハズ・・・（mailformproに、既に見積もり計算機能とかはあるけれど)。