0

私はJQueryとtapestryを初めて使用します。つまり、InPlaceEditorに新しい行を追加してから、次のコマンドを使用して編集可能にします。

$(document).ready(function () {
    $("#addnewrow").click(function () {

        var prompt = "Please enter new data";
        var oTable = $("#datatable").dataTable();
        var a = oTable.fnAddData([prompt , "Yes" ]);
        var erow = oTable.fnSettings().aoData[ a[0] ].nTr
        oTable.fnUpdate( erow.getElementsByTagName("td")[0].innerText, erow, 0, false );
        oTable.fnUpdate( erow.getElementsByTagName("td")[1].innerText, erow, 1, false );
        oTable.fnDraw();

         return false;
    });
});

しかし、追加したばかりの新しい行は編集できません！

インターネットを読んで、問題の解決策を見つけました：（http://bit.ly/KNf92c）

  1. jEditableイベントコントローラーを新しい行に追加します
  2. jQueryのlive（）オプション（http://docs.jquery.com/Events/live）を使用して、編集可能なイベントを行に割り当てます
  3. 行を追加した後、jeditableを再初期化します。

どうすればこれをタペストリーの方法で行うことができますか？

4

1 に答える 1

0

さて、さらに調査したところ、私はかなり外れていたことがわかりました。わかりづらくて申し訳ありません。インターネット上の多くの場所で具体的な解決策がない同じ問題を見ているので、私は本当に自分の解決策を投稿したいと思っています。

以下により、データテーブルに新しい行を追加し、JEditable で編集可能にし、Tapestry-JQuery InPlaceEditor を介して新しく追加されたデータの処理をタペストリー ページ クラスに処理させることができます (これはタペストリー専用ではないことがわかります)。

また、foo.java というページ クラスがあり、そのページ クラスに "bar" という関数がある場合、リンクを介してこれを参照するタペストリーの方法は "./foo:bar" です。

乾杯

clientprequalificationlist.js で:

$(document).ready(function () {
$("#addnewrow").click(function () {

    //Create a new row for our datatable
    var prompt = "Please enter new data";
    var oTable = $("#datatable").dataTable();
    var rowData = oTable.fnAddData([prompt , "Yes" ]);

    //Make new row editable
    var oSettings = oTable.fnSettings();
    $('td', oSettings.aoData[ rowData[0] ].nTr).editable('./clientprequalificationlist:setPrequalification' , {
        callback:function (value, settings) {
                $(this).editable("destroy");
        },
        "type" : "text",
        "tooltip" : "Click to edit...",
        submit : "Save",
        cancel:"Cancel",
        "onblur":"cancel",
        "submitdata":function (value, settings) {
            return {
                "row_id":this.parentNode.getAttribute('id'),
                "column":oTable.fnGetPosition(this)[2]
            };
        }
    });

    return false;
});
});

clientprequalificationlist.java 内:

@OnEvent(component = "Prequalification", value = InPlaceEditor.SAVE_EVENT)
void setPrequalification(int id, String value)
{
    if( value.equals("Please enter new data"))
    {
        alertManager.alert(Duration.TRANSIENT, Severity.INFO, "The new client prequalification was not saved. Please enter new data.");
        return;
    }
    ClientPrequalification clientPrequalification = companyLogic.getClientPrequalificationByID(id);

    if (clientPrequalification == null){
        clientPrequalification =  new ClientPrequalification();
    }

    clientPrequalification.setPrequalification(value);
    companyLogic.storeClientPrequalification(clientPrequalification);
}

clientprequalificationlist.tml 内:

<t:form t:id="Prequal" t:autofocus="true">
<t:alerts/>
<t:jquery.datatable
        model="Model"
        source="Source"
        row="row"
        options="Options"
        mode="literal:false"
        exclude="clientPrequalificationId">

    <p:prequalificationCell>
        <div t:id="prequalification"
             t:type="jquery/inPlaceEditor"
             value="row.prequalification"
             t:context="row.clientPrequalificationId"/>
    </p:prequalificationCell>

    <p:enabledCell>
        <t:eventlink t:id="toggle" context="row.clientPrequalificationId">${row.enabled}</t:eventlink>
    </p:enabledCell>
</t:jquery.datatable>

</t:form>

 <a class="btn btn-primary" href="#" id="addnewrow"><i class="icon-lock icon-white"/>  Add Client Prequalification</a>
于 2012-07-03T15:41:55.263 に答える