1

Web サイトにモーダル ウィンドウ ポップアップ (背景が不透明なウィンドウ) を表示して、データを表示したいと考えています。以下の画像を確認してください:

画像

http://www.smartclient.com/?skin=Enterprise#modalityと同様の実装を使用したいと思い ますが、その方法がわかりませんでした。誰でもこれを実装するのを手伝ってもらえますか? ここからダウンロードするファイルが見つかりませんでした: http://www.smartclient.com/product/download.jsp
MooTools や jQuery フレームワークのようなものではないですか? ダウンロードしたライブラリからどのファイルを含めるかわかりません。それを行うためのHTMLページコードの例を教えてください。

もう1つのことは、ソースで次のコードを見たということです:

            isc.IButton.create({
                ID: "touchButton",
                width: 120,
                title: "Touch This"
            });

            isc.Label.create({
                left: 150,
                height: 20,
                contents: "<a href='http://www.google.com' target='_blank'>Open Google</a>"
            });

            isc.IButton.create({
                title: "Show Window",
                top: 35,
                left: 75,
                click : function () {
                    touchButton.setTitle("Can't Touch This");
                    modalWindow.show();
                }
            });

            isc.Window.create({
                ID: "modalWindow",
                title: "Modal Window",
                autoSize:true,
                autoCenter: true,
                isModal: true,
                showModalMask: true,
                autoDraw: false,
                closeClick : function () { touchButton.setTitle('Touch This'); this.Super("closeClick", arguments)},
                items: [
                    isc.DynamicForm.create({
                        autoDraw: false,
                        height: 48,
                        padding:4,
                        fields: [
                                    {name: "field1", type: "select", valueMap: ["foo", "bar"]},
                                    {name: "field2", type: "date"},
                                    {type: "button", title: "Done",
                                     click: "modalWindow.hide();touchButton.setTitle('Touch This')" }
                                ]
                    })
                 ]
            });

次のコードが心配です:

            fields: [
                        {name: "field1", type: "select", valueMap: ["foo", "bar"]},
                        {name: "field2", type: "date"},
                        {type: "button", title: "Done",
                         click: "modalWindow.hide();touchButton.setTitle('Touch This')" }
                    ]

どなたかコードの種類を教えてください。MooTools や jQuery で利用できるようなものはありますか? 私はこれらのことに無関心です。助けてください。前もって感謝します。

4

4 に答える 4

3

smartclient は独自の RIA フレームワークであり、投稿したコードは独自の構文です。

以下に表示されるコード:

fields: [
    {
        name: "field1",
        type: "select",
        valueMap: ["foo", "bar"]
    },
    {
        name: "field2",
        type: "date"
    },
    {
        type: "button",
        title: "Done",
        click: "modalWindow.hide();touchButton.setTitle('Touch This')"
    }
]

配列メンバーが文字通り定義されたオブジェクトである単純なリテラル配列定義です。これは、mootools や jquery、その他のフレームワークに固有のものではなく、単なる JavaScript です。また、本質的に上記のトランスポート形式である JSON (javascript object notation) を読んでください。

mootools UI ライクなリリースに関しては:

  • モチャウイ。http://mochaui.org/demo/ - 少し待ちます。mootools 1.3 とインライン化して負荷を修正する新しい画期的なバージョンをリリースする可能性があります。
  • LSD - mootools ART 経由のミニ UI - https://github.com/Inviz/lsd#readme (多くあるうちの 1 つです。おそらく Cloudera からも何かを期待してください)
  • moolego ui - http://ui.moolego.org/ - 行き詰まっているようですが、github での最後のコミットは 11 か月前のものです。
  • mootools forge を見てください。
  • 自分で作ろう!特にhtml5を使用すると、最近は非常に簡単です
于 2011-01-28T09:55:25.323 に答える
0

モーダル ダイアログを作成する場合は、Jquery UI ダイアログを使用してフォームをダイアログに簡単に追加できます。

Jquery UI ダイアログ

于 2011-01-28T02:01:35.657 に答える
0

まず、上記の SmartClient コードを理解するには、javascript に慣れる必要があります。

コードについて: SmartClient は、json/xml データ形式をサポートするためにすべてのコンポーネントを構築しました。ここでは、xml (eXtensible Markup Language) については説明しません。

次にjson(javascript object notation)について。Json は、javascript を知っていれば習得できる非常にシンプルで標準的な形式です。クライアント/サーバーとの間で情報/パラメータを渡すため。html exで行うように。www.google.com? パラメータ=値; json は、すべてのパラメーター (キー) と値をコロン ":" 文字で区切ります。上記のコードを見ると、すべての属性 (params) と "{" と "}" の間の値が 1 つの json を表しています。中括弧「{}」がネストされている場合、ネストされた json があり、json が長い中括弧「[]」の間にある場合、json の配列を表します。

元。ユーザーなどのエンティティのテーブルがある場合、その json は [{user 1 json...}、{user 1 json...} など...] になります。

ただし、html フォームが 1 つある場合 (SmartClient では DynamicForm です)、単一の json で十分です{form json with all fields... }

もう一度コードを見てみましょう。最初の行は isc.IButton.createです。SmartClientは同型 (isc) に属しているため、isc コンポーネントは isc.COMPONENT.create ({}) を使用して作成されます。"({...})" の間に json を記述する必要があります。ここで、幅: 120は json に他なりません。

コード内のクリック、closeClick などのイベントは、HTML のマウスオーバーなどの JavaScript 匿名関数に他なりません。

isc.Window.create コードでは、json のネストと json 要素の配列があり、Window は特定の属性を持つ SmartClient 固有のコンポーネントです。

最後の例: エンティティ User: has attributes rollNo as 1 と name: "no-name" がある場合、その json は {"user": {"rollNo": "1", "name": "no-name" になります。 "}} または {"rollNo": "1", "name": "no-name"}

そのようなユーザーが 2 人いる場合、[ {"rollNo": "1", "name": "no-name-1"}, {"rollNo": "2", "name": "no-name-2"} "} ]

不透明度に関する質問への答えは次のとおりです。ウィンドウ コンポーネントで以下のプロパティを使用します: modalMaskOpacity: 50 このプロパティは、モーダル ウィンドウの背後に表示されるモーダル マスクの不透明度を制御し、値は 0 (透明) から 100 (不透明) まで変化します。

ありがとうシャイル

于 2011-06-09T11:04:52.263 に答える
0

mootools でダイアログを作成するには、MooDialog を使用できます

于 2011-01-28T08:15:38.503 に答える