javascript - 在Codeigniter PHP中插入数据后显示成功弹出消息

提交数据后，需要在弹出窗口中显示成功消息，但问题是，一旦我单击“提交”按钮，它就会显示警报消息，然后再提交数据。

<form name="applynow"  id="applynow" enctype="multipart/form-data" method="post"  action="<?php echo base_url();?>apply/applynow">

            <div class ="applyus">
                    <div class="applyfullname contactname">
                        <input type="text" class="form-control names namesss" name="fullname"  value="<?php echo set_value('fullname');?>" placeholder="Full Name" required><span class="required">*</span>
                        <?php echo form_error('fullname', '<div class="error">', '</div>'); ?>
                    </div>

                    <div class="applynowemail contactemail">
                           <input type="email" class="form-control emails" id="email" name="email" value="<?php echo set_value('email');?>" placeholder="Email" required >  <span class="requireds">*</span>
                        <?php echo form_error('email', '<div class="error">', '</div>'); ?>
                    </div>

<button type="submit"  class="btn btn-success successss" id="submits" >Submit</button>

脚本：

<script>
$('form').on('submit',function(){
       alert('submitted');
});

提交数据后，它将显示弹出窗口，并且该页面应重定向到另一个页面。

尝试过Ajax：

<span class="success">Thank's for submitting the form</span>
$(document).ready(function() {
$("form[name='applynow']").submit(function() {
 $.ajax({
        type: "POST",
        url: "career.php",
        data: $(this).serialize(),
        success: function() {
            $('.sucess').fadeIn(100).show();

        }
    })

})
})

立即申请控制器：

public function applynow($job_id)
{
    if ($this->input->post('email'))
    {
        $this->form_validation->set_error_delimiters('<br /><span class="error"> ', '</span>');
        $this->form_validation->set_rules('fullname', 'First Name', 'required');
        $this->form_validation->set_rules('email', 'Email', 'required|valid_email');

        $this->form_validation->set_rules('captcha', 'Captcha', 'required');

        if ($this->form_validation->run() == FALSE)
        {
            $data['records2']= $this->career_model->getcareerdatas($job_id);
            $data['mainpage']='apply';
            $this->load->view('templates/template',$data);
        }
        else
        {
            $inputCaptcha = $this->input->post('captcha');
            $sessCaptcha  = $this->session->userdata('captchaCode');
            if ($inputCaptcha === $sessCaptcha)
            {
                $result = $this->apply_model->apply($this->input->post('email'));
                $data['records2']= $this->career_model->getcareerdatas($job_id);
                return true;
                if ($result)
                {
                    $this->flash->success('<h2 style="color:green">Thank You applying to this post!will get back you soon once shortlisted..</h2>');
                    redirect('apply');
                } else
                {
                    $this->flash->success('<h2 style="color:red">Sorry ! Message sending failed</h2>');
                    redirect('apply');
                }
            } else {
                $this->flash->success('<h2 style="color:red">Captcha code was not match, please try again.</h2>');
                redirect('apply');
            }
        }
    }
    $config  = array(
        'img_path' => 'captcha_images/',
        'img_url' => base_url() . 'captcha_images/',
        'img_width' => '150',
        'img_height' => 40,
        'word_length' => 6,
        'font_size' => 30
    );
    $captcha = create_captcha($config);
    $word    = $captcha['word'];
    $this->session->unset_userdata('captchaCode');
    $this->session->set_userdata('captchaCode', $word);
    $data['captchaImg'] = $captcha['image'];
    $data['mainpage']   = "apply";
}

最佳答案

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
</head>
<body>
<div class ="applyus">
<div class="applyfullname contactname">
<input type="text" class="form-control names namesss" name="fullname"  value="" placeholder="Full Name" >
</div>

<div class="applynowemail contactemail">
   <input type="email" class="form-control emails" id="email" name="email" value="" placeholder="Email"  >
</div>
<button class="btn btn-success successss" id="sub" >Submit</button>
<script>
$("#sub").click(function() {
    var url = 'applynow.php';

    var data = {
        'namesss' : $(".namesss").val(),
        'emails' : $(".emails").val()
    }

    alert('Data before send is:');
    alert(JSON.stringify(data));

    $.ajax({
        type: "POST",
        url: url,
        data: data
    }).done(function(str) {
    alert('Data from php is:');
        alert(JSON.stringify(str));
        var result = JSON.parse(str);
        alert(result['variable1']);
        alert(result['variable2']);
    });
});
</script>

</body>
</html>

applynow.php：

<?php
class test() {
    public function applynow($job_id)
    {
        $result = [];
        $result['variable1'] = 'name is: ' . $_POST['namesss'];
        $result['variable2'] = 'email is: ' . $_POST['emails'];
        echo json_encode($result);
    }
}

$test = new test();
$test->applynow('1');

您会看到警报“ aaa”；所有作品

在您的真实代码中，您需要替换
$ this-> flash-> success（'test'）;回声“测试”；
并删除redirect（'apply'）;从PHP

在这个js中，您需要更改php脚本的路径