0

我是 JQuery 和挂毯的新手......我的意思是向我的 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 页面类通过 Tapestry-JQuery InPlaceEditor 处理新添加的数据（我意识到这不是 Tapestry 独有的）。

另外值得注意的是，如果我有一个名为 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 回答