maxlength属性の仕様の違いには要注意！ | 株式会社シンメトリック公式ブログ - 携帯開発から生まれる技術情報
この結果を見ると、docomoだけがバイト数として扱っているようだ。SoftBank C型・P型の場合もバイト数として扱っていた記憶があるけど、C型とP型は3月末でサービスが終了したから該当しなくなった。 ちなみにバイト数というのは、シフトJIS換算のバイト長のこと。HTMLのキャラクタエンコーディングをUTF-8にしても、結局はシフトJISでの長さとなる。 影響範囲と対応方法 maxlength属性の仕様の違いが最も影響するのは、DBアクセスがからんできたとき。テーブル定義にもよるけど、フォームで入力したテキストをそのままDBに入れてしまうと、DBアクセスでエラーになる可能性がある。 たとえば、Oracleでフィールド定義が VARCHAR2(20) のカラムに日本語を格納する場合、データベースキャラセットがシフトJISなら全角10文字まで入る。PCサイトが前提ならmaxlength="
画像のアップロードをかっこよく実装する - (ﾟ∀ﾟ)o彡 sasata299's blog
2012年02月16日11:36 Webアプリ 画像のアップロードをかっこよく実装する 久しぶりのブログですこんにちわ！最近は主になめこを栽培しております。 なめこ図鑑46%まできたお (*´ω｀*)— ささたつ(Tatsuya Sasaki) (@sasata299) February 13, 2012 ということで、今回は画像のアップロードをかっこよくやる方法について紹介します。 画像のアップロードというか、アップロードしたいファイルの選択ですかね。Twitterだとこんな感じのカメラ画像があって、それをクリックするとファイル選択画面になるんです。 アップロードしたいファイルの選択って、ふつーに実装するとこんな感じのデザインです。かっこよくない！！ まぁこんな感じですよね。 そうじゃなくて、Twitterみたいな感じで画像をクリックするとシャキーン！とファイル選択画面が出てくる、そうい
プレースホルダとHTML5のplaceholder属性
プレースホルダとHTML5のplaceholder属性 HTML5で導入されたplaceholder属性によって、フォームの入力欄にプレースホルダを設定できるようになりました。さて、この「プレースホルダ」とはそもそもなんなのでしょうか。また、プレースホルダにはどのようなテキストを書けばよいのでしょうか。 プレースホルダってなに? フォームの入力欄に、薄い灰色のテキストが表示されているものを見かけます。あのテキストや、テキストを提供する仕組みは、プレースホルダと呼ばれています。 Safariではアドレスバーに“Go to this address”、検索バーに“Google”というプレースホルダが設定されている。 「プレースホルダ (“placeholder”)」 とは、「実際のものに代わって現れるもの」を意味します。たとえば、Webサイトのテンプレートを作る際に、実際のページにはないテキス
Styling the HTML5 placeholder | John Catterfeld's blog
One of the exciting new form enhancements in HTML5 – designed to save hundreds of hours of repeated scripting – is the introduction of the placeholder attribute for form input fields. In most websites this jiggery-pokery is still be done by Javascript, but the HTML5 browsers of the future (and the webkit browsers of today) support this with a simple form attribute, like so: <input name="demo1" ty
jQueryでcheckboxがcheckされてるかの値をとる - Webtech Walker
checkboxがcheckされてるかどうかを判別するメソッドってjQuery側に用意されてないんですよね。 twitterでも色々教えてもらったけど方法としては3つくらいかなー。 https://twitter.com/kyo_ago/status/11685019866 https://twitter.com/songmu/status/11675950113 https://twitter.com/rea/status/11675545507 素のHTMLエレメントから取得 var checked = $('#elem').get(0).checked; せっかくjQuery使ってるのにという感じがいなめない。。これはないかな。 is()で取得 var checked = $('#elem').is(':checked'); これが一番直感的ではある。これでいいっちゃいい気もする。
Symfony2初心者がバンドルを作ってみた - 覇王色を求めて
この記事はSymfony Advent Calendar 2011の21日目の記事になります。 Advent Calendarとはなんぞや？という方は下記をどうぞ。 http://gihyo.jp/news/info/2011/12/0101 まず始めに、自分はSymfonyをバージョン1系を使ったことがなく、バージョン2からの初心者です しかもSymfony2もまだ触り始めて1ヶ月ちょっとになります。 こんな若輩者の私ですので、突っ込みどころがあるかもしれませんので、もし気になるところがありましたら突っ込んでいただければ幸いです。 Symfony2を使ってみて思ったこと 以前までEthnaを使っていたのですが、以前からSymfonyがいいよ！と色々な方から言われていたので触ってみようと思ったところ既にバージョン2が出ている状態だったので、せっかくなので今更バージョン1系を覚えるのもあれか
ログイン画面の離脱率を下げる！ECサイト各社の工夫
こたつにみかんはじめました。nonakaです。 週に１度は通販で買い物してます。そんな中、ログインする画面をいろいろ見たので、ファッション通販サイトのログイン画面を集めました！ ファッション通販サイトの場合、ログイン画面に「新規会員登録」への誘導があるのがほとんどです。今回は、2つのパターンにわけてご紹介します。 「ログイン画面」エリア、「新規登録」エリアが上下にあるパターン セレクトショップ：BEYES ログイン画面、新規登録が上下にあるパターン。入力フォームが大きめで入力しやすい。新規会員登録のボタンは色を変えて目立たせてます。 無印良品 ログイン画面、新規登録が上下にあるパターン。フォームとボタンの横幅がそろっていて見やすいですね。 ユニクロ ログイン画面、新規登録が上下にあるパターン。入力フォームが大きくて見やすいです。ログインと会員登録の分けかたも見やすいですね。 子供服：goo
Html5 File Upload with Progress On Matlus
Html5 finally solves an age old problem of being able to upload files while also showing the upload progress. Today most websites use Flash Player to achieve this functionality. Some websites continue to use the Html <form> with enctype=multipart/form-data, but with modification on the server side to enable showing users the upload progress. Essentially, what you need to do is hook into the server
jQuery File Upload Demo
jQuery File Upload Demo File Upload widget with multiple file selection, drag&drop support, progress bars, validation and preview images, audio and video for jQuery. Supports cross-domain, chunked and resumable file uploads and client-side image resizing. Works with any server-side platform (PHP, Python, Ruby on Rails, Java, Node.js, Go etc.) that supports standard HTML form file uploads. Pintura
参考にすべき7つのユーザー登録ページ Zen Startup
どんなサービスもユーザー登録は必須である。筆者はユーザー登録に時間がかかるサービスは試してみたいと思わない。希望としては「Facebook、Twitter、Googleアカウント」のいずれかで、ユーザー登録を済ませたい。 日本のサービスは全体的に、ユーザー登録ページのデザインが欧米と比べて遅れている。延々と続く「必須項目」はもちろん、エラーの理由が参照できないサイトも多々ある。そんな日本の遅れたユーザー登録ページを変えるためにも、7つのすばらしいユーザー登録ページのサンプルを紹介したい。 1. Convore Comvoreはランディングページでユーザー登録ができる。しかも必要な情報はユーザーネーム、メールアドレス、パスワードのみ。つまり必須項目がたったの3つ。さらに驚くことに、メールアドレスを確認するための「認証メール」すら送られてこない。ユーザーは即座にサービスを利用できる。 このよう
HTML5のclient-side form validationで書かれたattributeからvalidation rulesを抽出し、client/serverでルールを共通化するモジュールを書いた - Kentaro Kuribayashi's blog
Validation Ruleの記述ってけっこう面倒で、うまい方法を思いつけないのでいたのですが、今日、なんとなくHTML5にclient-side form validation specなんてものがあるんだから、それを使ったらいいんじゃないかと思って、ちょっと実装してみました。 http://prepan.org/module/3Yz7PYrBGs https://github.com/kentaro/HTML-ValidationRules 以下のようなメリットがあるのではないかと思っています。 client-side form validationを使いつつ、server-sideでも同じルールを別の形式で書くのは無駄感。 HTML5が、validation rulesをHTMLというフォーマットによって定めているとみなせば、client-side/server-side両方でそれ
jQuery.upload: A simple ajax file upload plugin
See related links to what you are looking for.
ppBlog official
こんにちは、martinです。日本に帰国して1年が経ちました。昨年は２月から新しい職場で働き始めたり、9月６日に第１子が生まれたりとバタバタな一年でして、まるでppBlogの開発・サポートが出来ませんでしたが、今年はなるべく時間を作ってppBlogをいじれたらと思っています。 世界中の皆さんにとって、良い年でありますように。 久しぶりのカキコ。 静的リンクでの挙動を変えています。URLのパスに日付情報などを含ませるように。まだ、いじっている段階なので、色々と不具合があるだろうけれど、まぁ気にしないと。 日付情報がある以外には、現状、PermaLink用の英数文字からなる記事タイトルを別に指定できたのですが、これはそのまま取っておくとして、そうでない場合は、記事のタイトルがそのままブラウザのアドレスバーに表示されるような感じにしてます（静的リンクが有効な場合ですが）。今時のブラウザならエンコ
JavaScriptでtextareaにフォーカスした際にカーソルが先頭に来てしまう場合の対処 - F.Ko-Jiの「一秒後は未来」
JavaScriptを使って「要素をクリックしたらテキストエリアに文字列をセットして、そのテキストエリアにフォーカスさせる」という処理を書いたのですが、なぜか Safari と Chrome で「カーソルがテキストエリアの先頭に来てしまう」という現象が発生してしまいました。 ↑ こんな風に。 理想は「@meity_jp 」の後ろにカーソルがセットされてほしいのですが、なぜか先頭に来てしまいます。これでは入力時にわざわざ手動でカーソルを移動させないといけなくて不便です。 原因と解決法 しばらく原因がわからなかったのですが、実はすごく単純なことでした。 解決法は、「フォーカスをしてから文字列をセットする」です。jQueryで表現すると以下のように。 $('textarea').focus().val('some text'); これでカーソルは文字列の後ろにきます。これをもし、 $('text
labs.nazone.info is Expired or Suspended.
「 labs.nazone.info 」のページは、ドメインが無効な状態です。 ウェブサイト管理者の方はこちらから変更・更新を行ってください。 「 labs.nazone.info 」is Expired or Suspended. The WHOIS is here.
Image Select plugin with jQuery | images select
his plugin will be replaced by another from a plugin pack I’m developing, where I’ve applied lots of bugfixes. The link will be on here by the end of August. ImageSelect is a jQuery plugin that allows the user to select an image by means of a nice looking dropdown. You must have a <select> containing one or more <option>s. Each option must contain the URL to the image you want to display, as the o
【HTML5 フォーム】formタグのinput要素に新たに追加された13のtype属性をまとめました！ | HTML5でサイトをつくろう
【HTML5 フォーム】formタグのinput要素に新たに追加された13のtype属性をまとめました！ ウェブ・ページのフォームではテキスト入力フィールドやチェックボックスなどのユーザーインターフェースを使用しますが、HTML5ではユーザーインターフェースがさらに追加されたことで注目されています。 特にinput要素ではさまざまなtype属性が追加されました。今回は新たに追加されたtype属性をソースをみながら表示を確認していきたいと思います。 HTML5でinput要素に追加されたtype属性 下記に各属性ごとの特徴をピックアップし、現状で対応しているブラウザの画面キャプチャを掲載しました。だだし、現状(※2011年9月)の対応状況になります。 search 『type=”search”』の主な特徴 1行テキストの入力フィールドで表示され検索向けであることを表します。 input要素の
Cross-Browser Support for HTML5 Placeholder Text in Forms - CSS Reset
<input type="text" placeholder="Start typing to begin searching." /> The only new bit is the placeholder attribute, but it results in this: I love placeholder text because it can help make large, complex forms easier to navigate. What better place to explain the requirements of an input field than right inside the field itself? And on short forms (like a search bar), placeholder text could be used
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Google Code Archive - Long-term storage for Google Code Project Hosting.
IDEA * IDEA
