CODEWITHSUNDEEP
javascriptphpjqueryajaxcodeigniter
Aslam Kakkove
Aslam Kakkove

Reputation: 97

Jquery Ajax is not working with Codeigniter

I am a ajax beginner, Here I am trying to show a text box value in same page using Ajax.

My Controller code:

<?php
class Merchant extends CI_Controller
 {

    public function ajaxtest()
    { 

     $this->load->helper('url');
     $this->load->view('ajaxtest');
     $fullname = $this->input->post("fullname");
     echo $fullname;

    }
}
?>

Here is my view code:

<head>
 <script src="<?php echo base_url();?>assets/js/jquery-latest.min.js"></script>
<script type="text/javascript">
$(document).ready(function(){   

    $("#getinfo").click(function()
    {   

     $.ajax({
         type: "POST",
         url: "<?php echo base_url(); ?>merchant/ajaxtest",
         data: {textbox: $("#fullname").val()},
         dataType: "text",  
         cache:false,
         success: 
              function(data){                    
                $('#mytext').html(data);
              }
          });
     return false;
 });
 });

</script>
 </head>
 <body>
 <form method="post">
        <input  type="text" id="fullname"/>
        <input  type="button" value="getinfo" id="getinfo"/>      
      <span id="mytext"></span>
 </form>

 </body>

When I click on the button getinfo, I want to show the text inside the text box as span text. But now it shows nothing..

Updated:

After experts' opinion, I edited some text(see my edit note), Now When i click on the button, it shows again a textbox and a button.. !!

enter image description here

Upvotes: 2

Views: 7757

Answers (5)

Sudhir Bastakoti
Sudhir Bastakoti

Reputation: 100175

You are passing in textbox as parameter from your ajax to controller and trying to get POST data with name fullname. That won't work, since you passed in the name of parameter as textbox. Access that in your post as:

class Merchant extends CI_Controller
 {

    public function ajaxtest()
    { 
     $this->load->helper('url');
     //you dont need to load view so comment it
     //$this->load->view('ajaxtest');
     $fullname = $this->input->post("textbox"); //not fullname
     echo $fullname;
    }
}

js

<script type="text/javascript">
$(document).ready(function(){   
    var base_url='http://yourbaseurl.com/index.php/';
    $("#getinfo").click(function() {
    
    var fullname = $("#fullname").val();
    alert("Fullname:" + fullname); //do you get this alert   

     $.ajax({
         type: "POST",
         url: base_url + "merchant/ajaxtest", 
         data: {textbox: fullname},
         cache:false,
         success:function(data){
           alert("Response:" + data); //do you get this alert                 
           $('#mytext').html(data);
         }
     });
     return false;
 });
 });

</script>

Upvotes: 1

Ken
Ken

Reputation: 23

Might be a little late with this response - but someone might find this while searching for a solution. I was having the same issues with Codeigniter and JQuery ajax/post response. I could not get this to work no matter what I tried. In the end, it turned out to be php_error that was causing the problem. Once I removed it, everything worked fine with my post/response.

Upvotes: 0

NASEEM FASAL
NASEEM FASAL

Reputation: 429

Did you set the base_url variable with a link on the Javascript? Because your post url contains this variable and you need set this to make it work. So initialize the variable with the base_url link.

See the corrected example below . Set your domain instead of the yourbaseurl.com

<script type="text/javascript">
$(document).ready(function(){   
    var base_url='http://yourbaseurl.com/index.php/';
    $("#getinfo").click(function()
    {   

     $.ajax({
         type: "POST",
         url: base_url + "merchant/ajaxtest", 
         data: {textbox: $("#fullname").val()},
         dataType: "text",  
         cache:false,
         success: 
              function(data){                    
                $('#mytext').html(data);
              }
          });
     return false;
 });
 });

</script>

Upvotes: 4

Ahmad Baktash Hayeri
Ahmad Baktash Hayeri

Reputation: 5880

Your base_url variable seems to be undefined in your JavaScript.

One simple approach to get the base URL is to echo it out in a hidden input, and then grab the value of that input in your JS code:

HTML

<input type='hidden' id="baseUrl" value="<?php  echo base_url(); ?>" />

JS

var base_url = $('#baseUrl').val(); 


$.ajax({
     type: "POST",
     url: base_url + "/merchant/ajaxtest", 
     data: {textbox: $("#fullname").val()},
     dataType: "text",  
     // ...

Upvotes: 1

user5670408
user5670408

Reputation:

Try using this:

<base href="<?=base_url();?>">
<script src="assets/js/jquery-latest.min.js"></script>

And this in ajaxtest:

$this->load->helper('url');

And also Comment out this:

// $this->load->view('ajaxtest');

Upvotes: 0

Related Questions