Question

我想使用ajax jquery创建表单提交，但每次按提交时，表单总是直接执行到控制器而不传递ajax调用。我的代码有什么问题吗？

控制器：

public function simpanSaran(){

$this->form_validation->set_rules('nama', 'Nama', 'required');    
$this->form_validation->set_rules('email', 'Email', 'required');
$this->form_validation->set_rules('sub', 'Subjek', 'required');
$this->form_validation->set_rules('isi', 'Isi', 'required');

    if ($this->form_validation->run() == FALSE) {
        $this->content("user/hal_saran"); 
    }
    else {
    $insert = array(
    'nama'    => $this->input->post('nama'),
    'email'     => $this->input->post('email'),
    'subjek'      => $this->input->post('sub'),
    'komentar' => $this->input->post('isi'),         

    );
        $this->db->insert('guest',$insert);         

     }
    }

我的观点，使用ajax jquery：

     <script>
   $(document).ready(function() {
   $('#myForm').submit(function() {
e.preventDefault();
    $.ajax({
        type: 'POST',
        url: $(this).attr('action'),
        data: $(this).serialize(),
        success: function() {
            $('#result').slideDown();
        }       
  }
    })
    return false;
});


$('.close').click(function(){
$('#result').slideUp();
});
});
</script>   

<div class=" span9">
<div class="span9" id="result" style="display:none;height:80px;">
                        <div class="notices" >
                            <div class="bg-color-green" style="height:60px;">
                                <a href="#" class="close"></a>                                    
                                <div class="notice-header fg-color-white">Terima Kasih!</div>
                                <div class="notice-text">Anda telah Memberikan Kritik dan Saran pada Kami.</div>
                            </div>
                        </div>
                    </div>
<div id="hid" style="display:none;"></div>
<?php  
$attr = array('id' => 'myForm');
echo (form_open('lowongan/simpanSaran',$attr)) ?>
<div class="input-control text span3" style="height:40px;">     
    <input type="text" placeholder="Nama" name="nama" required/>
    <button class="btn-clear"></button>
</div>
<div class="input-control text span3" style="height:40px;">
    <input type="text" placeholder="Email" name="email" required/>
    <button class="btn-clear"></button>
</div>
<div class="input-control text span3" style="height:40px;">
    <input type="text" placeholder="Subjek" name="sub" required/>
    <button class="btn-clear"></button>
</div>
<div class="input-control textarea span9" >
    <textarea placeholder="Komentar" name="isi" style="height:200px;" required></textarea>          
    <button type="submit" class="fg-color-white bg-color-purple" style="margin-top:20px;"><i class="icon-comments-5"></i> Kirim</button>    
    <p>*Saran atau kritik akan di-reply melalui email</p>
</div>

<?php echo(form_close())?>
</div>

Answer 1

只是一个小小的变化：

$('#myForm').submit(function(e) {
e.preventDefault();

Ajax jquery表单提交codeigniter不起作用

1 个答案: