如何驗證表單內的輸入並在表單外提交按鈕

Question

根據需求我試圖驗證表單。

實際上，我在Bootbox模式對話框中傳遞表單輸入元素，並在模態對話框中動態傳遞提交按鈕。

當輸入類型=提交時，它可以驗證表單輸入。但是沒有提交按鈕裏面的形式，因爲我在模態中傳遞它，它無法驗證表單。 例如：

<form id="form_id"> 
Name:<input type="text" required> 
<input type="submit" value="Submit"> 
</form> 

$("#form_id").submit(function(e)){ 
//validation is ok 
return false; 
} 

這是確定的，但是，現在 模態：

var data="<form id="form_id"> 
    Name:<input type="text" required> 
    </form>"; //getting from server 

      $.ajax({ 
      url : 'url', 
      type : 'get', 
      async : true, 
      data : data, 
      success : function(data) { 
       modalDialog = bootbox.dialog({ 
        size : 'large', 
        title : "Title" 
        show : false, 
        message : data, 
        buttons : { 
         success: { 
          label : "Close window", 
          className : "btn-default", 
          callback : function() { 
    return false; 
     //after clicking submit button it should ask required if no data input,and stay in dialog as what happened previous scenario.But dialog is closed. 

          } 
         } 
        } 
       }); 
       modalDialog.on('shown.bs.modal', function() { 
       }); 

       modalDialog.modal('show'); 

      } 

     }); 

Answer 1

嘗試這樣

在要求您輸入型加html

<form id="frmPlate"> 
    <input type="text" name="Name" required="required" /> 
</form> 
<button type="submit" onclick="CheckValidation();"> Submit</button> 

而且你可以在jQuery驗證像下面的代碼

function CheckValidation(){ 
    var frmvalid = $("#frmPart").valid(); 
    if (!frmvalid) { 
     return false; 
    } 
} 

Answer 2

當所有的條件都滿足使用JavaScript來提交表單。

document.getElementById('form_id').submit(); 

或jQuery的

("#'form_id'").submit(); 

現在，這裏是你的代碼與 「提交」 添加到它

var data="<form id="form_id"> 
Name:<input type="text" required> 
</form>"; //getting from server 

     $.ajax({ 
     url : 'url', 
     type : 'get', 
     async : true, 
     data : data, 
     success : function(data) { 
      modalDialog = bootbox.dialog({ 
       size : 'large', 
       title : "Title" 
       show : false, 
       message : data, 
       buttons : { 
        success: { 
         label : "Close window", 
         className : "btn-default", 
         callback : function() { 

("#'form_id'").submit(); 
    return false; 
     //after clicking submit button it should ask required if no data input,and stay in dialog as what happened previous scenario.But dialog is closed. 

         } 
        } 
       } 
      }); 
      modalDialog.on('shown.bs.modal', function() { 
      }); 

      modalDialog.modal('show'); 

     } 

    });