Question

我有一个要求，其中有用于添加和显示现有注释的字段集。设计是，在上半部分，来自db的现有注释以行方式显示，在分隔线后面跟着一个具有活动输入字段的行（日期检测字段，用于注释的文本区域和添加按钮）。单击“添加”按钮应添加上面注释列表中的最新注释条目并清除输入字段。我已成功使用JQuery的克隆方法进行此操作。但是，我对这种方法并不满意，因为我没有充分利用这里的门票权力。我是框架的新手，说实话，对于充分利用这个框架所需的基本基础知识仍然不太满意。如果有人可以帮助提出想法（如果你能给我一些实时的示例链接，知识源等），我将非常感激，以实现我提到的使用wicket的任务。

HTML：

<DIV class=row>
    <!-- COMMENTS GRID WIDGET - BEGIN -->
    <DIV class=formField>
        <FIELDSET style="PADDING-BOTTOM: 5px; PADDING-TOP: 5px; PADDING-LEFT: 4px; WIDTH: 985px">
            <LEGEND>Comments</LEGEND>
            <DIV id=frmgrid1 style="HEIGHT: 130px">
                <div id="commentgrid">
                    <DIV style="OVERFLOW: auto; HEIGHT: 130px">
                        <TABLE id="tblGridComment" class="tableData" width="955" border="0" >
                            <THEAD>
                            <TR bgColor=#eaeaea>
                                <TD class=tableTitle style="WIDTH: 100px" noWrap>Date</TD>
                                <TD class=tableTitle noWrap>Comment</TD>
                                <TD class=tableTitle style="WIDTH: 100px" noWrap
                                    align=center>Delete</TD>
                            </TR>
                            </THEAD>
                            <TBODY>
                            <TR bgColor="#ffffff" wicket:id="comrow">
                                <TD class="tableData commenttd" vAlign=top>
                                    <A href="#" wicket:id="comdtlink">
                                        <span wicket:id="comdt"> 12/12/12 </span>
                                    </A>
                                </TD>
                                <TD class="tableData commenttd" vAlign="top">
                                    <INPUT  wicket:id="exsistcomment"
                                            style="WIDTH: 750px" maxLength="2000" name="exsistcomment" />
                                </TD>
                                <TD class="tableData commenttd" vAlign=top>
                                    <INPUT type="checkbox" wicket:id="commdelete" name="commdelete"/>
                                </TD>
                            </TR>
                            </TBODY>
                        </TABLE>
                    </DIV>
                    <HR width=955>
                </div> <!-- comment grid end -->
                <DIV style="TEXT-ALIGN: right; WIDTH: 955px">
                    <SPAN class=row>
                        <SPAN class=formField>
                            <label wicket:id="pdeffdatelabel">Effective Date: </label><BR>
                            <INPUT  wicket:id="pdeffdate" id="pdeffdate" name="pdeffdate" />
                            <!-- <A wicket:id="linkpdeffdate" href="#">
                            <IMG style="VERTICAL-ALIGN: text-bottom; MARGIN-LEFT: 2px"
                            border=0 alt="Select Comment Effective Date" src="cal.gif"
                            width=16 height=19 wicket:id="pdeffdateimg" id="pdeffdateimg">
                            </A> -->
                        </SPAN>
                        <SPAN class=formField>
                            <label wicket:id="pdcommentlabel">Comment: </label><BR>
                            <TEXTAREA   wicket:id="pdcomment" id="pdcomment" cols="94"
                                         name="pdcomment">
                            </TEXTAREA>
                        </SPAN>
                        <SPAN class=formField><BR> 
                            <INPUT id="addcomment"  title="Add Row" class="btnz"
                                   type="button" value=" Add " name="btnAddRowComment">
                        </SPAN>
                    </SPAN>
                </DIV>
            </DIV>
        </FIELDSET>
    </DIV>
</DIV>

JQuery：

 $("#addcomment").click(function () {
             console.log("djkdk");
             var sourcetr   =   $('[id^="commenttr"]').last();
             var clonetr    =   $(sourcetr).clone();    
             clonetr.insertAfter(sourcetr);
             var clonetrid = clonetr.attr("id"),
             res = "",
             newid = "";
             if(clonetrid != "") {  
                res = clonetrid.substring(9,clonetrid.length);
                newid = clonetrid.substring(0,9);
             }
             clonetr.attr('id',newid);
             clonetr.find('[id^="comdt"] span').text($('#pdeffdate').val());
             $('#pdeffdate').val("");
             clonetr.find('[id^="exsistcomment"]').val($('#pdcomment').val());
             $('#pdcomment').val("");
             clonetr.show();

         });

根据我在互联网上可以找到的任何内容，似乎我可以使用WebMarkupContainer对行进行分组，并且可能以某种方式克隆它。我不确定它是否可能。

感谢您的帮助。 Suvo

Answer 1

使用ListView生成重复元素

通过以下内容 http://wicket.apache.org/guide/guide/repeaters.html

如何在Apache wicket中克隆/创建重复的字段集

1 个答案: