Upgrade to Pro — share decks privately, control downloads, hide ads and more …

日本の入力をしっかりサポートするInputManJS講座/inputmanjs-supports-japanese-input

Dcbf2269af2483cabf43128ad1718c11?s=47 グレープシティ 開発支援ツール
September 14, 2021
Programming
0
94

 日本の入力をしっかりサポートするInputManJS講座/inputmanjs-supports-japanese-input

グレープシティのオンラインセミナー「日本の入力をしっかりサポートするInputManJS講座」のセッション資料です。

Dcbf2269af2483cabf43128ad1718c11?s=128

グレープシティ 開発支援ツール

September 14, 2021
Tweet

More Decks by グレープシティ 開発支援ツール

See All by グレープシティ 開発支援ツール
あなたの会社の古いシステム、なんとかしませんか？～システム刷新から考えるDX化への道筋とバリエーション～/webinar20220420-systems
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
150
あなたの会社の古いシステム、なんとかしませんか？～システム刷新から考えるDX化への道筋とバリエーション～/webinar20220420-grapecity
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
160
不安なあなたにおくるエンジニアのキャリア形成ガイド/Developers Boost 2021
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
52
はじめてのActiveReportsJS（帳票デザインの基本編）/activereportsjs-design
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
78
ActiveReports最新バージョン「14.0J」移行のポイントを解説/activereports-migration
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
150
よくわかるグレープシティのJavaScriptラインナップ/grapecity-javascript-lineup
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
75
帳票作成をもっと簡単に！用途で選ぶグレープシティの帳票開発ツール/grapecity-reporting-tools
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
51
スクラッチ開発を全方向でサポートするグレープシティ開発支援ツール/scratch-developertools
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
22
SPREAD活用テクニック（データ入力・バインド・インポート編）/spread-technique
Dcbf2269af2483cabf43128ad1718c11?s=48 grapecity_dev
0
82

Other Decks in Programming

See All in Programming
Rector, time to refactor your code easily
27021de2df79d619a3ebf52ab6392e82?s=48 guikingone
1
110
【Scrum Fest Osaka 2022】スクラムチームに放り込まれた若手エンジニアの皆さん、どのように技術のキャッチアップをしていくかイメージはついていますか？
70be36c6f5871b4f2d238f96587ffeb3?s=48 miiiki
0
130
Deep Dive Into Google Zanzibar and its Concepts for Authorization Scenarios
A68cb0f927eafc449f4046ea3edc09a2?s=48 dschenkelman
1
150
Angular‘s Future without NgModules: Architectures with Standalone Components @enterJS
15934fa2aa7b2ce21f091e9b7cffa856?s=48 manfredsteyer
PRO
0
250
模組化的Swift架構(二) DDD速成
A3d3b179955bdea9fc05b3251f1b1f10?s=48 haifengkao
0
390
Haskellでオブジェクト指向プログラミング
97a42cc1630ebdfdaaa8d50078a9fd3d?s=48 koheisakata
0
140
Managing Error Messages with your Oracle Database REST APIs
0ed10d1154c696886ca483fe827cb299?s=48 thatjeffsmith
0
160
GoogleI/O2022 LT報告会資料
2bd3b8c3550384ab61d671b673c119bb?s=48 shinsukefujita1126
0
420
大規模プロダクトにLinterを導入し運用している話
68b11f940176220aa84f755abb0bea10?s=48 hirokiotsuka
0
240
Vite でお手軽 Vue.js の環境構築
Be33a704f251c77162896ac5ba03e9ac?s=48 azuki
2
190
BASE BANKチームの技術選定と歴史 / how to decide technology selection for startup
Eb6be531bcfaa99714d8d3b48665a5a9?s=48 budougumi0617
0
1.6k
パターンマッチングを学んで新しいJavaの世界へ！Java 18までの目玉機能をおさらいしよう / Java 18 pattern matching
Fb025419ed38f98df595eb2eafc859f4?s=48 ihcomega56
3
450

Featured

See All Featured
In The Pink: A Labor of Love
E837d2996f52008ace055a08fbfff992?s=48 frogandcode
131
21k
Build The Right Thing And Hit Your Dates
016edace78ffe826f2348d1e0c504afd?s=48 maggiecrowley
19
1.2k
What's in a price? How to price your products and services
Dad095ea7038f89f760419ce475d5d14?s=48 michaelherold
229
9.4k
Design and Strategy: How to Deal with People Who Don’t "Get" Design
95d9f37115fbb0d13135d0f77132f856?s=48 morganepeng
105
16k
Docker and Python
Ecdea9b9714877b86cee08458f085481?s=48 trallard
27
1.6k
Streamline your AJAX requests with AmplifyJS and jQuery
9cde37f47e4a800ea081ea42de8d749a?s=48 dougneiner
127
8.5k
Put a Button on it: Removing Barriers to Going Fast.
Bfd6b681ec6e8c9bef82ff0521c364f7?s=48 kastner
56
2.3k
Web development in the modern age
465724d73fe3a92c0879fdfb43a3a6f3?s=48 philhawksworth
197
9.3k
Templates, Plugins, & Blocks: Oh My! Creating the theme that thinks of everything
E195ae45320d9202eaa01c9f1d31a416?s=48 marktimemedia
15
950
Easily Structure & Communicate Ideas using Wireframe
0c6fd6a08d0f898159cda7cafcacf07f?s=48 afnizarnur
181
15k
Intergalactic Javascript Robots from Outer Space
6804f1775cb4babfcc3851298566fbce?s=48 tanoku
261
25k
Building Adaptive Systems
06f8b41980eb4c577fa40c41d5030c19?s=48 keathley
25
1.1k

Transcript

  1. 日本の入力をしっかりサポートする InputManJS 講座 グレープシティ株式会社 ツール事業部 プロダクトマーケティングチーム 村上 功光 かな、カナ、全角 /

    半角、郵便番号、電話番号

  2. InputManJS （インプットマン JS ） 2 GrapeCity Developer Solutions JavaScript ライブラリ

    高性能な 入力コントロールセット 日本市場のニーズを 踏まえた便利な入力機能 種 別 概 要 特 長

  3. 本日のアジェンダ 3 GrapeCity Developer Solutions 1 2 3 日本市場の入力要件 InputManJS

    の基本機能 多彩な収録コントロール

  4. 4 GrapeCity Developer Solutions 日本市場の 入力要件

  5. 特徴的な日本の入力要件 5 GrapeCity Developer Solutions 和暦の表示 入力フォーマット 全角・半角 ふりがな 漢字・ひらがな・カタカナ

  6. 日本のニーズに対応 ! 6 GrapeCity Developer Solutions InputManJS 基本機能

  7. 日本の入力を支える基本の 5 コントロール 7 GrapeCity Developer Solutions テキスト 日付時刻 数値

    マスク 複数行テキスト ポイント 2. 国内の文化や業務スタイルを 踏まえた機能 3. 幅広い入力要件をカバーする 様々な機能 1. 様々な入力に対応する 多様な書式設定

  8. 8 GrapeCity Developer Solutions 様々な入力に対応する 多様な書式設定

  9. 書式設定機能① 文字種変換 9 GrapeCity Developer Solutions 機能 対応コントロール Demo 5つのコントロールすべて

    入力文字を自動で 所定の文字種に変換

  10. 書式設定機能② 郵便番号・数字・日付 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. 11 GrapeCity Developer Solutions 国内の文化や業務スタイルを 踏まえた機能

  12. 国内の文化や業務スタイルを踏まえた機能 12 GrapeCity Developer Solutions ふりがな 入力文字からふりがなを取得 長体 入力文字列を長体表示 フォーカス

    キー入力によるフォーカス移動 ※ こちらはテキストコントロールの機能になります

  13. 13 GrapeCity Developer Solutions 幅広い入力要件に対する 細やかな機能

  14. パスワード入力 ウォーターマーク クリアボタン 幅広い入力要件に対する細やかな機能 14 GrapeCity Developer Solutions 入力内容を不可視にして情報を保護 正しい入力を促す2種類の透かし文字機能

    素早い編集を可能にし入力のストレスを軽減

  15. 15 GrapeCity Developer Solutions • 充実のドロップダウン系コントロール • 正しいインプットを促す入力検証 • タッチにも強いパッド系コントロール

    入力をより快適に ！ 多彩な収録コントロール

  16. 充実のドロップダウン系コントロール 16 GrapeCity Developer Solutions 画像付き複数列・複数行リスト コンボコントロール

  17. 充実のドロップダウン系コントロール 17 GrapeCity Developer Solutions フィルタ条件も指定可 • 文字列で始まる • 文字列を含む

    機能 ポイント オートフィルタ機能を搭載 コンボコントロール

  18. 充実のドロップダウン系コントロール 18 GrapeCity Developer Solutions 日付時刻コントロール 数値コントロール 数値パッド 電卓 時刻ピッカー

    カレンダー

  19. 充実のドロップダウン系コントロール 19 GrapeCity Developer Solutions 日本仕様にしっかり対応 • 元号 • 六曜

    機能 ポイント カスタム可能なカレンダー （単体利用も可能） 日付時刻コントロール 2021/3/19 2021/3/19

  20. 充実のドロップダウン系コントロール 20 GrapeCity Developer Solutions 機能 ポイント ドロップダウンプラグイン お好みの機能を 独自実装

    InputManJSの機能を 活用しながら 多彩な独自機能を実装可 InputManJSコントロールに 独自ドロップダウンを追加

  21. 充実のドロップダウン系コントロール 21 GrapeCity Developer Solutions ドロップダウンプラグイン

  22. 正しいインプットを促す入力検証 22 GrapeCity Developer Solutions グラフィカルな UI 通知 入力中 /

    フォーカス移動時 もしくは任意のタイミングで検証を実施

  23. 電卓 ソフトウェアキーボード タッチにも強いパッド系コントロール 23 GrapeCity Developer Solutions

  24. まとめ 24 GrapeCity Developer Solutions 1 2 3 日本に存在する特有の入力仕様 InputManJS

    で対応するかな・カナ・全角・半角・番号・元号 入力をもっと便利にする多彩な収録コントロール

  25. セミナーの内容や製品に関するご質問・ご相談を承っています 25 GrapeCity Developer Solutions お問い合わせ グレープシティ株式会社 ツール事業部 営業部 製品に関するご相談を

    オンライン形式で承っています。 • より詳しい製品のご紹介 • 勉強会の開催 など、柔軟にご対応可能です。 セミナーの内容に関してご質問がある方は グレープシティ営業部までお気軽に お問い合わせください。 050-5490-4661 sales@grapecity.com

  26. END セミナー受講、誠にありがとうございました。