• 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
problems with ajax

#1
[eluser]dumbo[/eluser]
Hi, I'm new to CI as well as javascripts & AJAX. I have a noobie question about how to pass in a variable from the view's javascript and how to access it in the controller.

View's [removed]

Code:
var httpObj;
function checkName(username)
{
  httpObj = GetHttpObject();
  if(httpObj == null)
      {
          alert ("Browser does not support HTTP Request");
          return;
      }
  var url = <?php echo base_url().'index.php/addaccount/username_check';?>;
  url=url+"?q=" + username;
  url=url+"&sid;="+Math.random();
  httpObj.onreadystatechange=callback_account;
  httpObj.open("GET",url,true);
  httpObj.send(null);
}

function callback_account()
{
if (httpObj.readyState==4 || httpObj.readyState=="complete")
{
   alert(httpObj.responseText);
}
}


function GetHttpObject()
{
    var xmlHttp=null;
    try
     {
     // Firefox, Opera 8.0+, Safari
     xmlHttp=new XMLHttpRequest();
     }
    catch (e)
     {
     // Internet Explorer
     try
      {
      xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
      }
     catch (e)
      {
      xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
      }
     }
return xmlHttp;
}
[removed]
Controller's function:
Code:
function username_check()
   {
      echo($this->input->get('q'));
   }

So my question is can I actually pass in
Code:
"?q=" + username;
if I didn't activate query string in my config? If I can't, is there a way around this without using query strings?

My second question is how do I access that variable in controller after it's pass in?
Right now my username_check function returns blank.

Please let me know if there is anything unclear. Thanks.

#2
[eluser]Pascal Kriete[/eluser]
Without query strings enabled, the $_GET array gets destroyed, which is why you aren't getting any variables.

There are two choices:
a) use POST instead of GET
b) enable query strings and change your uri_protocol to something other than ALL or QUERY_STRING, this will not break CI's clean urls and allow you to use GET where necessary.

For a) you would then use $_POST['varname'] or $this->input->post('varname') to retrieve the variable
For b) you would use $_GET['varname'] or $this->input->get('varname')

There are disadvantages to both:
a) posting through an XMLHttpRequest is a two step process and thus slower (as per the yahoo performance rules)
b) cheap hosts often have trouble with the other options - if you have a good server it shouldn't be a problem though

If I may critique your javascript while I'm at it Smile , if you have a lot of js you might want to consider a javascript framework such as jQuery or YUI to ease some of your work.
Otherwise, you should consider wrapping your ajax function into a nice function/class. That would not only help avoid repetitive code, it also makes it easier to maintain.

Welcome to CodeIgniter.

#3
[eluser]Randy Casburn[/eluser]
Hi dumbo - (wow - I kinda like that name)

I use this very straight Ajax style in one of my applications too. Most of the time I'm using one of the JavaScript frameworks to help, but this works just fine too.

When I do, I use POST rather than get simply by changing this:

xmlhttp.open("POST",url,true);

Then you can simply retrieve your posted variables with $this->input->post->('username');

It's much more straight forward that way.

Let me know if you need more help.

Randy

[edit] Darn it all - that's twice today I've been too slow to respond! Thanks inparo ;-P

#4
[eluser]dumbo[/eluser]
Hi guys
Thanks for the feed back. Really appreciate it. I'll try out jQuery once I know what I'm doing Big Grin

I'm still having problem with the above example though, I switched the old code to post and did

Code:
httpObj.open("POST",url,true);

and this for controller (as well as 'username' instead of 'q')
Code:
echo $this->input->post('q');

However it's still returning blank. What am I doing wrong?

Thanks again

#5
[eluser]Randy Casburn[/eluser]
Sorry, Forgot to mention when you use the raw methods like this that the parameters must be sent specifically with the POST. Like so:

Code:
var parameters = "username=<?=$whatever_goes_here?>";
  xmlhttp.onreadystatechange=state_Change;
  xmlhttp.open("POST",url,true);
  xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  xmlhttp.setRequestHeader("Content-length", parameters.length);
  xmlhttp.setRequestHeader("Connection", "close");
  xmlhttp.send(parameters );

Note the way you construct your parameters is different here.

The headers must be sent, the parameter length is required, and the parameters must be put into the send method of the xmlhttp obj.

Should have mentioned that above. This is why we all use the JS frameworks. They obscure all the 'rawness'.

Try that and it should work.

#6
[eluser]Pascal Kriete[/eluser]
Actually , the content-length header is not required [rfc]. By eliminating it you can also eliminate the need for 'Connection: close', making the whole thing just that little bit shorter. :lol:
Code:
if (parameters) {
    xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
}
xmlhttp.send(parameters || null);

I still suggest wrapping it up nicely [example]. You only have to do it once, and then you can forget about it.

#7
[eluser]Randy Casburn[/eluser]
@dumbo - when inparo speaks JS, you'll find I'll usually defer to his advice. For instance, just blow off all this stuff and load up jQuery. Make your life easier from the start.

Over to you inparo Tongue

Randy

#8
[eluser]Randy Casburn[/eluser]
One other thing dumbo - there is always a better way to do something and always someone ready, willing, and able to point it out. We all take it in good humor. The proper way to do it, and the reason I respect inparo's responses, is to attribute the correctness with resources that point out the reasons just as he has done above.

Thanks inparo!

Randy

#9
[eluser]dumbo[/eluser]
Yea, I really appreciate the advice from both you and inparo. I will definitely try jQuery as well. Anyway, it works like a charm now. Thanks alot guys!

#10
[eluser]Pascal Kriete[/eluser]
Very much our pleasure.

Thank you as well, Randy, particularly for the kind words. Humor, particularly sarcasm, doesn't always translate well, but I think we do a pretty good job Smile .

~Pascal


Digg   Delicious   Reddit   Facebook   Twitter   StumbleUpon  


  Theme © 2014 iAndrew  
Powered By MyBB, © 2002-2021 MyBB Group.