Ignite UI for jQuery™ の 15.2 リリースから、新しいエディター コントロールのセットが導入されました。これには、作り直された igDateEditor
も含まれています。簡便性と優れたユーザー エクスペリエンスを中心とした新しい設計では、いくつかのすぐに使える機能や新しいAPIが追加され、APIも修正または削除されています。このトピックでは、開発者が現在のアプリケーションから新しいエディターに移行する際に役立つ、新旧の機能の違いを説明します。
このトピックは、古い日付エディターから新しい日付エディターへの移行のサポートを目的としています。さまざまなシナリオを使用した実行方法を通して新旧を比較します。
このトピックは、以下のセクションで構成されます。
オプション | 旧 | 新 |
---|---|---|
animationHideDuration animationShowDuration | ドロップダウン リストの表示 / 非表示時のアニメーション時間の設定に使用されます。 | igDateEditor はドロップダウンをサポートしないため、このオプションはコントロールでもサポートされていません。 |
button | このオプションは、スピン ボタンとドロップダウン ボタンの表示 / 非表示の設定に使用されます。$(".selector").igDateEditor({ button : "dropdown" }); |
このオプションは、機能を明確に表すために、buttonType という名前に変更されました。日付エディターのサポートされる型は 'spin' および 'clear' です。$(".selector").igDateEditor({ buttonType : "spin" }); |
dataMode | 'string' 型と 'number' 型のメンバーがサポートされていました。$(".selector").igDateEditor({ dataMode: 0 }); |
'number' 型のメンバーのサポートが廃止されました。$(".selector").igDateEditor({ dataMode: "editModeText" }); |
display | 外部の HTML 要素の style.display を取得または設定します。 | このオプションは削除されました。 |
dropDownOnReadOnly | このオプションは、「readOnly」オプションのオーバーライドを可能にし、ドロップダウン リストの表示やリストによるエディター内の値の変更ができます。 | このオプションは、日付エディターでは使用できなくなりました。 |
dropDownTriggers | ドロップダウン リストまたはカレンダーの表示をトリガーするアクションのリストを設定または取得します。 | このオプションは、日付エディターでは使用できなくなりました。 |
focusOnSpin | このオプションが無効で、エディターがフォーカスされていない場合、スピン ボタンをマウスでリックすると、エディター内のテキストがフォーカスされていない形式で維持され、スピン アクションが実行されました。 | このオプションは削除されました。新しいエディターでは、エディターがフォーカスされていない状態でスピン ボタンをマウスでクリックしても、エディターがフォーカスされません。 |
height、width | 以前にサポートされていた型: number 。$(".selector").igDateEditor({ width : 200 }); |
現在サポートされている型: number 、string 、null 。string 型を使用した場合、高さをピクセル (px) と パーセンテージ (%) で設定できます。$(".selector").igDateEditor({ width : "200px" }); |
hideEnterKey | ブラウザーで Enter キーを非表示にする機能を設定または取得できます。$(".selector").igDateEditor({ hideEnterKey : false }); |
このオプションは削除されました。Enter キーを押しても送信されないようにするには、preventSubmitOnEnter オプションを使用できます。$(".selector").igDateEditor({ preventSubmitOnEnter : true }); |
hideMaskOnFocus | フォーカス状態のマスクを非表示にする機能を設定します。 | このオプションは削除されました。 |
listAutoComplete | オートコンプリートを設定または取得します。 | このオプションは削除されました。 |
listColumns | ドロップダウン リストの列の数値を設定または取得します。 | このオプションは削除されました。 |
listDropDownAsChild | 値 true は、HTML 要素のリストにメインの HTML 要素の子として作成します。値 false は、リストに本文の子として作成します。 |
このオプションは、日付エディターでは使用できなくなりました。 |
listMatchContains | リスト一致に含まれる項目を設定または取得します。 | このオプションは削除されました。 |
listMatchIgnoreCase | 大文字と小文字の区別の検証を設定または取得します。 | このオプションは削除されました。 |
listMaxHeight | ドロップダウン リストの最大の高さをピクセル単位で設定する場合に使用されます。 | このオプションは、日付エディターでは使用できなくなりました。 |
listWidth | ドロップダウン リストのカスタム幅をピクセル単位で設定または取得します。値が 0 または負である場合、エディターの幅が使用されます。 | このオプションは削除されました。 |
nullable | このオプションは、null 値を取らないようにする機能の設定に使用されていました。$(".selector").igDateEditor({ nullable : false }); |
このオプションは、機能を明確に表すために、allowNullValue という名前に変更されました。$(".selector").igDateEditor({ allowNullValue: true }); |
nullText | エディターにフォーカスがなく、エディターの「value」が null または空の文字列の場合に、エディターに表示されるテキストの設定に使用されます。$(".selector").igDateEditor({ nullText : "Enter Value" }); |
このオプションは、機能を明確に表すために、placeHolder という名前に変更されました。$(".selector").igDateEditor({ placeHolder : "Enter Value" }); |
renderInContainer | 入力フィールドを SPAN にラップするオプションを設定または取得します。 | このオプションは削除されました。 |
required | エディター内の空の値の検証を設定または取得します。$(".selector").igDateEditor({ required : true }); |
このオプションは削除されました。必要に応じて、バリデーター オプションを使用して、フィールドを設定できます。$(".selector").igDateEditor({ validatorOptions : { required: true } }); |
selectionOnFocus | 以前サポートされていたメンバー: select 、-1 、start 、0 、end 、1 、default 、2 。$(".selector").igDateEditor({ selectionOnFocus: 0 }); |
現在サポートされているメンバー: selectAll 、atStart 、atEnd 、browserDefault 。デフォルト値は selectAll です。$(".selector").igDateEditor({ selectionOnFocus: "atStart" }); |
spin1Field | スピン イベントの日付フィールドを 1 つのみ編集できる機能を設定または取得します。$(".selector").igDateEditor({ spin1Field : true }); |
このオプションは、名前が limitSpinToCurrentField に変更されました。$(".selector").igDateEditor({ limitSpinToCurrentField : true }); |
spinOnReadOnly | 「readOnly」オプションのオーバーライドや、エディターまたはスピン イベントの「value」の変更を許可する場合に使用されます。$(".selector").igDateEditor({ spinOnReadOnly : true }); |
このオプションは削除されました。readOnly を true に設定すると、スピン ボタンが無効になります。$(".selector").igDateEditor({ readOnly : true `}); |
textAlign | 以前のデフォルトは null でした。 |
現在のデフォルトは left です。 |
theme | エディターが使用する CSS クラスのセレクターを設定または取得します。 | このオプションは削除されました。 |
type | エディターのタイプを設定します。 | このオプションは削除されました。対応するコントロールを使用できます。 |
メソッド | 旧 | 新 |
---|---|---|
addListItem | インデックスによって示された位置の項目内にオブジェクトを追加します。 | このメソッドは削除されました。 |
addListItems | インデックスによって示された位置にある配列の項目内にオブジェクトを追加します。 | このメソッドは削除されました。 |
clearListItems | リストからすべての項目を削除します。 | このメソッドは削除されました。 |
dropDownElement | ドロップダウンのコンテナーとして使用されている jquery オブジェクトへの参照を取得します。 | このメソッドは削除されました。 |
dropDownVisible | 渡されたブール値に従って、ドロップダウン リストの表示を設定します。 | このメソッドは削除されました。 |
findListItemIndex | 検索パラメーターと一致するテキストで、リスト項目のインデックスを検索します。 | このメソッドは削除されました。 |
getRegionalOption | 数値エディターと日付エディターで使用されている地域オプションの計算された値を取得します。 | このメソッドは廃止されました。 |
getSelection | 選択肢の左端または右端を取得します。 | このメソッドは、getSelectionStart と getSelectionEnd という 2 つのメソッドに置き換えられました。 |
getValueByMode | dataMode によってエディター内の値を取得します。 | このメソッドはサポートされていません。 |
hasInvalidMessage | 表示された無効なメッセージの確認に使用されます。 | igEditorNotifier には`同様に機能するAPIがあるため、このメソッドは削除されました。 |
mainElement | igDateEditor のトップ / 外部要素として使用されている jquery オブジェクトへの参照を取得します。 |
このメソッドは、機能を明確に表すために、editorContainter という名前に変更されました。 |
paste | カレットの位置にテキストを貼り付けます。 | このメソッドは insert に名前が変更され、txt パラメーターは文字列であるため、string に名前が変更されました。 |
remove | エディターを親要素から削除しますが、残りの機能は維持されます。 | このメソッドはサポートされていません。 |
removeListItem | リストから項目を削除します。 | このメソッドは削除されました。 |
removeListItemAt | インデックスのリストから項目を削除します。 | このメソッドは削除されました。 |
select | エディター内のテキストを選択します。有効なパラメーター: sel0 、sel1 、val |
2 つのパラメーターは間違えられる可能性があるため、sel0 は start 、sel1 は end にそれぞれ名前が変更されました。 |
setFocus | 遅延によるエディターのフォーカスを設定します。パラメーターが -1 の場合、遅延なしでフォーカスが設定されます。 | 正の値のみを遅延の値としてサポートしました。デフォルト値は 0 で、遅延なしでフォーカスを移動します。 |
spin | パラメーターに従って、エディター内の値を増分 (正の差分) または減分 (負の差分) します。 | このメソッドは、spinUp と spinDown という新しい 2 つのメソッドに置き換えられました。 |
text | 選択されたテキストをエディターから取得、またはエディターに設定します。 | これは getter メソッド displayValue に置き換えられました。パラメーターを取らず、入力に表示されたすべての文字で文字列を返します。 |
注: 新しい日付エディターの大きな変更点の 1 つは、リストとドロップダウンのサポートが廃止されたことです。ドロップダウンやリストに関連するメソッドを使用しようとすると、メソッドが使用できないことを通知するメッセージが表示されます。
イベント | 変更内容 |
---|---|
hideDropDown | このイベントのサポートは廃止されました。 |
showDropDown | このイベントのサポートは廃止されました。 |
listSelected | このイベントのサポートは廃止されました。 |
listSelecting | このイベントのサポートは廃止されました。 |
mouseleave | このイベントは、機能を明確に表すために、mouseout という名前に変更されました。 |
イベント | 説明 |
---|---|
rendering | エディターの描画が完了する前に起動されるイベントです。 |
rendered | エディターの描画が完了した後に起動されるイベントです。 |
mouseout | ドロップダウン リストを含めたエディターの任意の部分で、マウス ポインタが離れたときに起動されるイベントです。 |
Lib | 以前に必要とされたバージョン | 新しく必要なバージョン |
---|---|---|
jQuery コア | 1.4.4 | 1.9.1 |
jQuery UI | 1.7 | 1.9.0 |
オンラインで表示: GitHub