如何使用jquery将<form:input path =“”>附加到表中?</form:input>

时间:2014-08-27 03:20:46

标签: javascript jquery jsp

如果用户按下按钮添加,我想添加行。

我使用jsp和jquery .append(),但它不起作用

我厌倦了尝试将<form:input path="">添加到表格中。

HTML代码

<table class="table" id="fileMappingTable">
    <thead>
        <tr>
            <th><fmt:message key='fileMapping.parameter.sequence' /></th>
            <th style="text-align:right;" colspan=2><a href="#" id="addSequence" class="button tiny" style="margin: 0;">Add sequence</a></th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td style="vertical-align: top;">
                <form:input path="sequence" id="sequence"
                    cssClass="validate[required]"
                    cssErrorClass="error validate[required]" />
                <form:errors path="sequence" cssClass="error" />
            </td>
            <td>
                <form:radiobutton path="value" id="default" value=""/><label for="default">Default</label> <br>

                <form:radiobutton path="value" id="startCharacter" value=""/><label for="startCharacter">Start character</label>
                <form:input path="firstCharacterPosition" id="firstCharacterPosition"
                    cssClass="validate[required]"
                    cssErrorClass="error validate[required]"/>
                <label for="length">Length</label>
                <form:input path="length" id="length"
                    cssClass="validate[required]"
                    cssErrorClass="error validate[required]"/><br>

                <form:radiobutton path="value" id="dateTime" value=""/><label for="dateTime">Date & Time</label>
                <form:select path="">
                    <form:option value="">DATE</form:option>
                    <form:option value="">DATE AND TIME</form:option>
                </form:select><br>
            </td>
            <td style="vertical-align: top;">
                <a href="#">remove</a>
            </td>
        </tr>
    </tbody>
</table>

Javascript代码

$("#addSequence").click(function(){
    $("#fileMappingTable:last").append(
        "<tr>" +
            "<td style='vertical-align: top;'>" +
                "<form:\input path='sequence' id='sequence' cssClass='validate' cssErrorClass='error validate' />" +
                "<form:\errors path='sequence' cssClass='error' />" +
            "</td>" +
            "<td>" +
                "<form:radiobutton path='value' id='default' value=''/><label for='default'>Default</label><br>" +
                "<form:radiobutton path='value' id='startCharacter' value=''/><label for='startCharacter'>Start character</label>" +
                "<form:input path='firstCharacterPosition' id='firstCharacterPosition' cssClass='validate[required]' cssErrorClass='error validate[required]'/>" +
                "<label for='length'>Length</label>" +
                "<form:input path='length' id='length' cssClass='validate[required]' cssErrorClass='error validate[required]'/><br>" +
                "<form:radiobutton path='value' id='dateTime' value=''/><label for='dateTime'>Date & Time</label>" +
                "<form:select path=''>" +
                    "<form:option value=''>DATE</form:option>" +
                    "<form:option value=''>DATE AND TIME</form:option>" +
                "</form:select><br>" +
            "</td>" +
            "<td style='vertical-align: top;'>" +
                "<a href='#'>remove</a>" +
            "</td>" +
        "</tr>"
    );
});

如果我点击包含id="addSequence"的按钮,则会在javascript代码上添加<form:input path=""/>

之前感谢

1 个答案:

答案 0 :(得分:1)

首先执行JSTL或Spring MVC表单标记并创建普通标记或html。之后你将使用Jquery操纵html,而不是相反。在使用jquery

操作它之前创建第一个spring标签