首页 文章

模态中的Bootstrap表单不提交

提问于
浏览 次
0

单击'submit'时，表单不响应（并且没有任何内容发送到服务器） . 我暂时从随机网站将表单的值设置为GET . 关闭按钮正确关闭模态 . 我工作了this example

html 
        body
            #editModal.modal.fade(tabindex="-1", role="dialog", aria-labelledby="myModalLabel", aria-hidden="true")
                .modal-dialog
                    .modal-content
                        // Modal Header
                        .modal-header
                            button.close(type="button", data-dismiss="modal")
                                span(aria-hidden="true") ×
                                span.sr-only Close
                            h4#myModalLabel.modal-title
                                | Edit Resource
                        // Modal Body
                        .modal-body
                            #editForm.form(role='form' method='GET' action='https://www.google.com/') // CHANGE THIS!
                                div.form-group
                                    label(for='name') Name:
                                    input#name.form-control(type='text', name='name', required='')
                                div.form-group
                                    label(for='address') Address:
                                    input#address.form-control(type='text', name='address')
                                div.form-group
                                    label(for='phone') Phone:
                                    input#phone.form-control(type='text', name='phone')
                                div.form-group
                                    label(for='website') Website:
                                    input#website.form-control(type='text' name='website')
                                div.form-group
                                    label(for='email') Email:
                                    input#email.form-control(type='email' name='email')
                                div.form-group
                                    label(for='description') Description:
                                    textarea#description.form-control(type='text', name='description', rows = '5')
                                button.btn.btn-primary(type="submit", name="asdf") Submit
                                button.btn.btn-default(type="button", data-dismiss="modal")
                                    | Close
twitter-bootstrap pug bootstrap-modal

1 回答

  • 0

    从"#editForm.form"更改为仅"form"并且似乎已经有效，请查看此代码，同样在codepen中：

    body
  p test
  .modal-dialog
    .modal-content
      // Modal Header
      .modal-header
        button.close(type="button", data-dismiss="modal")
          span(aria-hidden="true") ×
          span.sr-only Close
        h4#myModalLabel.modal-title
          | Edit Resource
      // Modal Body
      .modal-body
        //#editForm.form(role='form' method='GET' action='https://www.google.com/')
        form(role='form' method='GET' action='https://www.google.com/')
          div.form-group
            label(for='name') Name:
            input#name.form-control(type='text', placeholder='name' name='name')
          div.form-group
            label(for='email') Email:
            input#email.form-control(type='email', placeholder='name@email.com' name='email')
          button.btn.btn-primary(type="submit", name="asdf") Submit
          button.btn.btn-default(type="button", data-dismiss="modal")
            | Close
    回复于

相关问题