昔のカーラジオの選局ボタンを模したデザインのGUIのひとつで、『ひとつをオンにするとほかのボタンがオフとなる』ようなボタンのこと。←→「チェックボックス」 見た目は、ボタンではなく、ポチマークのよう。 一例で言えば、このキーワードのスコアのところの『リンク不要/リンク可』の左についているものが、ラジオボタンそのものである。
1 はじめに 私がグーグルフォームを使ってみようと思ったきっかけ、それが秋田県学習状況調査質問紙集計の依頼です。正確に言うと、「質問紙と同じ内容のアンケートを年何回か取り、比較したいので協力してほしい」と頼まれたのがきっかけです。 すぐ思ったのは、「エクセルファイルにひたすら数値を打ち込む過酷な作業だけは絶対に避けたい」ということでした。1学級につき1時間くらいはかかるので、全校分を頼まれたら…。 幸いにして、グーグルフォームを知り、その結果をエクセルで処理するマクロを組んだおかげで、アンケート結果を即時処理できるようになりました。(アンケート終了後、5分程度で処理が終わります。) しかしなが…
ラジオボタンの設定をjqueryのスクリプトで行うときにハマるという話です。 問題の前提 ラジオボタンは通常複数の同一name属性をもつ要素が集まってできています。 <input type="radio" name="post_radio" value="val1" checked>要素1 <input type="radio" name="post_radio" value="val2">要素2 <input type="radio" name="post_radio" value="val3">要素3 こんな感じです。 ここで、要素3にチェックを入れるという設定をjqueryでやりたいとい…
htmlにて選択ボタンを作成する場合には、チェックボックスやラジオボタンがありますが、今回はラジオボタンの作成方法の説明になります。 チェックボックスは通常複数選択可能な場合に使用しますが、ラジオボタンはどれか1つを選択したいような時に使用します。 (adsbygoogle = window.adsbygoogle || []).push({}); 目次 1.基本パターン 2.文字列クリックでも反応させる方法 3.初期選択しておく方法 4.どれか1つを必ず選択させる方法 1.基本パターン ラジオボタンの作成例としては以下のようになります。 <input type="radio" name="c…
どうも!LSSです!! かなり前に、 little-strange.hatenablog.com という記事を出し、その後も何度かそれに似たものを出していました。 これはチェックボックスを使用した、単一のメニューの開閉を実現するものでしたが、今回はラジオボタンを使用して「複数のうちからひとつを開く」開閉メニューを作ってみました。 ラジオボタンによる開閉サンプル コード 使い方 あとがき ラジオボタンによる開閉サンプル .rdd input{display:none;} .rdd label,.rdds{display:block;} .rdds{ width:300px;height:35px…
どうも!LSSです!! JavaScriptを使わず、CSSだけで動作するフォトギャラリーを作ってみました。 CSSで作るフォトギャラリー コード 使い方 あとがき CSSで作るフォトギャラリー .cglry{ display:grid; /*gridレイアウト*/ grid-template:repeat(8,1fr)/1fr 6fr 1fr; /*縦8行に分割/横1:6:1の比で3列に分割*/ gap:5px; /*各グリッドの間に5pxの隙間*/ } .cglry input{display:none;} /*ラジオボタン非表示*/ .cglry label{grid-column:1/…
今回は、HTMLのフォームタグを復習したので見返して使えるように簡単な備忘録として残します。 色々なフォーム部品がある。 フォームタグ 1行テキストのフォーム <input type="text"> <input type="text", value="hello"> # value属性で初期値を入れておける。画像の左から2番目 パスワードのフォーム <input type="password"> # 画像の左から3番目 複数行テキストのフォーム <textarea name="テスト">ああああ※初期値はここに入力する</textarea> # 画像の一番右 入力例を入れておきたい場合 記入…
Button COMPは、Button Typeを「Radio Up」にして、同じラベルを付けるとラジオボタンになります。 ただマウスでボタンを押すのはめんどくさいので、キーボード入力のラジオボタンを作ってみました。 ※もっと良い実装を知ってる方、よろしければ教えてください🙇♂️ まずは、必要なオペレーターを配置します。今回は1~4のキー入力を使ったラジオボタンを作るので、Keyboard In CHOPを4つ配置して、それぞれCount CHOPとMath CHOPを繋げます。 そしたら、keyboardin1のkeysを1に、keyboardin2のkeysを2という感じにkeyboar…
CakePHPのラジオボタンですが、ヘルパーで設置すると縦並びになって、個人的に非常に嫌でした。そこでこのラジオボタンを横並びにする方法を説明していきます。結論から言うと、自分でCSSを書くのが一番手っ取り早いです。自分でdisplay: flex;などして、上書きしてしまう方法です。もともとのコードをいじるとなると、かなり細かい作業になってしまうので、オススメしません。 元々のかんじ 書き換えたビューテンプレート CSSを読み込む CSSを書く 終わりに 【自分の環境】macOS Catalina PHP7.4.2 CakePHP3.8 MAMP5.7 Apache2.2 MySQL5.7 …
今回は、GUI部品(ラベル、テキストボックス、チェックボックス、ラジオボタン)を表示してみます。 Python(tkinter)は少し自分の知っているものとしくみが異なるようで、ラベルなどを生成する関数にウィンドウ(フレーム)を渡すことで、その渡したウィンドウ(フレーム)に表示されます。 自分が知っている言語では、ラベルなどのオブジェクトを作成、ウィンドウ(ラベル)に追加する流れで部品が表示されました。 そんなライブラリですので、少し関数を組んで部品を追加表示するようにしてみました。 # -*- coding: utf-8 -*- # 日本語コメントをエラーとしないように、UTF-8で保存 #…
どうも!LSSです!! だいぶ前の記事になりますが というのを書いていました。 HTMLのフォームパーツであるチェックボックスを非表示で用意し、「チェックボックスの状態からCSSで分岐できる」というのを利用したものですね。 実際のところ、CSSでユーザー操作によるオン/オフ切り替えは、この「チェックが入ってるか否か」ぐらいしか方法がないようです。 ですが、「HTMLのフォームパーツ」で「チェック状態にできる」ものとしては、チェックボックスの他に「ラジオボタン」があります。 ラジオボタンってのは、 こんな風に、「いくつかの選択肢から一つを選んで、ひとつだけ有効になる」というパーツですね。 今回は…