4

私は次のようなフォームを使用して、Liferay でポートレットを作成しています。

<form method="post" action="<%=actionAddRule.toString() %>" id="myForm" >
    <aui:select  name="attribute" style="float: left;">
        <c:forEach var="attr" items="${fields}">
            <aui:option value="${attr}" selected="${condition.attribute==attr}">${attr}</aui:option>
        </c:forEach>                                
    </aui:select>
    <aui:input type='button' value="Add Condition"  name='addCondition' onClick="addCondition();" %>'></aui:input>
    <div id='conditions'></div>
</form>

誰かがボタンをクリックしたときに新しい選択を追加したいのですが、新しい選択を行う方法がわかりません。私はJavaScriptでそれをやろうとしました:

var conditions = document.getElementById('conditions');
conditions.innerHTML('<aui:select ...>...</aui:select>');

と

document.createElement('<aui:select>');

私もAUIスクリプトで試してみました:

var nodeObject = A.one('#divAtr');
nodeObject.html('<aui:input type="text" name="segment21" label="Segment" value="lalal" />');

しかし、それはhtmlであり、AUIを作成できないため機能しません.HTMLノーマルで新しい選択を行うと、値をキャッチするといくつかが失われます.

ありがとう。

4

2 に答える 2

2

@Baxtheman が述べたように、タグはクライアント側の HTML タグではなく、aui-taglib のサーバー側のタグであるため、これは機能しません。

選択ボックスのコンテンツを動的にロードするには、次の手順に従います。

  1. JSPに要素を追加しますが、非表示にします

    <aui:select id="conditions" style="display: none;"><aui:select>

  2. JavaScript から、2 番目の選択ボックスをロードするために使用するイベントが発生したときに、ドロップダウン ボックスを選択し、この投稿からの回答のようなオプションを追加して、JavaScript で選択するオプションを追加します。

  3. オプションを読み込んだ後、必ず選択ボックスが表示されるように設定してください。

    document.getElementById('<portlet:namespace/>conditions').style.display = 'block';

より明確にするために、通常の HTML 選択ボックスを追加した場合に POST で情報が欠落する理由は、aui:form がデータをシリアル化する方法のためです。aui 要素のみを収集するカスタム onSubmit で終わると思います。

于 2013-10-02T16:09:50.273 に答える