2013-12-11 137 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