We help IT Professionals succeed at work.

AJAX autocomplete NOT working in IE7

annapolistech
on
1,866 Views
Last Modified: 2013-12-08
Hi Experts,

I have a code for autocomplete in a html textfield when a user type a text in the textfield the possible text(names) will appear below this field, it is working  perfectly in IE6, but not in IE7.

Thanks in advance

Regards,
Sanjay
Comment
Watch Question

b0lsc0ttIT Manager
CERTIFIED EXPERT

Commented:
How about the code?  You can add some alerts to test to see if the problem is the object, the response or updating the page (or something else).

bol
b0lsc0ttIT Manager
CERTIFIED EXPERT

Commented:
Did you mean to close this or did you still need help with this question?  If you still have a question then let me know and I will be happy to help.  I will need more info to help you though.  If you did mean to close this then explain the C grade.  It isn't appropriate (see https://www.experts-exchange.com/help.jsp#hi73 for more info on grading).

bol

Author

Commented:
We need some more solution. we are not able to solve the problem with the solution which you have given us.

Thanks
b0lsc0ttIT Manager
CERTIFIED EXPERT

Commented:
I can't provide a solution without information.  Please provide code.  Also let me know if you get any javascript errors in IE7.  The "solution" I did mention was just a general suggestion but definitely not a solution.

bol

Author

Commented:
We figured out the way to make it work in IE7. There was no problem with the code.
We went to Tools->Internet options->Advanced->Security and unchecked "Enable native XMLHTTP support". Since we can't ask user to do this every time, how do we do it programmatically.

Thanks
b0lsc0ttIT Manager
CERTIFIED EXPERT

Commented:
You won't be able to check that box using Javascript or any other client-side script.  However if you will provide the code (3rd request), especially the part with the AJAX script, then I might be able to provide a solution so the box won't need to be checked.

bol

Author

Commented:
Hi Bol,

I am posting the AJAX script, hope this will help you detect my problem.

<script type="text/javascript">

var isIE;
var completeTable;
var completeField;
var autorow;
var req;


function getElementY(element){
      var targetTop = 0;
      if (element.offsetParent) {
            while (element.offsetParent) {
                  targetTop += element.offsetTop;
            element = element.offsetParent;
            }
      } else if (element.y) {
            targetTop += element.y;
    }
      return targetTop;
}

function init() {
    completeField = document.getElementById("complete-field");
    var menu = document.getElementById("auto-row");
    autorow = document.getElementById("menu-popup");
    autorow.style.top = getElementY(menu) + "px";
    completeTable = document.getElementById("completeTable");
    completeTable.setAttribute("bordercolor", "white");
}

function initRequest(url) {
    if (window.XMLHttpRequest) {
        return new XMLHttpRequest();
    } else if (window.ActiveXObject) {
        isIE = true;
        return new ActiveXObject("Microsoft.XMLHTTP");
    }
}


function doCompletion() {
    if (completeField.value == "") {
        clearTable();
    } else {
        var url = "autocomplete?action=complete&id=" + escape(completeField.value);
        var req = initRequest(url);
        req.onreadystatechange = function() {
            if (req.readyState == 4) {
                if (req.status == 200) {
                    parseMessages(req.responseXML);
                } else if (req.status == 204){
                    clearTable();
                }
            }
        };
        req.open("GET", url, true);
        req.send(null);
    }
}

function parseMessages(responseXML) {
    clearTable();
      var employees = responseXML.getElementsByTagName("employees")[0];
    if (employees.childNodes.length > 0) {
        //completeTable.setAttribute("bordercolor", "black");
        //completeTable.setAttribute("border", "1");
    } else {
        clearTable();
    }
   
    for (loop = 0; loop < employees.childNodes.length; loop++) {
          var employee = employees.childNodes[loop];
        var firstName = employee.getElementsByTagName("firstName")[0];
        //var lastName = employee.getElementsByTagName("lastName")[0];
        var employeeId = employee.getElementsByTagName("id")[0];
        appendEmployee(firstName.childNodes[0].nodeValue, employeeId.childNodes[0].nodeValue);
    }
}

function clearTable() {
    if (completeTable) {
      completeTable.setAttribute("bordercolor", "white");
      completeTable.setAttribute("border", "0");
      completeTable.style.visible = false;
      for (loop = completeTable.childNodes.length -1; loop >= 0 ; loop--) {
        completeTable.removeChild(completeTable.childNodes[loop]);
      }
    }
}

function appendEmployee(firstName,employeeId) {
    var firstNameCell;
    var lastNameCell;
    var row;
    var nameCell;
    if (isIE) {
        row = completeTable.insertRow(completeTable.rows.length);
        nameCell = row.insertCell(0);
    } else {
        row = document.createElement("tr");
        nameCell = document.createElement("td");
        row.appendChild(nameCell);
        completeTable.appendChild(row);
    }
    row.className = "popupRow";
    nameCell.setAttribute("bgcolor", "#FFFAFA");

   
    var linkElement = document.createElement("a");
    linkElement.className = "popupItem";
    linkElement.setAttribute("href", "autocomplete?action=lookup&id=" + employeeId);
    linkElement.appendChild(document.createTextNode(firstName));
    nameCell.appendChild(linkElement);
}
</script>

Thanks,
Sanjay
IT Manager
CERTIFIED EXPERT
Commented:
This one is on us!
(Get your first solution completely free - no credit card required)
UNLOCK SOLUTION

Commented:
Hi Bol,

Also having the same problems getting this to example to work in IE7...it works fine in Firefox, IE6 but not IE7.  I added the alerts that you suggested and I get back 'undefined' for isIE which is expected.  For the next alert I get back [object] and that is it.  Any ideas?
b0lsc0ttIT Manager
CERTIFIED EXPERT

Commented:
@Nickn777 - Feel free to continue to monitor this but if you want direct help then, as Vee_Mod said, you really should open a new question.  I don't mind if you post the URL of that question here to draw my attention to it if you wish.  I was holding off on testing IE7 myself to see what Annapolistech's response would be but I will take some time to look at it now.

Annapolistech,

If you do use my suggestion and get the same result then try using the line below for the second alert.

                alert(req.xml);

Let me know the results of that too.  It has been a while since I have looked at this and I will wait for your reply before spending more time on the specifics here.

bol
b0lsc0ttIT Manager
CERTIFIED EXPERT

Commented:
I tested one of my more common AJAX pages that deals with xml and it works fine in IE7 with or without "Enable native XMLHTTP support" checked.  That means a problem is related to the script and not a general lack of support in IE7 for AJAX.  This confirms what I thought but I wanted to test and post the result after Nickn777's comment.

bol
b0lsc0ttIT Manager
CERTIFIED EXPERT

Commented:
annapolistech,

Any particular reason your participation here is limited to assigning a B grade?  Even after the first offense I tried to help in good faith that you would appreciate and recognize it.  I guess I shouldn't be surprised when I see your question history but you won't get good help if you aren't a good and considerate member.

@Vee_Mod - Please correct the grade or take whatever administrative action you feel appropriate.  Thanks!

bol
b0lsc0ttIT Manager
CERTIFIED EXPERT

Commented:
V,

Thanks!

bol

Gain unlimited access to on-demand training courses with an Experts Exchange subscription.

Get Access
Why Experts Exchange?

Experts Exchange always has the answer, or at the least points me in the correct direction! It is like having another employee that is extremely experienced.

Jim Murphy
Programmer at Smart IT Solutions

When asked, what has been your best career decision?

Deciding to stick with EE.

Mohamed Asif
Technical Department Head

Being involved with EE helped me to grow personally and professionally.

Carl Webster
CTP, Sr Infrastructure Consultant
Empower Your Career
Did You Know?

We've partnered with two important charities to provide clean water and computer science education to those who need it most. READ MORE

Ask ANY Question

Connect with Certified Experts to gain insight and support on specific technology challenges including:

  • Troubleshooting
  • Research
  • Professional Opinions
Unlock the solution to this question.
Join our community and discover your potential

Experts Exchange is the only place where you can interact directly with leading experts in the technology field. Become a member today and access the collective knowledge of thousands of technology experts.

*This site is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.

OR

Please enter a first name

Please enter a last name

8+ characters (letters, numbers, and a symbol)

By clicking, you agree to the Terms of Use and Privacy Policy.