Javascript 表单外部的语义UI提交表单按钮

我在通过表单外的按钮提交表单时遇到问题。我需要使用此按钮提交此表单：

创造

但是按钮在

之外，不能验证表单。按钮必须位于模态对话框的

到期页脚中的窗体外部

<div id="addModal" class="ui small modal">
    <i class="close icon"></i>
    <div class="header">
        <div class="column">
            <h3 class="ui header">
                <i class="bordered inverted blue plus icon"></i>
                <div class="content">
                    XYZ
                </div>
            </h3>
        </div>
    </div>
    <div class="content">
        <div id="addAcredicationForm" class="ui large form">
            <div class="ui blue segment">
                <div class="field">
                    <label>Název akreditace</label>
                    <input type="text" maxlength="40" id="name" name="name" placeholder="aaaa">
                </div>
                <div class="field">
                    <label>Poznámka</label>
                    <textarea rows="5" maxlength="250" id="note" name="note" placeholder="bbbb"></textarea>
                </div>
            </div>
            <div class="ui error message"></div>
        </div>
    </div>
    <div class="actions">
        <div class="ui submit green labeled icon button">
            <i class="checkmark icon"></i>
            Create
        </div>
        <div class="ui cancel red labeled icon button">
            <i class="remove icon"></i>
            Cancel
        </div>
    </div>
</div>

XYZ
Název akreditace
波兹纳姆卡
创造
取消

---

下面是一个例子：

在HTML5中，这是可能的，您可以在表单外部使用提交按钮

<form id="submit-form">
...
</form>

<button type="submit" form="submit-form">Submit</button>

...
提交

您可以将按钮放在任何位置，只需在其上添加类或id即可。 制作按钮后，您可以使用如下功能：

function pageTransition(response) {
    content.fadeOut(200, function() {
        content.html(response);
        content.fadeIn(800);
    });
}

//page transitions Get
function pageTransitionGet(url) {
    $.get(url, {}, $.noop, "html").success(pageTransition);
}

// page transitions Post
function pageTransitionPost(url, idForm) {
    $.post(url, serializeForm(idForm)).success(pageTransition);
}
function serializeForm(idForm) {    
    // Clones the form removing masks
    var formSubmit = $('#' + idForm).clone();

    // all the fields of the form
    var fieldForm = $('#' + idForm).find(':input');

    // all cloned fields
    var fieldFormSubmit = formSubmit.find(':input');

    // hidden fieldForms
    var fieldFormHidden = $('#' + idForm).find("div:hidden").find(":input");


    for (var i = 0; i < fieldForm.length; i++) {
        fieldFormSubmit[i].value = fieldForm[i].value;

        if (idForm != 'formConsultaOperacao') {
            // Bloqueia os fieldForm que estão em divs ocultas.
            if (fieldFormHidden.filter($(fieldForm[i])).exists()) {
                $(fieldFormSubmit[i]).attr("disabled", true);
            } else {
                $(fieldFormSubmit[i]).attr("disabled", false);
            }
        }
    }

功能页面转换（响应）{
内容淡出（200，函数（）{
html（响应）；
内容：fadeIn（800）；
});
}
//页面转换获得
函数pageTransitionGet（url）{
$.get（url，{}，$.noop，“html”）.success（pageTransition）；
}
//页面转换帖子
函数pageTransitionPost（url，idForm）{
$.post（url，serializeForm（idForm））.success（pageTransition）；
}
函数序列化形式（idForm）{
//删除遮罩后克隆窗体
var formSubmit=$（'#'+idForm）.clone（）；
//表单的所有字段
var fieldForm=$（'#'+idForm）.find（':input'）；
//所有克隆字段
var fieldFormSubmit=formSubmit.find（':input'）；
//隐藏字段窗体
var fieldFormHidden=$（'#'+idForm）.find（“div:hidden”）.find（“：input”）；
对于（变量i=0；i

您打算如何提交表单？没有

标记，您是通过AJAX提交的吗？下面是一个示例：我需要调用Sematic两个按钮的验证功能（仅一个可用）。在您的示例中，仍然没有

表单

标记。作为@Starcream1984的继续，如果您打算使用

ajax

提交表单，则无论按钮是否在表单中。如果不在表单中，当用户单击按钮时，您必须使用javascript发送

表单

。我解决了它：函数验证此（）{$（'.form'）.form（'validate form'）；}与您的链接相比，您可以看到我的按钮有一个属性

form=“submit form”

告诉浏览器，单击此按钮后，使用id提交表单

提交表单

。这是HTML5中的一项新功能。请编辑我的工作示例：我需要在语义表单验证中使用它。