JavaScript– category –
-
【Rails7】JavaScript（+Stimulus）でクリップボードにコピーするボタンを実装してみた
表示されたテキストをボタンクリック一つでクリップボードにコピーしてくれる機能、あったら便利ですよね。 ということで、今どきのWebサービスでよく見かける以下のようなボタンを実装してみました。 今回の実装で用いたJSライブラリはStimulus。 Rails7... -
【Rails7】Ajax + Stimulusでメールアドレスが登録済みかどうかチェックする方法 (jQueryなしで実装)
Railsではフォーム入力時（新規ユーザー登録時）にすでに登録済みのメールアドレスがある場合、バリデーションが発動して登録できないようになっているかと思います。 しかし、しかしですよ！？ メールアドレスがすでに登録されているかどうかは、フォーム... -
【Rails7】JavaScript + Stimulusで動的なバリデーションチェックを実装してみた
以前、JavaScriptで動的なバリデーションチェックを実装する旨の記事を書きましたが、JSのコードが冗長なのと変数宣言にvarしか使えない（Turboとの相性により）という課題がありました。 https://kobacchi.com/rails-javascrip-realtime-validation-check... -
【Rails7】JavaScript + Stimulusでフォームの自動入力補完機能を実装してみた（DBからJSへの値受け渡し）
Railsで、データベースから取得した値を使ってフォームの自動入力補完機能を実装する方法についてまとめたメモ書きです。 イメージはこんな感じです↓ データベースに保存されたアドレス帳（個人情報）をviewに呼び出し、氏名のみをセレクトボックスに表示... -
【Rails】JavaScriptで動的なバリデーション（リアルタイムでチェックする機能）を実装してみた
Railsでフォームのバリデーションチェックを行う場合、送信ボタンを押した後でないとエラーがあるかどうかを判定できません。 バックエンド側でバリデーションチェックは行いつつ、フロント側でもリアルタイムにバリデーションチェックを行う機構を実装し... -
【JavaScript】簡単な数字当てゲームを作ってみた
JavaScriptのチュートリアルを通して簡単なゲームを作ってみたので、学んだことを忘れないうちにメモとして残しておこうと思います。 今回作成したゲームは「数当てゲーム」で、1から100までの数字の中からランダムに割り当てられる数字を10回以内に当てる...
1