投稿ありがとうございます。
フォーム作成のためのプラグインを使っているのですが、入力がなかった項目に関しては
display:<?PHP if(!isset$〇〇){echo "none";}else{echo "";} ?>;
のようにして確認画面で表示させないようにしたいと考えているのですが、変数が変わってもCSSが変わらずに困っています。
フォーム作成用のプラグインはMW WP Formを利用しているのですが、過去の参考に出来そうな投稿を読んだところ、安全性の面でCSSで制御したほうがいいということでしたので、上記のような方法を使おうと考え、こちらにてご質問させて頂きました。
よろしくお願い致します。
確認画面なんですね
PHPを使わなくても、CSSでもできそうな気がしますが
http://zero.css-happylife.com/selectors/empty.shtml
プラグインの日付のプリビューを見たところ、プリビューはタグ付けされていないみたいなので、タグ付けのためのカスタマイズ方法があれば別ですが、難しそうな印象でした。
ご回答ありがとうございます。
ご教示頂いたサイトを参考にして
table td:empty {
display: none;
}
というふうにすればいいという事でしょうか？
例えばなのですが、
——————————–
|好きなお菓子| |
——————————–
のようにしていて、そこに入力がなかった場合、
「好きなお菓子」という項目も含めて、
trのclass{display:none;}
として、非表示にしたりですとか、別の項目では非表示以外のCSSも使いたいと考えています。
追記：
$〇〇に値を入れても入れなくても
display:none !important;
となっています。試しに
display:<?PHP if(!isset$〇〇){echo “none”;}else{echo “”;} ?>;
を
display:<?PHP if(isset$〇〇){echo “none”;}else{echo “”;} ?>;
と、「!」を外しても同じく
display:none !important;
のままです。
まずは、確認画面のhtmlソースを書いてください
それと、htmlソースに対応するスタイルも、かいてください
ソースがわからないと、スタイルの事とかはなんとも言えないので、、、
ご回答ありがとうございます
入力画面
<tr class="nodisp">
<td>好きなお菓子</td>
<td><input type="text" name="man3" id="man3" size="60" value="" placeholder="全角でご入力ください" /></td>
</tr>
確認画面
<tr class="nodisp">
<td>好きなお菓子</td>
<td>aaa<input type="hidden" name="man3" value="aaa" /></td>
</tr>
です。
追加で読み込ませている、css.phpは
<?php
header('Content-Type: text/css; charset=utf-8');
?>
@charset "UTF-8";
.mw_wp_form_confirm .nodisp {
display:<?PHP if($_SESSION['man3']==""){echo "none !important";}else{echo "";}?>;
}
です。
$_SESSION[‘man3’]をechoで表示させて値を確認しているのですが、そこは正常に入力値によって変化しています。
よろしくお願い致します。
プラグインを使っていないので、もっといい方法があるとは思いますが、
CSSと、若干のプラグインのコード修正で、可能と言えば、可能でした。
class.text.php
チョットだけ変更
/**
* confirm_page
* 確認ページでのフォーム項目を返す
* @return string HTML
*/
protected function confirm_page() {
$value = $this->Data->get_raw( $this->atts['name'] );
$_ret = '<p class="preview">'.esc_html( $value ).'</p>';
$_ret .= $this->Form->hidden( $this->atts['name'], $value );
return $_ret;
}
$_ret = '<p class="preview">'.esc_html( $value ).'</p>'; P要素追加
[mwform_text name="like" id="like" class="love"]
[mwform_submitButton name="kakunin" class="kakunin" confirm_value="確認" submit_value="送信"]
ソース 確認画面（何も入力しない場合）
<form method="post" action="" enctype="multipart/form-data">
<p></p>
<p class="preview"></p>
<input type="hidden" name="like" value=""><br>
<input type="submit" name="kakunin" value="送信" class="kakunin"><p></p>
<input type="hidden" id="token" name="token" value="****"><input type="hidden" name="_wp_http_referer" value="/wp/archives/29216"></form>
CSS
.preview:empty ~.kakunin{
display:none;
}
で、<p class="preview"></p>が空の場合、submitボタンを非表示にできました。
ご回答ありがとうございます。
せっかく沢山のコードを書いてくださったのですが、私の知識が足りないためどうしていいか分からない状態です。
すいません。
プラグインをそのまま利用して、私のcss.phpを修正して問題を解決するのは不可能でしょうか？
プラグインをそのまま利用して、私のcss.phpを修正して問題を解決するのは不可能でしょうか？
そういった意味ではありません。
単にCSSだけでコントロールできるんじゃないかという興味から書いただけです
$_SESSION['man3']をechoで表示させて値を確認しているのですが、そこは正常に入力値によって変化しています。
なら、CSSの指定が、他のCSSの指定で上書きされていないか、チェック済みですか？
例えば、以下の指定をしているとのことですが、第三引数のスタイルの依存関係が指定されていませんが、、、
詰まる所、htmlソースのヘッダーでスタイルシートが正しい順で呼び出されているかどうかは、確認済みですか？
css.phpは、動的にスタイルが変化しますが、CSSは通常キャッシュされますよね
キャッシュされていて、スタイルが変わらない事もありそうですね
wp_enqueue_style( 'cssphp',get_template_directory_uri(). '/css/css.php' );
Home
サイトは確認できますか？
せっかく沢山のコードを書いてくださったのですが、私の知識が足りないためどうしていいか分からない状態です。
ごめんなさいね 忘れてくださーい
モデレーター
まーちゅう
(@rocketmartue)
phpではなくて、jsで表示/非表示を切り替えてはどうでしょうか？
<script type="text/javascript">
window.onload = function () {
input_1 = document.forms[0].man3.value
if(input_1 == ""){
$('.mw_wp_form_preview .nodisp').css('display','none');
}
else {
$('.mw_wp_form_preview .nodisp').css('display','block');
}
}
</script>
フォームを表示させているテンプレートファイルに追記してみてください。
nobita 様
ご回答ありがとうございます。
遅くなってすいません。
①「CSSの指定が、他のCSSの指定で上書きされていないか」
については、
「!important」を付けているから最優先されると思っているのですがどうでしょう？
②「htmlソースのヘッダーでスタイルシートが正しい順で呼び出されているかどうか」
すいません、まったく意識せずに呼び出していました。
RocketMartue 様
ご回答ありがとうございます。
jsでの表示/非表示という方法があるのですね。
「フォームを表示させているテンプレートファイルに追記」
というのはどのようにすればいいのでしょうか？
モデレーター
まーちゅう
(@rocketmartue)
「フォームを表示させているテンプレートファイル」
通常は、page.phpですが、上記のコードをそのまま貼り付ければOKです。
「!important」を付けているから最優先されると思っているのですがどうでしょう？
一般的には、そうですけど、それが適用できないという事ですよね
!important がついているから、最優先とは限りません。上書きは可能です。
inline style で、!importantつけているわけではないですよね？
②「htmlソースのヘッダーでスタイルシートが正しい順で呼び出されているかどうか」
すいません、まったく意識せずに呼び出していました。
と言われても何とも言えないですが、 自分が出来ると思って行った作業がなぜできないのか、にこだわらないなら、
＠RocketMartue さんの方法を試すのが一番近道ではないかと思います。
