AJAX search using dropdown troubles

[eluser]CI_Newb[/eluser]
I'm at my wits end on this so I need help.

What i have is a auto populated dropdown. Right below that dropdown is a textarea.

User selects an option from the dropdown and it populates the textarea with data from their selection.

I can get it to work using straight ajax requests but the issue im having is that the textarea in Internet Explorer doesn't have the formatting where Firefox does.

Example of textarea in Firefox

Code:

1
2
3

Example of textarea in Internet Explorer

Code:

1 2 3

Now I read that a possible reason is that IE doesn't handle large text over GET requests and suggested I use POST but I can't figure out how to modify the code i already have for POST so i'm trying to do this using CI which would use POST.

Here's what I have so far.

script on the same page as form fields are on

Code:

function showUser(str)
{
if (str=="")
  {
  document.getElementById('txtHint')[removed]="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById('txtHint')[removed]=xmlhttp.responseText;
    }
  }
xmlhttp.open("GET","http://mysite.com/site/assets/includes/get_template.php?q="+str,true);
xmlhttp.send();
}

get_template.php

Code:

<?php

$q=$_GET["q"];

$con = mysql_connect('localhost', 'username', 'password');
if (!$con)
  {
      die('Could not connect: ' . mysql_error());
  }

mysql_select_db("db", $con);

$sql="
SELECT template
FROM db_table
WHERE menu_id = '$q'
";

$result = mysql_query($sql);
$row = mysql_fetch_assoc($result);

$template = $row['template'];

print_r($template);

mysql_close($con);

?>

form fields

Code:

<?php
$js = 'id="coach_subject" onchange="showUser(this.value)"';
echo form_dropdown('coach_subject', $coaching_subject, set_value('coach_subject', '0'), $js);
?>

<textarea name="coach_details" id="txtHint" class="textareastyle" style="width:99%;" rows="18" ><?php echo set_value('coach_details');?></textarea>

HELP!!!

[eluser]CI_Newb[/eluser]
Did more looking and think this is how it should look, but yet, not working.

Code:

function showUser(str)
{
var xmlhttp;
if (str=="")
  {
  document.getElementById('txtHint')[removed]="";
  return;
  }
if (window.XMLHttpRequest)
  {// code for IE7+, Firefox, Chrome, Opera, Safari
  xmlhttp=new XMLHttpRequest();
  }
else
  {// code for IE6, IE5
  xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
  }
xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById('txtHint')[removed]=xmlhttp.responseText;
    }
  }
xmlhttp.open("POST","http://mysite.com/site/assets/includes/get_template.php",true);
xmlhttp.setRequestHeader("Content-type","application/x-www-form-urlencoded");
xmlhttp.send(str);
}

Changed the get_template to

Code:

$q = $_POST["str"];

Any ideas?

[eluser]CI_Newb[/eluser]
Well I got it working using POST and still no change.

Thing that gets me is that I have done this many times in my app and IE displays the data in textareas fine. Just when doing this?

Is it cause im not using active records? I've changed the mysql column type from text to blob and no difference.

Arg

[eluser]CI_Newb[/eluser]
I tried retrieving the data then formatting it.

Code:

$template = $row['template'];
$template = nl2br($template);
$template = str_replace('<br />', "\n", $template);

echo $template;

But it appears that IE just ignores any \n or <br /> in the text.