Question

我想在单击Form-1中的“Submit”按钮后打开bootstrap模式，如果单击模态中的“Send”按钮，则发送电子邮件并将Form-1保存到数据库中。

如果我关闭它应该拒绝并重定向到某个页面。

提前致谢。

自动生成代码的PHP代码

<?php
 $this->db->select_max('id');
 $result= $this->db->get('numform')->row();
 $result-id++;
 $result = "Num-".date('Ym')."-".$result->id;
?>

表1

<form method="post" action="<?php echo base_url(); ?>controller/method" onsubmit="return openModal();">
    <section class="content">
        <input type="submit" class="form-control" name="aValue" id="aValue" value="<?php echo $result; ?>" readonly> // This is form auto generating number
        <button type="submit" class="btn btn-primary">Submit</button>
</form>

//Javascript Code
function openModal(){
  
      var aValue= document.getElementById('aValue').value;
// I want place the above value(aValue) to the modal and fill up and some fields in the modal and save to submit into the database
      }

<!--Bootstrap Modal-->
<!--Email Modal -->
<div id="emailModal" class="modal fade" role="dialog">
  <div class="modal-dialog">
<form action='<?php echo base_url(); ?>controller/method' method="POST">
    <!-- Modal content-->
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h4 class="modal-title">Send email to User</h4>
      </div>
      <div class="modal-body">
           <label class="col-md-3">Email</label>
         <div class="form-group col-md-9">
            <input type="email" class="form-control" name="emailId" id="emailId" placeholder="Email ID" value="" required>
          </div>
          <label class="col-md-3">CC:</label>
          <div class="form-group col-md-9">
            <input type="email" class="form-control" name="emailCC" id="emailCC" placeholder="CC" required>
          </div>
          <label class="col-md-3">Message</label>
          <div class="form-group col-md-9">
            <textarea name="message" id="message" class="form-control" placeholder="Message" required></textarea>
          </div>
      </div>
      <div class="modal-footer">
        <button type="submit" class="btn btn-info" id="send_email">Send</button>
      </div>
    </div>
 </form>
  <button  class="btn btn-default" data-dismiss="modal">Close</button>
  </div>
</div>

如果我点击发送它如何结束消息并将表单-1保存到数据库中。如果我关闭它应该保存数据。

Answer 1

1）您可以使用简单的HTML按钮并绑定它的click事件，而不是表单中的提交按钮。在点击事件中，抓取aValue的值，并在表单中的隐藏值中设置（在模态中）。

$('#YOUR_BUTTON_ID').on('click',function(e){
    e.preventDefault();
    var aValue= $('#aValue').val(); //grab the value
    $('#HIDDEN_INPUT').val(aValue); //set this is has hidden value in the form 
    $('#emailModal').modal("show"); // open the modal
    });

2）现在在打开的模态中绑定两个事件：1）提交表单2）拒绝表单

$(document).on('click','#ACCEPT_BTN_ID',function(){
        $('#MODAL_FORM_ID').submit(); //submit the form
    });

    $(document).on('click','#REJECT_BTN_ID',function(){
        window.location.reload(); //refresh the same page.
    });

3）在控制器方法中，您可以编写用于发送消息和保存表单值的子功能。

希望这有帮助。

我想在提交表格后打开模态？

1 个答案: