Spring MVC 表单标签库是如何工作的？我的推理是否与特定示例有关

Question

我正在开发一个 Spring MVC 应用程序，我对如何提交表单有以下疑问：

<form:form action="consultazioneRicercaForm" method="post" modelAttribute="consultazioneFilter" id="ricercaForm">

    <div class="form-group">
        <div class="row">
            <div class="col-md-4">
                <label style="display: block;">Regione:</label>
                    <%-- <form:select path="codiceRegione" id="selReg" class="requiredGroup1 form-control" name="selReg"> --%>
                <form:select path="codiceRegione" id="selReg" class="form-control" name="selReg">
                <form:option value="" label="--SELEZIONARE UNA REGIONE--"/>
                <form:options items="${listaRegioni}" itemLabel="desReg" itemValue="codReg" />
                </form:select>
            </div>

            <div class="col-md-4">
                <label style="display: block;">Provincia:</label>
                <form:select path="codiceProvincia" id="selProv" class="form-control"></form:select>
            </div>

            <div class="col-md-4">
                <label style="display: block;">Codice Meccanografico:</label>
                <form:input path="codiceMeccanografico"  id="selCodMec" class="form-control" name="codMec" minlength="4" />
                <%-- <form:input path="codiceMeccanografico"  id="selCodMec" class="requiredGroup1 form-control" name="codMec" minlength="4" /> --%>
                </div>

            </div>
            <div class="row" style="margin-top: 30px;">
                <div class="col-md-4">
                    <label style="display: block;">Stato Progetto:</label>
                    <form:select path="statoProgetto" id="selStatoProgetto" class="form-control">
                        <form:option value="" label="--STATO PROGETTO--"/>
                        <form:options itemLabel="descrizione" itemValue="codice" items="${listaDescrizioneStatoProgetto}"/>
                    </form:select>
                </div>

                <div class="col-md-4">
                    <label style="display: block;">Gruppo Tipologie Progetto:</label>
                    <form:select path="gruppoTipologie" id="selGruppoTipologie" class="form-control" name="selGruppoTipologie">
                        <form:option value="" label="--GRUPPO TIPOLOGIE--"/>
                        <form:options itemLabel="desTipGru" itemValue="codTipGru"  items="${listaGruppi}"/>
                    </form:select>
                </div>

                <div class="col-md-4">
                    <label style="display: block;">Tipologia Progetto:</label>
                    <%-- <form:select path="tipologiaProgetto"  id="selTipologiaProgetto" class="form-control">
                            <form:option value="" label="--TIPOLOGIA--"/>
                            <form:options itemLabel="descrizione" itemValue="codice" items="${listaDescrizioneTipologiaProgetto}" />
                        </form:select> --%>
                        <form:select path="tipologiaProgetto" id="selTipologiaProgetto" class="form-control">
                        </form:select>
                    </div>
                </div>

                <div class="row" id="dataTrasmissioneDiv" style="margin-top: 30px;">
                    <div class="col-md-4">
                        <label  id="dataTrasmissioneLabel" style="display: block;">Data Trasmissione:</label>
                        <form:select path="dataTrasmissione" id="selDataTrasmissione" class="form-control">
                            <form:option value="" label="--DATA TRASMISSIONE--"/>
                            <form:options itemLabel="descrizione" itemValue="codice"  items="${listaDateTrasmissione}"/>
                        </form:select>
                    </div>
                </div>

                <div class="row" style="margin-top: 30px;">
                    <div class="col-md-12">
                        <input type="button" value="Cerca" class="btn btn-default" onClick="submitConsultazione()" />
                        <input type="button" value="Pulisci filtri" class="btn btn-default" onClick="pulisciFiltriConsultazione()" />
                    </div>
                </div>
            </div>
        </form:form>

如您所见，此表单使用 Spring MVC 标签库。

在特定情况下，此表单以这种方式声明：

<form:form action="consultazioneRicercaForm" method="post" modelAttribute="consultazioneFilter" id="ricercaForm">

根据我的理解（如果我做错了断言请纠正我）意味着：

action="consultazioneRicercaForm"：它是我提交表单时调用的资源（所以我需要一个控制器方法来处理POST 向 consultazioneRicercaForm 资源请求。
method="post"：表示请求是POST请求.
modelAttribute="consultazioneFilter"：这是一个模型属性（由呈现包含先前表单的页面的控制器放入模型中) 其中存储了表单中插入的值。

所以这意味着当用户提交表单时，必须从处理 consultazioneRicercaForm 资源的控制器中检索这个初始化模型属性。

我的推理是否正确？

现在我的主要疑问是。如您所见，此表单不是以经典方式提交的，但有此按钮：

<input type="button" value="Cerca" class="btn btn-default" onClick="submitConsultazione()" />

当它被点击时，调用 submitConsultazione() JavaScriot 函数，这是代码：

function submitConsultazione() {    
    if($('#ricercaForm').valid()){
    var fd = new FormData();

    var filtro = {
            selReg : $('#selReg').val(),
            selProv : $('#selProv').val(),
            selCodMec : $('#selCodMec').val(),
            selTipologiaProgetto : $('#selTipologiaProgetto').val(),
            selStatoProgetto : $('#selStatoProgetto').val(),
            selDataTrasmissione : $('#selDataTrasmissione').val(),
            selGruppoTipologie : $('#selGruppoTipologie').val(),
        };
        fd.append('filtro', JSON.stringify(filtro));

        $.ajax({
            type : "POST",
            url : "ricericaConsultazione",
            data : fd,
            processData : false,
            contentType : false
        }).done(function(response) {

            // $('#outputRicerca').html(response);
            sostituisciFrammentoJsp('outputRicerca', response);
            showSuccessMessage('Ricerca completata');
        }).error(function(xhr) {
            manageError(xhr);
        });
    }
}

所以基本上这个函数是手动检索插入到表单字段中的值，并将这些值放入一个 JSON 对象中，该对象将被检索到一个处理 Http POST 请求的方法 ricericaConsultazione 资源（与前一种形式的 action 属性定义的不同）。

那么它到底是什么意思呢？似乎他们已经声明了一个 Spring 表单，该表单使用 form taglib 但没有使用 form taglib 功能，但是手动执行表单 sumbit。

这是真的还是我遗漏了什么？

Answer 1

是的。 Spring 声明表单并手动完成表单提交，这发生在 javascript 函数 submitConsultazione() 中。

但是这里使用了spring形式。

如果您注意到，有一些 form:select 元素在呈现时将呈现为 html select，其中也将包含一些选项。我们可以使用 form:options 标签获取项目列表、项目标签和项目值，而不是遍历所有值并打印它。
模型属性（又名表单 bean）可能包含一些值。因此，要使用这些值填充相应的 html 表单字段，我们可以手动执行
```
<input value="${formBean.stringValueProperty}" >
```
或通过spring表单标签
```
<form:input path="stringValueProperty" />
```
表单标签可以轻松预填充值。

Spring 表单标签的使用及其工作原理：
Spring 表单用于在呈现和处理提交的请求时绑定 html 字段和表单 bean。在呈现 html 时，必须正确生成表单 bean 属性名称，以便在处理提交的请求时，将请求参数正确映射到表单 bean 属性。

虽然我觉得 Spring 表单标签没有按应有的方式使用。不确定此代码作者的要求和意图。

Spring MVC 表单标签库是如何工作的？我的推理是否与特定示例有关

How exactky works the Spring MVC form taglib? Is it my reasoning correct related to a specific example

java

spring

jsp

spring-mvc

spring-form