php Codeigniter and jquery ajax

Question

I want to call the codeigniter controller with ajax after the login. But when I execute it, the login page is only refreshed and ajax url isn't calling controller function of codeigniter.

I don't understand what happened. Please help?

Below is my code

function ValidateReg() {

        var username = document.getElementById("inputName").value;
        var password = document.getElementById("inputPassword").value;
    $.post("<?php echo site_url('Panel/login') ?>", {checkUser: username, checkPassword: password, action: "validateUser"},
        function (data) {
            var result = data + "";
            if (result.lastIndexOf("Success" > -1)) {
                $.ajax({
                    url: "<?php echo site_url('Dashboard/state'); ?>",
                    type: 'POST',
                    complete: function (done) {
                        console.log("Finished.")
                    }
                });
            }
        });
}

Here Panel and Dashboard are my two different Controllers

It depends on how you are handling login click event. Show us the entire click event code please. — Alok Patel
– Alok Patel, Commented Jun 28, 2016 at 12:24
Please show us that code, handling click event. That might help us to solve. — Alok Patel
– Alok Patel, Commented Jun 28, 2016 at 12:29
<button type="submit" class="btn button text-uppercase" onclick="ValidateReg();">Login </button> — Apurva Matey
– Apurva Matey, Commented Jun 28, 2016 at 12:34

Alok Patel · Accepted Answer · 2016-06-28 12:39:21Z

1

It gets refreshed because it's a submit button and it must be inside form. So it submits the form on click event.

What you need to do is make your function to return false on click of the button so that page doesn't get refreshed.

Update your HTML like this,

<button type="submit" class="btn button text-uppercase" onclick="return ValidateReg();">Login </button>

And your JS function would look something like this:

function ValidateReg() {

        var username = document.getElementById("inputName").value;
        var password = document.getElementById("inputPassword").value;
        $.post("<?php echo site_url('Panel/login') ?>", {checkUser: username, checkPassword: password, action: "validateUser"},
        function (data) {
            var result = data + "";
            if (result.lastIndexOf("Success" > -1)) {
                $.ajax({
                    url: "<?php echo site_url('Dashboard/state'); ?>",
                    type: 'POST',
                    complete: function (done) {
                        console.log("Finished.")
                    }
                });
            }
        });
        return false;
}

answered Jun 28, 2016 at 12:39

Alok Patel

8,0726 gold badges35 silver badges48 bronze badges

Sign up to request clarification or add additional context in comments.

2 Comments

Sonu Bamniya Over a year ago

And how would you use asynchronous method as part of ValidateReg()

Alok Patel Over a year ago

asynchronous methods doesn't get affected with this code.

DFriend · Accepted Answer · 2016-06-28 12:45:25Z

0

If what you want to do is go to the page Dashboard/state then using ajax is the wrong approach. You need to redirect to that page instead.

$.post("<?php echo site_url('Panel/login') ?>", {checkUser: username, checkPassword: password, action: "validateUser"},
  function (data) {
    var result = data + "";
    if (result.lastIndexOf("Success" > -1))
    {
      console.log("Finished.");
      window.location = "<?php echo site_url('Dashboard/state'); ?>";
    }
  }
);

The other way to redirect with javascript would be done like this

window.location.replace("<?php echo site_url('Dashboard/state'); ?>");

which is probably better because it does not keep the originating page in the session history.

edited Jun 28, 2016 at 12:45

answered Jun 28, 2016 at 12:40

DFriend

8,9741 gold badge16 silver badges26 bronze badges

1 Comment

Apurva Matey Over a year ago

It Works. Thank you.

Arun Tyagi · Accepted Answer · 2016-06-29 10:28:15Z

0

function ValidateReg() {

    var username = document.getElementById("inputName").value;
    var password = document.getElementById("inputPassword").value;
    $.post("<?php echo site_url('Panel/login') ?>", {checkUser: username, checkPassword: password, action: "validateUser"},
    function (data) {
        var result = data + "";
        if (result.lastIndexOf("Success" > -1)) {
            $.ajax({
                url: "<?php echo site_url('Dashboard/state'); ?>",
                type: 'POST',
                success: function (done) {
                    console.log("Finished.")
                }
            });
        }
    });
    return false;

}

answered Jun 29, 2016 at 10:28

Arun Tyagi

312 bronze badges

Collectives™ on Stack Overflow

php Codeigniter and jquery ajax

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

2 Comments

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related