EllisLab text mark
Advanced Search
1 of 2
1
   
using jquery ajax with codeigniter
Posted: 15 November 2012 09:35 AM   [ Ignore ]
Joined: 2012-11-15
11 posts

Hey I’m new to Codeigniter and I’m wondering why I’m having problems to combine codeigniter with jquery ajax form posts ..

this my form
test.php (views/test.php)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<
html>
<
head>
 
[removed][removed]

  [removed]
$(document).ready(function() {



  
$('#username').blur(function() {

    
var username = $("#username").val();
 var 
dataString 'username=' username;
  
  
alert(username);
  
 $.
ajax({
  type
"POST",
  
url"/index.php/ajax/username_taken",
  
datadataString,
  
success: function(msg
        
{
   
$("#status").html(msg);
  
}
  }
);
  
});  

});
  
  
</script>
</head>

<
body>


<
form action="" method="post">
 
username: <input type="text" id="username" /> <br /> 
</
form>
<
div id="status"></div>




</
body>
</
html

yeah I know I can user form helper, I’m just playing with it ...

and this is controller (controllers/ajax.php)

<?php

class Ajax extends CI_Controller {



  
public function username_taken()
  
{
    $this
->load->model('Login');
    
$username trim($_POST['username']);
    if (
$this->Login->login_check($username)) 
      echo 
"exists";
   else
 echo 
"not exists";
  
}

}

/* End of file ajax.php */
/* Location: ./system/application/controllers/ajax.php */
?> 

and this is the model, login.php (models/login.php)

<?php
class Login extends CI_Model {

 
 
function login_check($username)
 
{
  $this 
-> db -> select('id, username');
  
$this -> db -> from('users');
  
$this -> db -> where('username = ' "'" $username "'");
  
$this -> db -> limit(1);

  
$query $this -> db -> get();

  if(
$query -> num_rows() >= 1)
  
{
   
return true;
  
else
   return 
false;
 
}
}

?> 


now, I do getting the alerts with the username I’ve putted in, but I don’t get the result from the server side (exists / not exists) ... I wonder why, what I’m doing wrong.

thanks a lot for the help smile

 
Posted: 15 November 2012 09:51 AM   [ Ignore ]   [ # 1 ]   [ Rating: 0 ]
Joined: 2010-01-14
146 posts

What’s firebug show as the return value from your ajax call?

 
Posted: 15 November 2012 09:53 AM   [ Ignore ]   [ # 2 ]   [ Rating: 0 ]
Joined: 2012-11-15
11 posts

firebug = ?

if you mean what the result in the div area (where the result suppost to be posted) then its blank .. nothing

 
Posted: 15 November 2012 09:57 AM   [ Ignore ]   [ # 3 ]   [ Rating: 0 ]
Joined: 2010-01-14
146 posts

Does the request complete successfully? (watch the ajax request on the ‘Net’ tab)

 
Posted: 15 November 2012 09:57 AM   [ Ignore ]   [ # 4 ]   [ Rating: 0 ]
Joined: 2012-10-17
27 posts

If I were a gambling man, I would bet that the problem is the following line:

url: “/index.php/ajax/username_taken”

But if you can paste the client’s post and the server’s response we could help better.

 
Posted: 15 November 2012 09:59 AM   [ Ignore ]   [ # 5 ]   [ Rating: 0 ]
Joined: 2012-10-17
27 posts

Firebug is a priceless Firefox extension that makes troubleshooting ajax, as well as a plethora of other issues, extremely easy.

For instance, you can click into the Console tab, click on Persist and then refresh the webpage in question. You will then be able to see what the client is sending to the server, and how the server responds.

If you want to be a web developer, you need firebug. Period.

 
Posted: 15 November 2012 10:01 AM   [ Ignore ]   [ # 6 ]   [ Rating: 0 ]
Joined: 2012-11-15
11 posts

well I tried now to check it with an alert in the code,

success: function(msg
         
{
   alert(
"yes");
   $(
"#status").html(msg);
  

and the message doesnt come, then I guess the request doesnt get complete successfully ...
I’ve no idea whats the ‘Net’ tab is, if can be more specific it will be great.

benton.snyder - 15 November 2012 09:59 AM

Firebug is a priceless Firefox extension that makes troubleshooting ajax, as well as a plethora of other issues, extremely easy.

For instance, you can click into the Console tab, click on Persist and then refresh the webpage in question. You will then be able to see what the client is sending to the server, and how the server responds.

If you want to be a web developer, you need firebug. Period.

I’m using Chrome, there is something like this in Chrome browser ?
thanks =)

 
Posted: 15 November 2012 10:12 AM   [ Ignore ]   [ # 7 ]   [ Rating: 0 ]
Joined: 2010-01-14
146 posts

yah, but it’s not as good. You should look at Firebug.

In Chrome though, right click -> Inspect Element -> select the Network tab. That’ll show you all client/server requests. You can trigger your ajax request and see what happens there.

If you want to be a web developer, you need firebug. Period.

Yup, pretty much.

 
Posted: 15 November 2012 10:13 AM   [ Ignore ]   [ # 8 ]   [ Rating: 0 ]
Joined: 2012-11-15
11 posts

I guess you guys talked about this ?

http://i49.tinypic.com/14cxon4.jpg

then why am I getting 500 Internet Server error ?

 
Posted: 15 November 2012 10:14 AM   [ Ignore ]   [ # 9 ]   [ Rating: 0 ]
Joined: 2012-10-17
27 posts

Try changing the url: to the full url. It is likely failing because you are posting to a webpage that doesn’t exist and therefore won’t respond.

Chrome has a web developer’s extension installed by default that is pretty good. You can simply right-click on your webpage and left-click on Inspect Element. In the console tab you can watch the javascript requests, but it is not as detailed nor intuitive as Firebug. Personally, I browse with Chrome, but I develop with Firefox. Firebug really is invaluable for webdev.

 
Posted: 15 November 2012 10:17 AM   [ Ignore ]   [ # 10 ]   [ Rating: 0 ]
Joined: 2012-10-17
27 posts
$.ajax({
  type
"POST",
  
url"http://127.0.0.1/index.php/ajax/username_taken",
  
data{ username:username },
  
success: function(msg{
   
$("#status").html(msg);
  
}
}
); 
 
Posted: 15 November 2012 10:20 AM   [ Ignore ]   [ # 11 ]   [ Rating: 0 ]
Joined: 2010-01-14
146 posts
fatfishy - 15 November 2012 10:13 AM

I guess you guys talked about this ?

http://i49.tinypic.com/14cxon4.jpg

then why am I getting 500 Internet Server error ?

Because your CI code doesn’t work for some reason…

I’m wondering why you’re doing this:

$this -> db -> where('username = ' "'" $username "'"); 

When you could just…

$this -> db -> where('username'$username); 

If it were me, I’d try just hitting that controller method as a direct browser request and testing the results there. Turn on the profiler to display all of the queries being run and turn error reporting up.

In your controller…

$this->output->enable_profiler(TRUE); 
 
Posted: 15 November 2012 10:25 AM   [ Ignore ]   [ # 12 ]   [ Rating: 0 ]
Joined: 2012-11-15
11 posts

I tried to post the full url, as you’r code does .. but I still get
—Status Code:500 Internal Server Error—

but when I manually get into - http://127.0.0.1/index.php/ajax/username_taken
it works .. (gives an error, Message: Undefined index: username Filename: controllers/ajax.php which is ok ...) and printing “not exists” which is also ok,

what can cause the problem ? why the ajax cant rich the controller ?

thanks!

 
Posted: 15 November 2012 10:30 AM   [ Ignore ]   [ # 13 ]   [ Rating: 0 ]
Joined: 2012-11-15
2 posts

Try to use Input class library (http://ellislab.com/codeigniter/user-guide/libraries/input.html) and then get your username value directly in the model:

<?php
class Login extends CI_Model {

 
 
function login_check()
 
{
  $username 
$this->input->post('username');
  
$this -> db -> select('id, username');
  
$this -> db -> from('users');
  
$this -> db -> where('username = ' "'" $username "'");
  
$this -> db -> limit(1);

  
$query $this -> db -> get();

  if(
$query -> num_rows() >= 1)
  
{
   
return true;
  
else
   return 
false;
 
}
}

?> 

Bye

 
Posted: 15 November 2012 10:32 AM   [ Ignore ]   [ # 14 ]   [ Rating: 0 ]
Joined: 2012-11-15
11 posts
charly71 - 15 November 2012 10:30 AM

Try to use Input class library (http://ellislab.com/codeigniter/user-guide/libraries/input.html) and then get your username value directly in the model:

<?php
class Login extends CI_Model {

 
 
function login_check()
 
{
  
.....
 
}

?> 

Bye

huh? what it has to do with the ajax-request problem ?

 
Posted: 15 November 2012 10:35 AM   [ Ignore ]   [ # 15 ]   [ Rating: 0 ]
Joined: 2010-01-14
146 posts

huh? what it has to do with the ajax-request problem ?

Nothing…but it’s another example of your general lack of command of the CI framework. So you’re being offered input that will help to expand your toolset.

Have you tried using the FULL url in the jQuery .post method?

urlhttp://127.0.0.1/index.php/ajax/username_taken 
 
1 of 2
1