Codeigniter验证可防止引导模态显示。我该如何解决?

时间:2018-07-02 19:28:55

标签: javascript php twitter-bootstrap codeigniter codeigniter-3

我正在使用codeigniter,并在下面的控制器端进行了一些验证:

$this->form_validation->set_rules('customer_name', 'Customer name', 'trim|required');
    $this->form_validation->set_rules('phone', 'Phone', 'trim|required');
    $this->form_validation->set_rules('address', 'Address', 'trim|required');

我有一个创建客户的引导程序表单,以及一个弹出窗口以添加有关客户的其他信息的按钮。

<form role="form" action="<?php base_url('customers/create') ?>" method="post" enctype="multipart/form-data">
              <div class="box-body">
                <?php echo validation_errors(); ?>
                   <div class="form-group">
                      <label for="customer_name">Customer</label>
                      <input type="text" class="form-control" id="customer_name" name="customer_name" placeholder="Enter Customer Name" autocomplete="off"/>
                    </div>

                    <div class="form-group">
                      <label for="contacts">Customer Contacts</label>
                       <div><button class="btn btn-primary" data-toggle="modal" data-target="#addModal">Add Value</button></div>


                    </div>    
    ...
    ...
     <div class="box-footer">
                    <button type="submit" class="btn btn-primary">Save</button>
                    <a href="<?php echo base_url('customers/') ?>" class="btn btn-warning">Back</a>
                  </div>
                </form>

模态在这里:

<div class="modal fade" tabindex="-1" role="dialog" id="addModal">
  <div class="modal-dialog" role="document">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title">Add Attribute Value</h4>
      </div>

      <form role="form" action="<?php echo base_url('customers/createValue') ?>" method="post" id="createForm">

        <div class="modal-body">
          <div class="form-group">
            <label for="brand_name">Attribute Value</label>
            <input type="text" class="form-control" id="attribute_value_name" name="attribute_value_name" placeholder="Enter attribute value" autocomplete="off">
          </div>
        </div>

        <div class="modal-footer">
          <input type="hidden" name="attribute_parent_id" id="attribute_parent_id" value="3">
          <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
          <button type="submit" class="btn btn-primary">Save changes</button>
        </div>

      </form>


    </div><!-- /.modal-content -->
  </div><!-- /.modal-dialog -->
</div><!-- /.modal -->

当我单击模式按钮时,正在显示模式表格,但立即关闭。并以主要客户形式显示验证警告。模式按钮触发主表单验证。

顺便说一句,当我在表单标签外部使用模式按钮时,它没有任何问题。但是我想在表单内部使用模式按钮。 我该如何解决?

感谢。

1 个答案:

答案 0 :(得分:0)

希望这对您有帮助:

只需将模式调用button更改为anchor

替换此

<button class="btn btn-primary" data-toggle="modal" data-target="#addModal">Add Value</button>

与此

<a class="btn btn-primary" data-toggle="modal" data-target="#addModal">Add Value</a>

您的整个表单应该是这样;

<form role="form" action="<?php base_url('customers/create') ?>" method="post" enctype="multipart/form-data">
    <div class="box-body">
        <?php echo validation_errors(); ?>
           <div class="form-group">
              <label for="customer_name">Customer</label>
              <input type="text" class="form-control" id="customer_name" name="customer_name" placeholder="Enter Customer Name" autocomplete="off"/>
            </div>

            <div class="form-group">
              <label for="contacts">Customer Contacts</label>
               <div>
                <a class="btn btn-primary" data-toggle="modal" data-target="#addModal">Add Value</a></div>
            </div>    
    <div class="box-footer">
        <button type="submit" class="btn btn-primary">Save</button>
        <a href="<?php echo base_url('customers/') ?>" class="btn btn-warning">Back</a>
    </div>
</form>