1

I'm using jQuery and CodeIgniter to do this. Ok so basically I have a register form which asks the user for a username, password, and email. Once the form is submitted, jQuery would serialize the form and give it to a process page, echo the value out in the controller, and then the javascript would alert the post values in the original view. So far it isn't working. Nothing is being alerted. Here's my code:

(The controller) register.php:

    <?php if (!defined('BASEPATH'))
        exit('No direct script access allowed');

    class Register extends CI_Controller
    {
        public function step1()
        {
        $this->load->view('registration_step1');
        }
        public function step1_process(){
        var_dump($_POST);
        }
        public function step2()
        {
        $this->load->view('registration_step2');
        }
        public function step3()
        {
        $this->load->view('registration_step3');
        }
    }

(Portion of the view) registration_step1.php:

        <form style="margin-top: 100px;" class="registerbox">
        <h2>User Info:</h2>
        <input type="text" name="username" placeholder="Username" style="height:35px; width: 300px;font-size:20px;"/> <br />
        <input type="text" name="email" placeholder="Email" style="height:35px; width: 300px;font-size:20px;"/><br />
        <input type="password" name="password" placeholder="Password" style="height:35px; width: 300px;font-size:20px;"/><br />
        <input type="submit" class="btn btn-success" style="height:35px; width: 310px;font-size:20px;margin-bottom:5px;" value="Next &raquo;"/><br />
        </form>

(javascript) registration.js:

     $(document).ready(function() {
        $(".registerbox").submit(function() { 
              var userinfo = $(".registerbox").serialize();
              return false;
               $.post("register/step1_process", {
               userinfo : userinfo
              },
            function(data) {
                alert(data);
            });
        });
     });
Mico Abrina
  • 507
  • 1
  • 7
  • 25

2 Answers2

1

In your html markup, somewhere in <head>, you should put something like:

<script type="text/javascript">
    var base_url = '<?php echo base_url(); ?>';
</script>

Then in your registration.js, change your url and do post before return:

$(document).ready(function() {
    $(".registerbox").submit(function() { 
        var userinfo = $(".registerbox").serialize();
        $.post(base_url + "register/step1_process", {
            userinfo : userinfo
        }, function(data) {
            console.log(data);
        });
        return false;
    });
});
Rocco
  • 1,087
  • 12
  • 21
0

you just need to change your post url to:

'your-controller/your-function'

in your case it would be:

'register/step1'

you also need to change how you are sending the data. jquery expects a 'data' object. So the full post should be.

    $.post("register/step1", {
           data : userinfo
          },
        function(data) {
            alert(data);
        });

more info on jQuery post: http://api.jquery.com/jQuery.post/

laymanje
  • 833
  • 5
  • 9
  • Didn't work. Firstly, I want to post it to a process page and not the registration controller itself. Secondly, don't you have to name it userinfo : userinfo in order to pass a $userinfo variable into php? – Mico Abrina Jun 07 '12 at 15:31