テーブル内に氏名フィールドと1日～31日までのドロップダウンリスト横並びに配置しています。
1日～31日まで横並びに配置すると長くなり、見栄えが悪く、操作性も悪くなります。
そこで、ドロップダウンリストで選択項目を表示するための"v"を非表示にして、フィールドをクリックすると選択項目が表示されるようにしたいと思っています。
ドロップダウンではなくスペースフィールドにして、カスタマイズすればいいのかもしれないのですが、標準機能を使って、"v"だけ非表示にできれば解決できるのではないかと思っています。
簡単なコーディング方法がありましたら、ご教授いただけないでしょうか。
よろしくお願いします。
cssファイルを作成し、
_.gaia-argoui-select-arrow {_
_ display: none; _
_}_
上記のクラスを非表示にします。
クラス指定をしていますので、アップデートの影響を受ける可能性があります。
"v"の要素のクラス名がgaia-argoui-select-arrowなので、cssで非表示にすれば要望通りかとおもいます。
ただし、kintoneのアップデートでクラス名が変わってしまったら再度表示されてしまいますので、ご注意ください。
岡崎様、Ryoji様
ありがとうございます。
やってみます。
助かります。
すみません、“display: none;”で“v”を消すことはできました。
消すことはできるのですが、cssの設定で“v”のエリアを削除してフィールドサイズを小さくすることは可能なのでしょうか。
“padding”で設定しても変わらないようなのですが。
標準のドロップダウンのstyleを変更するのは、難しいのでしょうか。
初歩的な質問ですみません。ご教授いただければと存じます。
div.control-value-gaia.value-xxxxxxx {
width: 90%
}
のように親要素の幅を指定してあげれば小さくなります。
xxxxxxxの部分はディベロッパーツールでご確認ください。
Ryoji様
ありがとうございます。
Kintoneを使い始めて、ようやく機能が分かってきました。
初歩的な質問で失礼しました。
他の方の投稿も参考にしながら、カスタマイズしていこうと思います。
今後ともよろしお願いします。