そうですね。
ただそういう細かいことより、テンプレート対応が必要だとわかりました。
フォーム用のアドオン、"Form Tableless Layout"というのを見つけました。
これをインストールするとフォームのタグが<div>タグになります。
これ、別のスレッドにします。
Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: 1.5.3のバグ?
2011年7月17日 at 8:45
具体的にご指摘いただいたところを修正しました。
ご指摘の後、ソースを見ていましたら、ご指摘の意味がわかりました。
Version 1.5.7 としてリリースします。
http://concrete5.tomo.ac/osusumeblock/form/
id="msg"は、エラーメッセージなので、エラーでないメッセージ用に、id="msg2" にしました。
classの指定は必要ですか?
私には意味や用途が分からないもので。
Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: 1.5.3のバグ?
2011年7月19日 at 10:08
tomoac様
テーマの変更に拡張フォームブロックの外観も統一するためには、
標準フォームブロックの構造やクラスを継承するのが一番だと思います。
なぜなら、標準のフォームブロックで使用されているクラスやIDのスタイルであれば
テーマ内のcssで指定されている可能性が高いからです。
標準フォームブロックの構造、クラス、IDをまとめてみました。
1.先頭にアンカータグを配置
2.アンカー以下のブロック全体をformブロックで囲んでいる
formのIDは "miniSurveyView"+bID 、クラスは"miniSurveyView"
3.目に見えるフォーム要素はテーブル内に配置
tableにはクラス"formBlockSurveyTable"を指定
4.左のtd(class="question")に質問の見出しを表示
右のtd(classなし)にフォーム要素を配置
5.テーブル最下行の右側tdに、submitボタンを配置
6.完了やエラーメッセージはform最上部にdivタグ(id="msg")内に配置
7.エラーメッセージはさらにdivタグ(class="error")で囲まれている
拡張フォームブロックは標準フォームブロックをベースに開発されているので
上記のほとんどはそのままなのですが、独自に拡張された部分がこれらのルールから
はずれている箇所があります。
それが前回あげさせていただいた、以下の2点です。
・id="msg"が指定されていないメッセージがある
・送信等のボタンがテーブル内に配置されていない。
また、今回"msg2"というidを増やされましたが、そうではなく(7)のように
エラーメッセージをdivタグ(class="error")で囲むのがベターです。
ちなみにIDとクラスについてですが、機能は似ていますが、その違いは、
IDはページ内で必ずユニークな要素ですが、クラスの方は同じクラスの要素が
複数あっても構わないモノです。
今、"msg"はidで指定していますが、本来はクラスで指定するべきだろうと思います。
以上、よろしくお願いいたします。
テーマの変更に拡張フォームブロックの外観も統一するためには、
標準フォームブロックの構造やクラスを継承するのが一番だと思います。
なぜなら、標準のフォームブロックで使用されているクラスやIDのスタイルであれば
テーマ内のcssで指定されている可能性が高いからです。
標準フォームブロックの構造、クラス、IDをまとめてみました。
1.先頭にアンカータグを配置
2.アンカー以下のブロック全体をformブロックで囲んでいる
formのIDは "miniSurveyView"+bID 、クラスは"miniSurveyView"
3.目に見えるフォーム要素はテーブル内に配置
tableにはクラス"formBlockSurveyTable"を指定
4.左のtd(class="question")に質問の見出しを表示
右のtd(classなし)にフォーム要素を配置
5.テーブル最下行の右側tdに、submitボタンを配置
6.完了やエラーメッセージはform最上部にdivタグ(id="msg")内に配置
7.エラーメッセージはさらにdivタグ(class="error")で囲まれている
拡張フォームブロックは標準フォームブロックをベースに開発されているので
上記のほとんどはそのままなのですが、独自に拡張された部分がこれらのルールから
はずれている箇所があります。
それが前回あげさせていただいた、以下の2点です。
・id="msg"が指定されていないメッセージがある
・送信等のボタンがテーブル内に配置されていない。
また、今回"msg2"というidを増やされましたが、そうではなく(7)のように
エラーメッセージをdivタグ(class="error")で囲むのがベターです。
ちなみにIDとクラスについてですが、機能は似ていますが、その違いは、
IDはページ内で必ずユニークな要素ですが、クラスの方は同じクラスの要素が
複数あっても構わないモノです。
今、"msg"はidで指定していますが、本来はクラスで指定するべきだろうと思います。
以上、よろしくお願いいたします。
Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: 1.5.3のバグ?
2011年7月19日 at 11:05
ご教示ありがとうございます。
すみません。結果、どうなんでしょう?
>拡張フォームブロックは標準フォームブロックをベースに開発されているので
>上記のほとんどはそのままなのですが、独自に拡張された部分がこれらのルールから
>はずれている箇所があります。
>
>それが前回あげさせていただいた、以下の2点です。
これは解決しましたでしょうか?
>また、今回"msg2"というidを増やされましたが、そうではなく(7)のように
>エラーメッセージをdivタグ(class="error")で囲むのがベターです。
msg2は、エラーでなく単なるメッセージなので、エラーと同じにはしなかったのですが、divタグ(class="error")で囲むほうがいいでしょうか。
>ちなみにIDとクラスについてですが、機能は似ていますが、その違いは、
>IDはページ内で必ずユニークな要素ですが、クラスの方は同じクラスの要素が
>複数あっても構わないモノです。
>今、"msg"はidで指定していますが、本来はクラスで指定するべきだろうと思います。
classで範囲を限定することで、同じネイ省のID名の重複を避けるということでしょうか。
すみません。結果、どうなんでしょう?
>拡張フォームブロックは標準フォームブロックをベースに開発されているので
>上記のほとんどはそのままなのですが、独自に拡張された部分がこれらのルールから
>はずれている箇所があります。
>
>それが前回あげさせていただいた、以下の2点です。
これは解決しましたでしょうか?
>また、今回"msg2"というidを増やされましたが、そうではなく(7)のように
>エラーメッセージをdivタグ(class="error")で囲むのがベターです。
msg2は、エラーでなく単なるメッセージなので、エラーと同じにはしなかったのですが、divタグ(class="error")で囲むほうがいいでしょうか。
>ちなみにIDとクラスについてですが、機能は似ていますが、その違いは、
>IDはページ内で必ずユニークな要素ですが、クラスの方は同じクラスの要素が
>複数あっても構わないモノです。
>今、"msg"はidで指定していますが、本来はクラスで指定するべきだろうと思います。
classで範囲を限定することで、同じネイ省のID名の重複を避けるということでしょうか。
Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: 1.5.3のバグ?
2011年7月19日 at 13:47
tomoac様
1.5.7確認をいたしました。
ちなみに修正の観点は、標準フォームブロックの構成に近づけることであって
良い悪いとは別問題だということをご承知ください。
>これは解決しましたでしょうか?
ありがとうございます、ほぼOKなのですが、ボタンを配置する最下行のtrにtdがひとつになっているのと、
不要なbrタグがはいっています。
<tr>
<td colspan="2"><input type="hidden" name="state" value="2"><br />
<input class="formBlockSubmitButton" name="Submit" type="submit" value="送信する" />
<input class="formBlockSubmitButton" name="Submit" type="submit" value="戻って修正する" /></td>
</tr>
↓
<tr>
<td> </td>
<td>
<input class="formBlockSubmitButton" name="Submit" type="submit" value="送信" />
<input class="formBlockSubmitButton" name="Submit" type="submit" value="戻って修正する" />
</td>
</tr>
>msg2は、エラーでなく単なるメッセージなので、エラーと同じにはしなかったのですが、
>divタグ(class="error")で囲むほうがいいでしょうか。
メッセージを囲むdivのIDは"msg2"→"msg"に変更して欲しいです。
そうでないと、id="msg2"へのcssスタイルをテーマに追加する必要が発生します。
メッセージのhtml構成は以下のように整理されればよろしいかと
<div id="msg">
ここに普通のメッセージ
<div class="error">ここにエラーメッセージ</div>
<div class="error">ここにエラーメッセージ2</div>
</div>
>classで範囲を限定することで、同じネイ省のID名の重複を避けるということでしょうか。
いえ、IDは必ず一意でなければならないのに、"msg"なんてありきたりな名前をつけるのは
重複する可能性が高いため不適切なID名だと思っています。
concrete5的には、formのid "miniSurveyView"+bID のように bID を加えたID名にする
のがベターかなと思います。
1.5.7確認をいたしました。
ちなみに修正の観点は、標準フォームブロックの構成に近づけることであって
良い悪いとは別問題だということをご承知ください。
>これは解決しましたでしょうか?
ありがとうございます、ほぼOKなのですが、ボタンを配置する最下行のtrにtdがひとつになっているのと、
不要なbrタグがはいっています。
<tr>
<td colspan="2"><input type="hidden" name="state" value="2"><br />
<input class="formBlockSubmitButton" name="Submit" type="submit" value="送信する" />
<input class="formBlockSubmitButton" name="Submit" type="submit" value="戻って修正する" /></td>
</tr>
↓
<tr>
<td> </td>
<td>
<input class="formBlockSubmitButton" name="Submit" type="submit" value="送信" />
<input class="formBlockSubmitButton" name="Submit" type="submit" value="戻って修正する" />
</td>
</tr>
>msg2は、エラーでなく単なるメッセージなので、エラーと同じにはしなかったのですが、
>divタグ(class="error")で囲むほうがいいでしょうか。
メッセージを囲むdivのIDは"msg2"→"msg"に変更して欲しいです。
そうでないと、id="msg2"へのcssスタイルをテーマに追加する必要が発生します。
メッセージのhtml構成は以下のように整理されればよろしいかと
<div id="msg">
ここに普通のメッセージ
<div class="error">ここにエラーメッセージ</div>
<div class="error">ここにエラーメッセージ2</div>
</div>
>classで範囲を限定することで、同じネイ省のID名の重複を避けるということでしょうか。
いえ、IDは必ず一意でなければならないのに、"msg"なんてありきたりな名前をつけるのは
重複する可能性が高いため不適切なID名だと思っています。
concrete5的には、formのid "miniSurveyView"+bID のように bID を加えたID名にする
のがベターかなと思います。
Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: 1.5.3のバグ?
2011年7月19日 at 15:08
> ありがとうございます、ほぼOKなのですが、ボタンを配置する最下行のtrにtdがひとつになっているのと、
> 不要なbrタグがはいっています。
ボタンの行はカラムが1列がいいと思って、colspan=2にしてtdを一つにしました。教えていただいたようにすると、ボタンが右に寄りますが、それがいいという意味でしょうか。
brはとります。
> メッセージを囲むdivのIDは"msg2"→"msg"に変更して欲しいです。
> そうでないと、id="msg2"へのcssスタイルをテーマに追加する必要が発生します。
評判の悪い、msg ですが、元のソースがmsgだったのでそのままにしています。
変更すると、formとの互換性に問題が出るかと思っていてそのままにしています。
msg2 のことはわかりました。エラーは<div class="error">で見た目が変えられるんですね。msg2, msg3 もmsg にします。
直接関係ありませんが、このさい教えてほしいですが、一口でいえばclassとidはどういう基準で使い分けるんですか?
> 不要なbrタグがはいっています。
ボタンの行はカラムが1列がいいと思って、colspan=2にしてtdを一つにしました。教えていただいたようにすると、ボタンが右に寄りますが、それがいいという意味でしょうか。
brはとります。
> メッセージを囲むdivのIDは"msg2"→"msg"に変更して欲しいです。
> そうでないと、id="msg2"へのcssスタイルをテーマに追加する必要が発生します。
評判の悪い、msg ですが、元のソースがmsgだったのでそのままにしています。
変更すると、formとの互換性に問題が出るかと思っていてそのままにしています。
msg2 のことはわかりました。エラーは<div class="error">で見た目が変えられるんですね。msg2, msg3 もmsg にします。
直接関係ありませんが、このさい教えてほしいですが、一口でいえばclassとidはどういう基準で使い分けるんですか?
Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: 1.5.3のバグ?
2011年7月19日 at 17:44
>ボタンの行はカラムが1列がいいと思って、colspan=2にしてtdを一つにしました。
>教えていただいたようにすると、ボタンが右に寄りますが、それがいいという意味でしょうか。
どちらがよいとかではなく、最初の送信フォームのボタン配置がそうなっているので
統一するならという程度の理由です。
>評判の悪い、msg ですが、元のソースがmsgだったのでそのままにしています。
>変更すると、formとの互換性に問題が出るかと思っていてそのままにしています。
はい、 標準フォームとの互換性のために、そのままにするほうがよいと思います。
>msg2 のことはわかりました。エラーは<div class="error">で見た目が変えられるんですね。
はい、ちなみに私はcssで、クラスがerrorなdivは赤く強調した表示に指定しています。
>直接関係ありませんが、このさい教えてほしいですが、一口でいえばclassとidはどういう基準で使い分けるんですか?
まず、idとクラスの違いは、先に述べたとおりidはページ内で一意でなければなりません。
そのため、idはページ内に必ず一度しか現れない要素に指定します。
例)ヘッダー、フッター、サイドバーなど...
複数表れる要素にidを指定する場合は、重複しないシリアル番号を付加したid名にします。
例)msg0001, msg0002...
で、具体的にどのような違い(効果)があるかというと
1.スタイルシートでの優先順位(重み付け)が違い、idでの指定が最優先です。
局所的にスタイルを変更したいような場合には、idを使うことがよくあります。
2.idを指定することで、javascriptなどで要素を一発で取り出し可能です。
値の読み書きや、表示のオンオフをしたい要素には、よくidを指定します。
3.idはページ内の位置指定にも使えます。<a href="#header">ページ先頭へ</a>
このような効果が欲しい場合にはidを使います。
>教えていただいたようにすると、ボタンが右に寄りますが、それがいいという意味でしょうか。
どちらがよいとかではなく、最初の送信フォームのボタン配置がそうなっているので
統一するならという程度の理由です。
>評判の悪い、msg ですが、元のソースがmsgだったのでそのままにしています。
>変更すると、formとの互換性に問題が出るかと思っていてそのままにしています。
はい、 標準フォームとの互換性のために、そのままにするほうがよいと思います。
>msg2 のことはわかりました。エラーは<div class="error">で見た目が変えられるんですね。
はい、ちなみに私はcssで、クラスがerrorなdivは赤く強調した表示に指定しています。
>直接関係ありませんが、このさい教えてほしいですが、一口でいえばclassとidはどういう基準で使い分けるんですか?
まず、idとクラスの違いは、先に述べたとおりidはページ内で一意でなければなりません。
そのため、idはページ内に必ず一度しか現れない要素に指定します。
例)ヘッダー、フッター、サイドバーなど...
複数表れる要素にidを指定する場合は、重複しないシリアル番号を付加したid名にします。
例)msg0001, msg0002...
で、具体的にどのような違い(効果)があるかというと
1.スタイルシートでの優先順位(重み付け)が違い、idでの指定が最優先です。
局所的にスタイルを変更したいような場合には、idを使うことがよくあります。
2.idを指定することで、javascriptなどで要素を一発で取り出し可能です。
値の読み書きや、表示のオンオフをしたい要素には、よくidを指定します。
3.idはページ内の位置指定にも使えます。<a href="#header">ページ先頭へ</a>
このような効果が欲しい場合にはidを使います。
Your post has been saved and will be published after approval by the forum moderator.
acliss
Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: Re: 1.5.3のバグ?
ひとつmsgはmsgとmsg2に分けるのが気になりました。
たとえば errormsg と checkmsgとするなど分かりやすい名前をつけることが必要ですよーーー。
参考にしてください。