語義UI提交表單按鈕外部表單

我有一個表單通過我的表單外部提交表單的問題。我需要使用這個按鈕提交此表：語義UI提交表單按鈕外部表單

<div class="ui submit green labeled icon button"> <i class="checkmark icon"></i> Create </div>

但按鈕之外<div id="addAcredicationForm" class="ui large form">，而不是驗證表單。模式對話框的頁腳必須在<div class="actions">.之外。

<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>

這裏是例子：jsfiddle.net/q2hLrm13/1

來源

2015-11-17 NomisCZ

你是如何打算提交表單？沒有'

下面是示例：http://jsfiddle.net/q2hLrm13/1/我需要調用Sematic的驗證功能這兩個按鈕（僅適用於一個）。 – NomisCZ

在你的例子中，還沒有'form'標籤。作爲@ Starscream1984的繼續，如果你打算使用'ajax'提交hte表單，那麼表單中的按鈕是不是問題。如果沒有，當用戶點擊按鈕時，你必須使用javascript發送'form'。 –

在HTML5中，這是可能的，你可以有你的形式

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

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

來源

2015-11-17 14:23:33

我不認爲你的權利。看看這個：http://jsbin.com/robipo –

相比你的鏈接，你可以看到我的按鈕有一個屬性'form =「submit-form」'告訴瀏覽器，點擊這個按鈕後，提交表單id'submit-form'。這是HTML5中的一項新功能 –

你是對的，很高興知道。 http://www.w3.org/TR/html-markup/input.submit.html –

你可以隨時隨地把你的按鈕之外的提交按鈕，你只需要在其上添加一個類或一個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); 
      } 
     } 
    }

來源

2015-11-17 15:16:06

請編輯我的工作示例：http://jsfiddle.net/q2hLrm13/1我需要它在語義表單驗證。 – NomisCZ

此處不打開。 –

語義UI提交表單按鈕外部表單

回答

相關問題