By using this site, you agree to our updated Privacy Policy and our Terms of Use. Manage your Cookies Settings.
435,098 Members | 1,918 Online
Bytes IT Community
+ Ask a Question
Need help? Post your question and get tips & solutions from a community of 435,098 IT Pros & Developers. It's quick & easy.

Two ajax functions on one page? mine are fighting!

P: 26
Hi guys,

Let me just introduce my problem - i hope someone will be able to help! I have an index page for my site where i want the user to have the choice to view a login form or registration form. I have index.php with two links ("Click to login", "Click to Register"). I want to use ajax so that the user can switch between the forms without having to load the page. At the moment i have the forms stored in seperate html pages and i want the revelvant page to fill itself into a div called "content", depending on what the user would like to see. Here is my code:

Expand|Select|Wrap|Line Numbers
  1. <html>
  2. <head>
  3. <script type="text/javascript" language="javascript">
  4. function registerRequest() {
  5.     var httpRequest;
  6.     var url="registration_form.php"
  7.  
  8.     if (window.XMLHttpRequest) { // Mozilla, Safari, ...
  9.         httpRequest = new XMLHttpRequest();
  10.         if (httpRequest.overrideMimeType) {
  11.             httpRequest.overrideMimeType('text/xml');
  12.             // See note below about this line
  13.         }
  14.     } else if (window.ActiveXObject) { // IE
  15.         try {
  16.             httpRequest = new ActiveXObject("Msxml2.XMLHTTP");
  17.         } catch (e) {
  18.             try {
  19.                 httpRequest = new ActiveXObject("Microsoft.XMLHTTP");
  20.             } catch (e) {
  21.             }
  22.         }
  23.     }
  24.  
  25.     if (!httpRequest) {
  26.         alert('Your browser does not support the features needed for this website');
  27.         return false;
  28.     }
  29.     httpRequest.onreadystatechange = function() {
  30.         if (httpRequest.readyState == 4) {
  31.             if (httpRequest.status == 200) {
  32.                 document.getElementById('content').innerHTML = httpRequest.responseText;
  33.             } else {
  34.                 alert('There was a problem with the site.');
  35.             }
  36.         }
  37.     };
  38.     httpRequest.open('GET', url, true);
  39.     httpRequest.send('');
  40.     httpRequest.close;
  41. }
  42. function loginRequest() {
  43.     var httpRequest2;
  44.     var url2="login_form.php"
  45.  
  46.     if (window.XMLHttpRequest) { // Mozilla, Safari, ...
  47.         httpRequest2 = new XMLHttpRequest();
  48.         if (httpRequest2.overrideMimeType) {
  49.             httpRequest2.overrideMimeType('text/xml');
  50.             // See note below about this line
  51.         }
  52.     } else if (window.ActiveXObject) { // IE
  53.         try {
  54.             httpRequest2 = new ActiveXObject("Msxml2.XMLHTTP");
  55.         } catch (e) {
  56.             try {
  57.                 httpRequest2 = new ActiveXObject("Microsoft.XMLHTTP");
  58.             } catch (e) {
  59.             }
  60.         }
  61.     }
  62.  
  63.     if (!httpRequest2) {
  64.         alert('Your browser does not support the features needed for this website');
  65.         return false;
  66.     }
  67.     httpRequest2.onreadystatechange = function() {
  68.         if (httpRequest2.readyState == 4) {
  69.             if (httpRequest2.status == 200) {
  70.                 document.getElementById('content').innerHTML = httpRequest2.responseText;
  71.             } else {
  72.                 alert('There was a problem with the site.');
  73.             }
  74.         }
  75.     };
  76.     httpRequest2.open('GET', url2, true);
  77.     httpRequest2.send('');
  78. }
  79. </script>
  80. </head>
  81. <link rel="stylesheet" type"text/css" href="css/style.css" />
  82. <body>
  83. <div id="choice">
  84. <table>
  85.     <tr>
  86.         <td><u><a onMouseUp="loginRequest()">Click to Login</a></u>
  87.         </td>
  88.     </tr>
  89.     <tr>
  90.         <td><u><a onMouseUp="registerRequest()">Click to Register</a></u>
  91.         </td>
  92.     </tr>
  93. </table>
  94. </div>
  95. <div id="cell">
  96. <div id="content">
  97. <?php include "login_form.php"; ?>
  98. </div>
  99. </div>
  100. </body>
In firefox only the registration link is working (or so it seems). In IE it is the same, although it tells me that there is an object expected on line 48 ("httpRequest2.overrideMimeType('text/xml')"). Is it ok to have two ajax function s on the same page, after all they shouldnt be both being used at the same time?

Thanks for your time guys.

Chris
Jan 14 '08 #1
Share this Question
Share on Google+
3 Replies


rpnew
100+
P: 188
hi,
There is nothing wrong with using two function on the same page.
I've used more than that with my project so i dont think its a problem. Your problem is somewhere else as i think......

Regards,
RP
Jan 14 '08 #2

P: 26
Thanks, i thought as much, i will keep trying to figure it out myself.
Jan 14 '08 #3

acoder
Expert Mod 15k+
P: 16,027
Why are you 'closing' the request on line 40?
Jan 14 '08 #4

Post your reply

Sign in to post your reply or Sign up for a free account.