Jquery 如何使用Thymeleaf获取动态输入框数据？

我正在使用STS3.9.0工具，我的项目基于Spring引导、Thymeleaf、Mysql、Html引导和JQuery

我需要得到dynamicali生成的输入框在thymeleaf中的值。。 解释

1.单击“添加共同所有者”按钮时，将调用Jquery并生成输入框

2.我需要在@controller页面中获取动态生成的输入框值

JQUERY-动态生成的输入框代码

$（文档）.ready（函数（）{
var max_fields=10；//允许的最大输入框数
var wrapper=$（“#添加_CownerInp”）；//字段包装器
var add_button=$（“#addButton_Cowner”）；//添加按钮ID
var x=0；//初始文本框计数
$（添加按钮）。单击（函数（e）{//在添加输入按钮上单击
e、 预防默认值（）；
如果（x

平面加法形式
物业附加表格
社名
建筑物/翼楼/街区*
公寓/别墅/店铺编号*
超积累
地区
堆积区
地毯面积
卧室数量
浴室数量
停车场
停车场

所有者名称
电话号码
电子邮件
我们永远不会与任何人共享您的电子邮件和电话号码。
共有人
拯救
重置
使用jQuery插入输入时，不要使用
th:
属性

Thymeleaf是模板引擎。从服务器获取视图时，每个
th:
元素都被计算为纯HTML。这意味着在生成的视图中，任何元素都没有
th:
属性。因此，您不能简单地使用jQuery动态添加
th:
属性，因为在这一点上它没有任何意义

我假设您的
EntFlatMaster
类有一个类似
listcoowner
的字段。在这种情况下，您可以在调整输入生成代码时从动态添加的输入发送数据。在脚本中，您应该将
th:field=“*{listcoowner.cophone}
等属性替换为
name=listcoowner[index].field
。当您用以下代码替换
add_按钮时，应该可以：

$(add_button).click(function(e){ // on add input button click
    e.preventDefault();
    if(x < max_fields){ // max input box allowed

        $(wrapper).append('<div class="form-row">'
            +'<!-- Owner Name -->'
            +'<div id="TextBoxDiv'+x+'" class="form-group col-md-4">'
            +'<label for="cowner'+x+'">Name</label>'
            +'<input id="cowner'+x+'" name="listcoowner[' + x + '].coownername" type="text"  class="form-control" placeholder="Enter Name"></input>'
            +'</div>'

            +'<!-- Owner Phone Number -->'
            +'<div class="form-group col-md-4">'
            +'<label for="oph'+x+'">Phone Number</label>'
            +'<input id="oph'+x+'" name="listcoowner[' + x + '].cophone" type="text"  class="form-control" placeholder="+91-999-999-9999"></input>'
            +'</div>'

            +'<!-- Owner Email -->'
            +'<div class="form-group col-md-3">'
            +'<label for="email'+x+'">Email</label>'
            +'<input id="email'+x+'" name="listcoowner[' + x + '].coemail" type="email"  class="form-control" placeholder="xyz@abc.com"></input>'
            +'</div>'
            +'<a href="#"class="remove_field col-md-1"> X </a>'
            +'</div>');

        x++; // text box increment now x=1 after x++ x=2,so next code 2%2==0 is true
    }
});

$（添加按钮）。单击（函数（e）{//在添加输入按钮上单击
e、 预防默认值（）；
如果（x

此解决方案将添加新的输入并将正确的数据发送回控制器，但是它也会使字段删除无效！如果您想保持字段删除，您需要为
删除\u field
回调实现额外的逻辑，这将修复索引（字段应分别从0索引）

或者，您也可以在thymeleaf和服务器端的帮助下动态实现字段