Bug #63668 for CGI: Suggest another IMPROVE with code, details, diff inlude

Hello, I can not use git, so post on rt.cpan. After my previous Improvement (charset in script), I'm glad to suggest you an important add for me. When I work with CGI.pm, almost each time I must to switch in html syntax for checkbox and box_group because we cannot use <label for=""> and some problemes with box_group. Attachement files ; - details.txt : details, tests, notes... - CGI.new.pm : proposal code - CGI.pm : original code (from cpan CGI.pm 3.50) - sdiffOrigin2Suggest.diff : gnu sdiff (without -s option) With actual CGI 3.50, we CANNOT : - have a diferents labels for each <input> for box_group, so you cannot build differents attributs in label for each input. - you cannot add diferents values of id attribut for each element of box_group. - deal with a lot of javascript lib because <input> element are siblings of label in checkbox and box_group. ... My suggest code allow : - to use <label for=""> - to choose label position, before, after or default surrounds (new tag -labelpos) - to use differents values for id attribut for each <input> (new tag -id) for box_group - to add differents values for label attributs for different <input> according id attribut. Why according id attribut ? Because if label is detached (<label for="">), id is the 'reference'. - to respect W3C recommends with <label for> ... I forgot, All my tests was with perl 5.8.8 (last redhat version is realy in late! incredible for 2000$/licence...) Fabrice Metge

Hello, It has nothing to do with my suggest but, why this address "http://search.cpan.org/dist/CGI.pm/" going to CGI.pm-3.49, instead 3.50 ? Ennoying because, this next part in CGI.pm redirect with "http://search.cpan.org/dist/CGI.pm/" # # The most recent version and complete docs are available at: # http://stein.cshl.org/WWW/software/CGI/ #-===========================================================================-# SO, I would like to suggest some other improvement for CGI. My english is not realy good, (I'm saving french reputation :-)), so, if i'm not clear, ask me. (my previous improved was add charset attribut in <script> if you remember). I don't know use git, so post on rt.cpan. Attachement files ; - details.txt : details of this message - CGI.new.pm : proposal code - sdiffOrigin2Suggest.diff : gnu sdiff (without -s option) with CGI.pm from official CPAN version 3.50 ################## #== OBSERVATIONS ################## Often, I must switch in html code because CGI.pm cannot render <label for> for checkbox and _box_group. With actual version and label surrounds <input>, you CANNOT : - have a diferents labels for each <input> for box_group, so you cannot build differents attributs in label for each input. - you cannot add diferent values of id attribut for each element of box_group. - deal with a lot of javascript lib because <input>s are siblings of label in checkbox and box_group for exemple. ... My suggest code allow : - to use <label for=""> - to choose label position, before, after or default surrounds (new tag -labelpos) - to use differents values for id attribut for each <input> (new tag -id) for box_group - to add differents values for label attributs for different <input> according id attribut. Why according id attribut ? Because if label is detached (<label for="">), id is the 'reference'. - to respect W3C recommends with <label for> ################## #== W3C LINKS ################## --- W3C accessibility guidelines --- http://www.w3.org/TR/WCAG20-TECHS/H44.html http://www.w3.org/TR/WCAG20-TECHS/H71.html#H71-examples --- W3C html4 --- http://www.w3.org/TR/html4/interact/forms.html#h-17.9 ################## #== ABOUT CODE ################## # POD : update # checkbox : - add new "labelpos" attribut for placing <label> (before or after or default surround) <input> # _box_group : - add "labelpos" attribut for placing <label> (before, after or default surround) <input>. - add "id" attribut as array ref, for generate different id for each box_group, if not array ref, same id for all (keep compatibility with code which have already id attribut ) - Now, I can add differents id attribut value for each <input>, I can place <label>, before, after, surround <input>, I can create <label for> and fill it by id of my choice, I can create attribut in label whithout impact for <input>. DOM is easier to manipulate, because <label> is not a parent of <input> - I wouln't create a special method label_for because if we keep the logic, 'for' is an attribut of label, so, must be in labelattributes and also because -labelpos, -id, -labelattributes attributs together can do this job. EXAMPLE : print checkbox_group( -id=>['a', 'b', 'c'], # if not array ref, same id for each <input> -class=>"get_it", # class of <input> -checked=>0, -value=>['TOTO','TATA','TITI'], -defaults=>['TOTO'], -labels=>{'TOTO'=>'toto', 'TATA'=>'tata', 'TITI'=>'titi'}, -labelpos=>'after', # 'before' or 1 ; 'after' or 2 -labelattributes=>{ 'a'=>{'for'=>'a', 'class'=>'red'}, # class of <label> of <input> with id='a' 'b'=>{'for'=>'b'}, 'c'=>{'for'=>'c'} ); # output : <input type="checkbox" name="" value="TOTO" checked="0" id="a" class="get_it" /><label for="a" class=>"red">toto</label> <input type="checkbox" name="" value="TOTO" checked="0" id="b" class="get_it" /><label for="b">tata</label> <input type="checkbox" name="" value="TOTO" checked="0" id="c" class="get_it" /><label for="c">titi</label> # Attention : If labelpos is used, labelattributes must be use like this, due to id as key (for <label for>) -labelattributes=>{ 'a'=>{'for'=>'a'}, 'b'=>{'for'=>'b'}, 'c'=>{'for'=>'c'} If labelpos is not used, labelattributes must be use like this for keeping compatibility with older code -labelattributes=>{ 'attribut'=> 'value'} ###################### #== DIFFERENTS TESTS ###################### ## TEST 1 (checkbox with label before input) use CGI; $q = CGI::->new(); print $q->header(-type => 'text/html'), $q->tr($q->td($q->checkbox( -class=>'get_it', -id=>'toto', -checked=>1, -value=>1, -label=>1, # add attribut for placing <label> value must be 1 or 2 or respectively 'before' or 'after' # if no labelpos attribut, label surround input (like previously) -labelpos=>'before', -labelattributes=>{'for'=> 'toto, 'class'=>'hide'}))); __END__ ## XHTML OUTPUT (with reformat indent and end lines) <tr> <td> <label for="toto" class="hide">titi</label> <input type="checkbox" name="" value="1" checked="checked" id="toto" class="get_it" /> </td> </tr> ## COMMENT cool, I can hide label without hide checkbox and without Javascript. Cool, I can sort a checkbox in a table with my hidden label ('0 ' or '1' or other) ################################################################### ## TEST 2 (placing label after input box form) use CGI; $q = CGI::->new(); print $q->header(-type => 'text/html'), $q->td($q->checkbox( -class=>'get_it', -id=>'toto', -checked=>1, -value=>1, -label=>1, -labelpos=>'after', -labelattributes=>{'for'=> 'toto, 'class'=>'hide'})); __END__ ## XHTML OUTPUT <td><input type="checkbox" name="" value="1" checked="checked" id="toto" class="get_it" /><label for="toto" class="hide"> 1 </label></td> ## COMMENT cool, some javascript lib can draw a beautiful dropdown list checkbox ################################################################### ## TEST 3 (default place label surround as before) use CGI; $q = CGI::->new(); print $q->header(-type => 'text/html'), $q->tr($q->td($q->checkbox( -class=>'get_it', -id=>'toto', -checked=>1, -value=>1, -label=>1, ))); ## XHTML OUTPUT <label> <input type="checkbox" name="" value="1" checked="checked" id="toto" class="get_it" />1 </label> ################################################################### ## TEST 4 (checkbox group, place label after) use CGI; $q = CGI->new(); print $q->header(-type => 'text/html'), $q->td($q->checkbox(-class=>'get_it', -id=>'get_it-'.$a->[1].'-'.$a->[0], -checked=>$a->[4], -value=>1, -label=>$a->[4]), $q->checkbox_group(-class=>'get_it', -id=>['idtoto', 'idtata', 'idtiti'], -value=>['TOTO','TATA','TITI'], -labels=>{'TOTO'=>'toto', 'TATA'=>'tata', 'TITI'=>'titi'}, -labelattributes=>{ 'idtoto'=>{'for'=>'idtoto', 'class'=>'red'}, 'idtata'=>{'for'=>'idtata'}, 'idtiti'=>{'for'=>'idtiti'} }, -labelpos=>'after', )); __END__ ## XHTML OUTPUT (reformat indent) <label> <input type="checkbox" name="" value="1" id="get_it-bwCarrierCic.0-cas_nsxs_ach4casns01" class="get_it" />0 </label> <input type="checkbox" name="" value="TOTO" id="idtoto" class="get_it" /> <label for="idtoto" class="red">toto</label> <input type="checkbox" name="" value="TATA" id="idtata" class="get_it" /> <label for="idtata">tata</label> <input type="checkbox" name="" value="TITI" class="get_it" /> <label for="idtiti">titi</label> ################################################################### ## TEST 5 (checkbox + checkbox group with different id and label default place) use CGI; $q = CGI->new(); print $q->header(-type => 'text/html'), $q->td($q->checkbox( -class=>'get_it', -id=>'get_it-'.$a->[1].'-'.$a->[0], -checked=>$a->[4], -value=>1, -label=>$a->[4], # -labelpos=>'after', # -labelattributes=>{'for'=> 'get_it-'.$a->[1].'-'.$a->[0], 'class'=>'hide'} ), # $q->label({'class' => 'hide', 'for' => 'get_it-'.$a->[1].'-'.$a->[0]}, $a->[4]) # ), $q->checkbox_group( -class=>'get_it', # -id=>'get_it-'.$a->[1].'-'.$a->[0], # -id=>['a', 'b', 'c'], #init $a="a"; -id=>['idtoto', 'idtata', 'idtiti', 'yesyes'], # -checked=>$a->[4], -value=>['TOTO','TATA','TITI'], # -defaults=>[], -labels=>{'TOTO'=>'toto', 'TATA'=>'tata', 'TITI'=>'titi'}, # -labelattributes=>{'for'=> 'get_it-'.$a->[1].'-'.$a->[0]}, # -labelattributes=>{'for'=> 'zzz'}, -labelattributes=>{'testcompatible'=>'good'} ); __END__ ## XHTML OUTPUT (with reformat) <td> <label> <input type="checkbox" name="" value="1" id="get_it-bwCarrierCic.0-cas_nsxs_ach4casns01" class="get_it" />0 </label> <label testcompatible="good"> <input type="checkbox" name="" value="TOTO" id="idtoto" class="get_it" />toto </label> <label testcompatible="good"> <input type="checkbox" name="" value="TATA" id="idtata" class="get_it" />tata </label> <label testcompatible="good"> <input type="checkbox" name="" value="TITI" id="idtiti" class="get_it" />titi </label> </td>