IE_extjs で ComboBox と DateField が消える問題の解決策

はじめに

Ext JS の基本的な Form コンポーネントとして、これら 2 つは何も難しいことではありません。
しかし、開発プロセス中に、IE ブラウザーでウィンドウ サイズを拡大または縮小すると、これら 2 つのコンポーネントが消えてしまうことがわかりました。 特定の場所をクリックすると、再度表示されます。 エラーは報告されません。 他のブラウザでは正常に動作します。

問題が発生した状況

オリジナルプロジェクトをベースにExt jsをインポートしているため、ページ内のフォームが標準のフォームコンポーネントでは作成されません最初に追加し、フォームフィールドメソッドが使用されます。
ここで使用するのは純粋な HTML フォームと入力であり、Ext js を使用して入力を Combobox と DateField にレンダリングします。

コンボボックス生成のメカニズムについて説明します。

1. ID で元の入力を検索します。
2. この入力の親を検索します (元の入力は削除できます)
3. 新しい Ext js Combobox コンポーネントを作成し、その親にレンダリングします。元の入力。 (id は元の入力 ID に設定されます)
Date フィールドにも同様のメカニズムがあります。


ソリューションの探索
ウィンドウの変更後のコンポーネントの変更を表示するには、IE Developer を使用します。
コンポーネントがまだ存在していることがわかりました。

Comobox を形成するための Ext js の主な手順は次のとおりです。

テーブルを div に配置し、tr をテーブルに配置し、tr に 2 つの TDS を配置します。2 番目の TD がメインです。表示コンポーネント。 一般的な内容を見てみましょう:

最初はオリジナルかと思いました。 入力がデストリーされ、レンダリングできなくなります。これを Hide() または setDisabled または setVisable に変更しても機能しません。

上記の td はまだページ上に存在しますが、位置が変更され、テーブルの下になくなりました。

Cssが原因のようです。 IE Developerでx-form-item-bodyを削除するとIEでは正常に動作するようになりました。

Ext js の x-form-item-body の定義を見てください

非常に単純で、たった 1 行です。この相対的な位置関係が原因であると考えられます。

Ext js 自体の CSS は使用しないでください。