CODEWITHSUNDEEP
ajaxcodeigniter
Pittz
Pittz

Reputation: 19

Ajax with codeIgniter

This is my view file index.php

    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html"; charset=Cp1252">
    <title>Demo Ajax</title>
    <script type ="text/javascript" src="<?php echo             base_url().'assets/js/jquery-1.4.2.js';?>"></script>
    <script type ="text/javascript">
    $(document).ready(function(){
        $('#bttHello').click(function(){
        var fullname = $('#fullname').val();
        alert(fullname);
        $.ajax({
            type:'POST',
            data:{fullname: fullname},
            url: '<?php echo site_url('ajax/hello');?>',
            success: function(result){
                $('#result1').html(result);
            }
          });
       });
    });
    </script>
    </head>
    <body>
    <form>
    Name <input type="text" id="fullname">
    <input type="button" value="Hello" id="bttHello">
    <br>
    <span id="#result1"></span>
    </form>
    </body>
    </html>

and this is my controller file ajax.php

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

class Ajax extends CI_Controller {

    public function index()
    {
        $this->load->view('index');
    }
    public function hello(){
        echo 'hiiiiiiii';
        $fullname = $this->input->post('fullname');
        echo 'Hello'.$fullname;
    }
}

But when i click submit button nothin happens no error is shown , i think it is not redirected to the url i have given in ajax code. Please help me out to get directed to the controller and then the function hello through ajax.

Upvotes: 0

Views: 321

Answers (1)

Putera Kahfi
Putera Kahfi

Reputation: 31

do you familiar with debugger tools ? if no, you need to debug it first to check the problem, you can use chrome developer tools (https://developer.chrome.com/devtools) or you can using firebug addons

then you can test again and see what happend with your jquery code in console

here an example steps how to use debug tools using chrome

  1. open your web using chrome
  2. using shortcut key (F12) to activated developer tools
  3. then test your application, if there is any error in your jquery/javascript code, the console will display it.

Hope this help you.

Upvotes: 1

Related Questions