Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Speaker Deck
PRO
Sign in
Sign up for free
日本の入力をしっかりサポートするInputManJS講座/inputmanjs-supports-japanese-input
グレープシティ 開発支援ツール
September 14, 2021
Programming
0
94
日本の入力をしっかりサポートするInputManJS講座/inputmanjs-supports-japanese-input
グレープシティのオンラインセミナー「日本の入力をしっかりサポートするInputManJS講座」のセッション資料です。
グレープシティ 開発支援ツール
September 14, 2021
Tweet
Share
More Decks by グレープシティ 開発支援ツール
See All by グレープシティ 開発支援ツール
あなたの会社の古いシステム、なんとかしませんか?~システム刷新から考えるDX化への道筋とバリエーション~/webinar20220420-systems
grapecity_dev
0
150
あなたの会社の古いシステム、なんとかしませんか?~システム刷新から考えるDX化への道筋とバリエーション~/webinar20220420-grapecity
grapecity_dev
0
160
不安なあなたにおくるエンジニアのキャリア形成ガイド/Developers Boost 2021
grapecity_dev
0
52
はじめてのActiveReportsJS(帳票デザインの基本編)/activereportsjs-design
grapecity_dev
0
78
ActiveReports最新バージョン「14.0J」移行のポイントを解説/activereports-migration
grapecity_dev
0
150
よくわかるグレープシティのJavaScriptラインナップ/grapecity-javascript-lineup
grapecity_dev
0
75
帳票作成をもっと簡単に!用途で選ぶグレープシティの帳票開発ツール/grapecity-reporting-tools
grapecity_dev
0
51
スクラッチ開発を全方向でサポートするグレープシティ開発支援ツール/scratch-developertools
grapecity_dev
0
22
SPREAD活用テクニック(データ入力・バインド・インポート編)/spread-technique
grapecity_dev
0
82
Other Decks in Programming
See All in Programming
Rector, time to refactor your code easily
guikingone
1
110
【Scrum Fest Osaka 2022】スクラムチームに放り込まれた若手エンジニアの皆さん、どのように技術のキャッチアップをしていくかイメージはついていますか?
miiiki
0
130
Deep Dive Into Google Zanzibar and its Concepts for Authorization Scenarios
dschenkelman
1
150
Angular‘s Future without NgModules: Architectures with Standalone Components @enterJS
manfredsteyer
PRO
0
250
模組化的Swift架構(二) DDD速成
haifengkao
0
390
Haskellでオブジェクト指向プログラミング
koheisakata
0
140
Managing Error Messages with your Oracle Database REST APIs
thatjeffsmith
0
160
GoogleI/O2022 LT報告会資料
shinsukefujita1126
0
420
大規模プロダクトにLinterを導入し運用している話
hirokiotsuka
0
240
Vite でお手軽 Vue.js の環境構築
azuki
2
190
BASE BANKチームの技術選定と歴史 / how to decide technology selection for startup
budougumi0617
0
1.6k
パターンマッチングを学んで新しいJavaの世界へ!Java 18までの目玉機能をおさらいしよう / Java 18 pattern matching
ihcomega56
3
450
Featured
See All Featured
In The Pink: A Labor of Love
frogandcode
131
21k
Build The Right Thing And Hit Your Dates
maggiecrowley
19
1.2k
What's in a price? How to price your products and services
michaelherold
229
9.4k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
morganepeng
105
16k
Docker and Python
trallard
27
1.6k
Streamline your AJAX requests with AmplifyJS and jQuery
dougneiner
127
8.5k
Put a Button on it: Removing Barriers to Going Fast.
kastner
56
2.3k
Web development in the modern age
philhawksworth
197
9.3k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
marktimemedia
15
950
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
181
15k
Intergalactic Javascript Robots from Outer Space
tanoku
261
25k
Building Adaptive Systems
keathley
25
1.1k
Transcript
日本の入力をしっかりサポートする InputManJS 講座 グレープシティ株式会社 ツール事業部 プロダクトマーケティングチーム 村上 功光 かな、カナ、全角 /
半角、郵便番号、電話番号
InputManJS (インプットマン JS ) 2 GrapeCity Developer Solutions JavaScript ライブラリ
高性能な 入力コントロールセット 日本市場のニーズを 踏まえた便利な入力機能 種 別 概 要 特 長
本日のアジェンダ 3 GrapeCity Developer Solutions 1 2 3 日本市場の入力要件 InputManJS
の基本機能 多彩な収録コントロール
4 GrapeCity Developer Solutions 日本市場の 入力要件
特徴的な日本の入力要件 5 GrapeCity Developer Solutions 和暦の表示 入力フォーマット 全角・半角 ふりがな 漢字・ひらがな・カタカナ
日本のニーズに対応 ! 6 GrapeCity Developer Solutions InputManJS 基本機能
日本の入力を支える基本の 5 コントロール 7 GrapeCity Developer Solutions テキスト 日付時刻 数値
マスク 複数行テキスト ポイント 2. 国内の文化や業務スタイルを 踏まえた機能 3. 幅広い入力要件をカバーする 様々な機能 1. 様々な入力に対応する 多様な書式設定
8 GrapeCity Developer Solutions 様々な入力に対応する 多様な書式設定
書式設定機能① 文字種変換 9 GrapeCity Developer Solutions 機能 対応コントロール Demo 5つのコントロールすべて
入力文字を自動で 所定の文字種に変換
書式設定機能② 郵便番号・数字・日付 10 GrapeCity Developer Solutions マスク 数値 日付時刻 正規表現による書式設定
入力と表示、2つの書式を制御 日時表示に特化した書式設定 ggg E年M月d日 / yyyy/MM/dd tt h時m分s秒 / HH:mm:ss 〒¥¥D{3}-¥¥D{4} [DBNum1]G / ##,##0 Prefix Surfix
11 GrapeCity Developer Solutions 国内の文化や業務スタイルを 踏まえた機能
国内の文化や業務スタイルを踏まえた機能 12 GrapeCity Developer Solutions ふりがな 入力文字からふりがなを取得 長体 入力文字列を長体表示 フォーカス
キー入力によるフォーカス移動 ※ こちらはテキストコントロールの機能になります
13 GrapeCity Developer Solutions 幅広い入力要件に対する 細やかな機能
パスワード入力 ウォーターマーク クリアボタン 幅広い入力要件に対する細やかな機能 14 GrapeCity Developer Solutions 入力内容を不可視にして情報を保護 正しい入力を促す2種類の透かし文字機能
素早い編集を可能にし入力のストレスを軽減
15 GrapeCity Developer Solutions • 充実のドロップダウン系コントロール • 正しいインプットを促す入力検証 • タッチにも強いパッド系コントロール
入力をより快適に ! 多彩な収録コントロール
充実のドロップダウン系コントロール 16 GrapeCity Developer Solutions 画像付き複数列・複数行リスト コンボコントロール
充実のドロップダウン系コントロール 17 GrapeCity Developer Solutions フィルタ条件も指定可 • 文字列で始まる • 文字列を含む
機能 ポイント オートフィルタ機能を搭載 コンボコントロール
充実のドロップダウン系コントロール 18 GrapeCity Developer Solutions 日付時刻コントロール 数値コントロール 数値パッド 電卓 時刻ピッカー
カレンダー
充実のドロップダウン系コントロール 19 GrapeCity Developer Solutions 日本仕様にしっかり対応 • 元号 • 六曜
機能 ポイント カスタム可能なカレンダー (単体利用も可能) 日付時刻コントロール 2021/3/19 2021/3/19
充実のドロップダウン系コントロール 20 GrapeCity Developer Solutions 機能 ポイント ドロップダウンプラグイン お好みの機能を 独自実装
InputManJSの機能を 活用しながら 多彩な独自機能を実装可 InputManJSコントロールに 独自ドロップダウンを追加
充実のドロップダウン系コントロール 21 GrapeCity Developer Solutions ドロップダウンプラグイン
正しいインプットを促す入力検証 22 GrapeCity Developer Solutions グラフィカルな UI 通知 入力中 /
フォーカス移動時 もしくは任意のタイミングで検証を実施
電卓 ソフトウェアキーボード タッチにも強いパッド系コントロール 23 GrapeCity Developer Solutions
まとめ 24 GrapeCity Developer Solutions 1 2 3 日本に存在する特有の入力仕様 InputManJS
で対応するかな・カナ・全角・半角・番号・元号 入力をもっと便利にする多彩な収録コントロール
セミナーの内容や製品に関するご質問・ご相談を承っています 25 GrapeCity Developer Solutions お問い合わせ グレープシティ株式会社 ツール事業部 営業部 製品に関するご相談を
オンライン形式で承っています。 • より詳しい製品のご紹介 • 勉強会の開催 など、柔軟にご対応可能です。 セミナーの内容に関してご質問がある方は グレープシティ営業部までお気軽に お問い合わせください。 050-5490-4661 sales@grapecity.com
END セミナー受講、誠にありがとうございました。