1

かなりの時間をかけて試してみました。質問を投稿することにしました。これが私がやりたいことです：

  • フォームにドロップダウンを追加および削除します。
  • 選択したドロップダウンをフォームから削除します。これは、ユーザーがすでにいくつかの選択を行っている場合、たとえば「オプション2」が選択されたドロップダウンだけを削除できるはずであることを意味します。

これまでのところ、この[質問]に対するGreggの回答に基づいています（ボタンクリックでGrailsテンプレートからテーブル行を追加する）フォームにドロップダウンを追加するフォームがあります。

しかし、私はそれをうまく理解できなかったので...私が持っているフォームは、whileタグで行を追加するだけです。

フォームは次のとおりです。

<div class="container-fluid">
<div class="row-fluid">
        <div class="span3" id="resources">
            <div class="control-group box" id="control-group">
                <div class="controls" id="resource-grouper">
                    <g:render template="resource" model="[end:1]"/>
                </div>
            </div>
        </div>
    </div>
</div>

レンダリングされたテンプレート：各ドロップダウンには、フォームに自分自身を追加またはフォームから削除するためのボタンがあります。

<%int i = 1 %>
<g:while test="${i <= end}">
<%i++%>
<div class="input-prepend">
<span class="add-on">
    <button class="btn btn-mini addResource" type="button" onclick="addResource();" >
        <i class="icon-plus-sign"></i>
    </button>
</span> <span class="add-on">
    <button class="btn btn-mini" type="button">
        <i class="icon-minus-sign"></i>
    </button>
</span>
<g:select name="resources" from="${org.pmo.sari.Resource.list()}" optionKey="id" size="1" value="${projectInstance?.resources*.id}" class="span10" />
</div>
</g:while>

javascript（これまでのところ追加するためだけに）：

function addResource(){

    var end = document.getElementById('end').value;

    $.get("/SARI/project/addResource", {end: end} ,function(html) {

        $('#control-group').append(html);
    });
}

コントローラー機能

def addResource(){
    int max = params.end.toInteger()
    max = max + 1
    render(template: "resource", model: ['end': max])
}

誰かがその主題について解決策やコメントを持っているなら、それは非常に役に立ちます。

4

1 に答える 1