タグ

フォームに関するyanbowのブックマーク (7)

  • Canvasの中身を、formとしてPOSTしたい

    1/** 2 * HTMLCanvasElement.toBlobの互換関数。 3 * toBlobメソッドとほぼ同等の動作を行う。 4 * 対応していない場合、コールバック関数の引数にはnullが返される。 5 * 6 * @param {Node} canvas canvas要素のDOMノード 7 * @param {function((Blob|null))} callback コールバック関数。第一引数に、生成したBlobオブジェクト、またはnullが渡される 8 * @param {string=} type 画像形式の文字列 9 * @link https://developer.mozilla.org/en-US/docs/Web/API/HTMLCanvasElement/toBlob#Polyfill 10 */ 11function canvasToBlob(canva

    Canvasの中身を、formとしてPOSTしたい
  • そこそこユーザビリティの高いフォームを作った

    そこそこユーザビリティの高いフォームを作った 入力内容の検証とか、郵便番号変換を備えた、そこそこ使いやすいフォームのテンプレートを作りました time2014/01/18 hatenabookmark- 去年末実家に帰省していた時に、jQueryの練習&業務で使うために、フォームバリデーションとか郵便番号変換とかを備えた、そこそこユーザビリティの高い入力フォームをコーディングしていたので、ここで公開しておきます。 フォームサンプル ソースお持ち帰り用 (Github) ここで"そこそこ"と言っているのは、もともと業務でユーザビリティ改善案として使うことが目的であって、ベストを目指してもサーバ制約やコスト的な観点で使えないことがあるから、そこは目指さないよという意味です。そもそも、フォームは必要悪ですし、ベストはフォームが存在しないことですね。 フロントエンド実装だけです(サーバ側スクリプト

  • こんなにあった!シニア対応を本気で進める『皇潤』の入力フォームが使いやすい理由 | マミオン有限会社-パソコン・数学研修、法人研修

    シニアがウェブサイトを利用する際の大きなハードルの一つが、各種「入力フォーム」です。 一般的にシニアの方ほど入力に時間がかかり、また不適切な入力によるエラー発生頻度も高くなることは、ユーザビリティ業界の権威であるニールセンノーマングループのレポートも統計データを用いて指摘しています。 シニアをターゲットとしたウェブサイトの多くはこうした状況を考慮して、入力フォームのシニア対応に力を入れているところが多いのですが、その中でも私個人から見て特に完成度が高いと感じているのが、健康品の『皇潤』で有名なエバーライフです。 今回、そのエバーライフの入力フォームで実装されている様々なシニア対応施策について、実装方法まで含めて詳しくご紹介していこうと思います。 1. 各フォームがそこそこ大きく見やすい 2. 必須項目表示がわかりやすい 3. ふりがなが自動的に入力される 4. 住所が自動的に入力される

  • 便利なGoogleフォーム7つとテンプレート5つ!

    起業するまでは、あたりまえに会社に存在したいろいろな申請書類。 起業後はそういう書式も全て自分で作る必要があります。 今回は、起業後にあった方がいいなって思われる社内の申請書類をGoogleフォームやスプレッドシートで作成したものを公開させていただきます。 今回の記事は、たまにGoogle検索が嫌いになりそうになりますが、基Googleが大好きな小松宣郷が担当です。 ※ 起業時じゃなくても、旅費の精算や購買申請など紙をお使いの企業さんは結構使えるかも。 あと、エントリーフォームなどは自社の求人ページに埋め込むだけで使えるので、都度都度で採用したい人材って変わると思うので、その都度編集するなどすれば便利だと思います。 使い方は、各書式のリンクからテンプレートを開いて頂き、コピーして自社用に加工してお使い頂ければと思います。 ※ スプレッドシートはロックかけてますが、フォーム送信するとスプレ

    便利なGoogleフォーム7つとテンプレート5つ!
  • レスポンシブなフォームを作成するフレームワーク「jq-idealforms」:phpspot開発日誌

    jq-idealforms レスポンシブなフォームを作成するフレームワーク「jq-idealforms」 フォームのデザインが良い感じにデザインされているだけではなく、幅を狭くすることでレイアウトが変更されるレスポンシブなフォームを簡単に実装出来ます。 ポップアップによる入力ヒントの実装も可能。とにかくデザインが良い感じなので非デザイナーさんでもカッコいいフォームが作れるという部分も特徴 スマホの場合、レイアウトが最適化されます jQueryとLESSを使って実装されています 関連エントリ フォームをカッコよくするjQueryプラグイン集15 通常のフォームを瞬時にAjax化できるjQueryプラグイン「ALAJAX」 フォーム要素をクールにするためのjQueryプラグイン集

  • フォーム入力に役立つjQueryプラグイン

    連載では、JavaScriptライブラリの中でも人気が高まりつつあるjQuery UIとプラグインを取り上げます。今回は、Input Hint Overlay、Text input field filter、jQuery Validation、Password Strength、Simplest Twitter-like dynamic character countについて説明します。 はじめに 第2回「jQuery UIのウィジェットを使ってみよう」では、jQueryのユーザーインターフェースを拡張するjQuery UIのインストールから、jQuery UIのDialog、Datepicker、AutoComplete、ProgressBarの使い方を取り上げました。第3回では、第1回「jQuery UIのインタラクションを使ってみよう」でも簡単に触れたjQuery Pluginのフ

    フォーム入力に役立つjQueryプラグイン
  • WEBフォームをWEB上でWYSIWYG編集して瞬時にダウンロードできる「pForm」:phpspot開発日誌

    pForm - Free HTML Form Builder - Create Web Form Template Online WEBフォームをWEB上でWYSIWYG編集して瞬時にダウンロードできる「pForm」。 出来上がるフォームのなかなかのカッコ良さで十分実用できると思います。 まずは多数あるサンプルカラーの中から好きな色合いを選びます。 フォームに追加したい、テキストボックスやドロップダウンなどのクリックで追加していきます。 追加したらその場でサクサク反映されます。 で「Save Form」ボタンを押します。 たったこれだけのステップで完成しました。 ダウンロードしたフォームにはCSSJavaScriptが含まれていてなかなかカッコいいものになってます。 HTML部分はサクッと終わってしまうので、あとはこれをカスタマイズして送信できるようにすればいいだけです。 残念ながら、P

  • 1