提交一个加载到引导弹出窗口的表单

Question

如何提交表单加载到引导弹出窗口上？

点击一个按钮，弹出窗口将加载一个表格&同样的表单用户应该可以通过按ENTER键提交它。 check this fiddle

我试着像您需要使用.validate内#popoverId点击这一点，但它的加载整个页面

$('#popoverId').popover({ 
     html: true, 
     title: 'Popover Title<a class="close" href="#");">&times;</a>', 
     content: $('#popoverContent').html(), 
    }); 

    $('#popoverId').click(function (e) { 
     e.stopPropagation(); 
    }); 

    $(document).click(function (e) { 
     if (($('.popover').has(e.target).length == 0) || $(e.target).is('.close')) { 
      $('#popoverId').popover('hide'); 
     } 
    }); 


    //--------------script to to submit form after validation ------------- 

     $(".popover").parent().find('#something').validate({ 
       rules: { 
           sproject_name: { 
            minlength: 3, 
            maxlength: 15, 
            required: true 
           }, tooltip_options: { 
            sproject_name: {placement: 'center', html: true, trigger: 'focus'} 
           } 
          }, 
          submitHandler: function(e) {console.log("ajax logi goes here...."); 
             } 
         }); 

HTML代码

<h3>Live demo</h3> 

<button id="popoverId" class="popoverThis btn btn-large btn-danger">Click to open form</button> 

<div id="popoverContent" class="hide"> 
    <form method="post" name="project-forms" id="something"><input class="red-tooltip" id="sadd_project_id" name="sproject_name" type="text" required/></form> 
</div> 

Answer 1

。因为，您在页面加载时使用它，并且在那时popover窗体仍然不存在。你可以看到下面的代码和演示了解赌注;

$('#popoverId').click(function (e) { 
    e.stopPropagation(); 
    $('#something').validate({ 
      rules: { 
       sproject_name: { 
        minlength: 3, 
        maxlength: 15, 
        required: true 
       } 
      }, 
     submitHandler: function(form) { 
      $.ajax({ 
       type: $(form).attr('method'), 
       url: $(form).attr('action'), 
       data: $(form).serialize(), 
       dataType : 'json' 
      }) 
      .done(function (response) { 
       if (response.success == 'success') {    
        alert('success');      
       } else { 
        alert('fail'); 
       } 
      }); 
     return false; 
     } 
    }); 

}); 

看到这里的工作演示：Demo