2013-12-11 72 views
0

我在这个程序中遇到了一些问题。我想给模态使用semantic-ui但它不起作用。当我点击按钮顺序将显示模式,但我现在的问题,我点击按钮顺序显示新页面。并且不能插入数据库。警报消息在codeigniter中成功

视图代码:

<div class = "ui form grid_6 omega"> 
     <form target="paypal" method="post"> 
      <div class="field1"> 
      <div class="field"> 
       <label>Nama</label> 
       <input placeholder="Nama" name="nama" type="text"> 
      </div> 
      <div class="field"> 
       <label>No. HP</label> 
       <input placeholder="No. HP" name="handphone" type="text"> 
      </div> 
      <div class="field"> 
       <label>Alamat</label> 
       <input placeholder="alamat" name="alamat" type="text"> 
      </div> 
      <div class="field"> 
       <label>Jumlah</label> 
       <div class="selectbox"> 
        <select name="jumlah" id=""> 
        <?php for ($i=1; $i <= 20; $i++): ?> 
        <option value="<?php echo $i; ?>"><?php echo $i; ?></option> 
        <?php endfor; ?> 
       </select> 
       </div> 

      </div> 
      <button type="submit" class="ui teal button order-button">Order now</button> 
      </div> 
     </form> 
     </div> 

     <div class="ui small modal"> 
       <i class="close icon"></i> 
       <div class="header"> 
        Smalls Like Bakin 
       </div> 
       <div class="content"> 
        <p>Thank you for your order</p> 
       </div> 
       <div class="actions"> 
        <div class="ui positive right labeled icon button"> 
        <a class="text-white" href="<?php echo site_url('home/order');?>">Back to Home</a> 
        <i class="checkmark icon"></i> 
        </div> 
       </div> 
       </div> 

和脚本

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script> 
<script type="text/javascript" src="<?php echo base_url(); ?>packaged/javascript/semantic.js"></script> 
<script type="text/javascript"> 
    $('.order-button').click(function(){ 
     $('.small.modal').modal('show'); 
    }); 

</script> 

控制器的代码;

function simpanOrder() 
    { 
     $this->load->model("M_order"); 
     $data['nama'] = $_POST['nama']; 
     $data['handphone'] = $_POST['handphone']; 
     $data['alamat'] = $_POST['alamat']; 
     $data['jumlah'] = $_POST['jumlah']; 
     $result = $this->M_order->insert($data); 
    } 

你能告诉我我的代码在哪里以及如何解决它?谢谢。

回答

0

通过给你的模态的div一个id为尝试:

<div id="modaldiv" class="ui small modal"> 

,并在你的脚本修改为:

<script type="text/javascript"> 
$('.order-button').click(function(){ 
    $('#modaldiv').modal('show'); 
}); 
</script> 

另外,还要确保你已经囊括了所有必需的javasript文件运行模态。

+0

其工作但模式不能正常工作。当我点击命令模态显示但是然后模态自己消失。如何解决这个问题? – user3040066

+0

如果它为您工作,请接受答案。为了让你的模态消失在自己身上,请检查你的表单在模态关闭后提交。 – user2936213

+0

你能告诉我详细说明如何解决这个问题吗? – user3040066