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

problem while calling two pages which includes Js pages

100+
P: 254
Hi

I am calling two pages using Ajax Get_Pages.php and Get_Content.php from combo box. Both pages are displayed based on selection from combo box.

Main problem is that it is not showing the editor which is called on the Get_Content.php. in Main Page.

I have included the js files in the head section.

all the files are on the same directory.

But when I am running the Get_Content.php it is showing the Editors so what is the problem

Please help me out.

I have given the codes for the pages.
Main Page which is calling the JS Page.
Expand|Select|Wrap|Line Numbers
  1. <head>
  2. <script src="Get_Page.js" type="text/javascript"></script>
  3. </head>
  4. <body>
  5. <form action="insertimage.php" method="post" enctype="multipart/form-data">
  6. <table><tr>
  7.  <td valign="middle">Page Type</td>
  8.             <td align="left" valign="bottom"><select name="Page_Type" onchange="getPage(this.value)">
  9.               <option>--Select One--</option>
  10.               <option value="image">Image</option>
  11.               <option value="content">Text</option>
  12. </td></tr>></table>
  13. </form>
  14. </body>

Expand|Select|Wrap|Line Numbers
  1. //js page
  2.  
  3. var xmlHttp
  4. function getPage(str)
  5.  
  6.     xmlHttp=GetXmlHttpObject()
  7.     if (xmlHttp==null)
  8.      {
  9.          alert ("Browser does not support HTTP Request");
  10.          return;
  11.      }
  12.      var image="image";
  13.     if(str==image)
  14.     {
  15.     var url="Get_Page.php";
  16.     url=url+"?q="+str;
  17.     url=url+"&sid="+Math.random();
  18.     xmlHttp.onreadystatechange=stateChanged ;
  19.     xmlHttp.open("GET",url,true);
  20.     xmlHttp.send(null);
  21.     }
  22.     else
  23.     {
  24.     var url="Get_Content.php";
  25.     url=url+"?q="+str;
  26.     url=url+"&sid="+Math.random();
  27.     xmlHttp.onreadystatechange=stateChanged ;
  28.     xmlHttp.open("GET",url,true);
  29.     xmlHttp.send(null);
  30.     }
  31.  
  32. }
  33. function stateChanged() 
  34.     if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
  35.      { 
  36.          document.getElementById("txtHint").innerHTML=xmlHttp.responseText 
  37.      } 
  38. }
  39. function GetXmlHttpObject()
  40. {
  41.     var xmlHttp=null;
  42.     try
  43.      {
  44.          xmlHttp=new XMLHttpRequest();
  45.      }
  46.     catch (e)
  47.      {
  48.          try
  49.           {
  50.               xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  51.           }
  52.          catch (e)
  53.           {
  54.               xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  55.           }
  56.       }
  57.     return xmlHttp;
  58. }
  59.  
Expand|Select|Wrap|Line Numbers
  1. //Get_Page.php
  2. <table>
  3. <tr valign="bottom">
  4.         <td width="20%" align="left" valign="middle">Caption1</td>
  5.         <td width="17%" align="left" valign="middle"><input name="Image_Name1" type="text" id="Image_Name" value="" size="15" /></td>
  6.         <td width="18%" align="center" valign="middle">File1: </td>
  7.         <td width="45%" align="left" valign="middle"><input name="File1" type="file" id="File1" value="" size="15" /></td>
  8.       </tr>
  9. <tr>
  10.         <td height="26" align="left" valign="middle">&nbsp;</td>
  11.         <td height="26" colspan="2" align="left" valign="bottom"><input type="submit" name="Upload" value="Upload"/>
  12.             <input type="reset" name="Reset" /></td>
  13.       </tr>
  14. </table>
  15.  
Expand|Select|Wrap|Line Numbers
  1. //Get_Content.php
  2.  
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  5. <script language="javascript" src="wysiwyg.js"></script>
  6. <title>Untitled Document</title>
  7. </head>
  8. <body>
  9.  
  10.     <table width="97%" border="0" align="center" cellpadding="0" cellspacing="0">
  11.       <tr align="left">
  12.         <td width="14%" align="left" valign="middle">&nbsp;&nbsp;&nbsp;&nbsp;Content Id </td>
  13.         <td width="86%" valign="middle"><input type="text" name="Content_Id" value="" /></td>
  14.       </tr>
  15.       <tr align="left">
  16.         <td align="center" valign="middle">Content Name </td>
  17.         <td valign="middle"><input type="text" name="Content_Name" value="" /></td>
  18.       </tr>
  19.       <tr align="left">
  20.         <td align="left" valign="top">&nbsp;&nbsp;Description</td>
  21.         <td valign="middle"><textarea id="textarea2" name="Content_Description" style="height: 200px; width: 500px;">
  22.  
  23.           </textarea>
  24.              <script language="javascript1.2">
  25.                   generate_wysiwyg('textarea2');
  26.             </script> </td>
  27.       </tr>
  28.       <tr align="left">
  29.         <td valign="middle">&nbsp;</td>
  30.         <td valign="middle"><input type="submit" name="Content" value="Add Content" />
  31.           <input name="reset" type="reset" /></td>
  32.       </tr>
  33. </table>
  34. </body>
  35. // end of page.
Now Problem is that code works fine but it is not showing the editor which is included through wysiwyg.js when I am calling it from main page.

But when I am running the Get_Content.php it shows the editor.

so is there any thing that I can not call Series of Js pages. If it is then how can I do it.
Dec 18 '07 #1
Share this Question
Share on Google+
47 Replies


acoder
Expert Mod 15k+
P: 16,027
Now Problem is that code works fine but it is not showing the editor which is included through wysiwyg.js when I am calling it from main page.

But when I am running the Get_Content.php it shows the editor.

so is there any thing that I can not call Series of Js pages. If it is then how can I do it.
You'll need to include the JavaScript file. Create a script object and add it to the head of the main page.
Dec 18 '07 #2

100+
P: 254
You'll need to include the JavaScript file. Create a script object and add it to the head of the main page.
But I have added the Get_Page.js to the head of main page. And how a script object will be created?
Dec 19 '07 #3

acoder
Expert Mod 15k+
P: 16,027
But I have added the Get_Page.js to the head of main page. And how a script object will be created?
Create a script element and set the src property to the js file and then append to the head, e.g.
Expand|Select|Wrap|Line Numbers
  1. var script = document.createElement("script");
  2. script.src=theSrc; // string containing path to the JavaScript file
  3. document.getElementsByTagName("head")[0].appendChild(script);
Dec 20 '07 #4

100+
P: 254
I have main form. In that form I have a dropdown box from that box I am calling two pages using ajax and page call is fired on onchange event of dropdown box.

both pages are called if there is no javacript written on either page. But when I write some javascript code the javascript is not working on main form. so what can be problem.
Dec 27 '07 #5

gits
Expert Mod 5K+
P: 5,352
... please post the code to have a look at ...

kind regards
Dec 27 '07 #6

100+
P: 254
... please post the code to have a look at ...

kind regards
Hi

I tried to put some code here but it is showing some error. So what I mean to ask is that if a page has javascript function or calls to some js page so will the functionality of javascript/js page on this page be not reflected to the main page?
If no then why it is not working here

Say you have one main page which call a js page through ajax and in turn that page calls other js page so the functionality of this page will be work on main page or not.
Dec 27 '07 #7

gits
Expert Mod 5K+
P: 5,352
nope ... in case you call a page through ajax the scripts in there are not evaluated except you do that explicitly ... so without having a look at the code or at least the response i only could guess the problem ...

kind regards
Dec 27 '07 #8

acoder
Expert Mod 15k+
P: 16,027
Merged your threads. Keep one problem to one thread.

See post #4.
Dec 27 '07 #9

100+
P: 254
nope ... in case you call a page through ajax the scripts in there are not evaluated except you do that explicitly ... so without having a look at the code or at least the response i only could guess the problem ...

kind regards

See the post #4 for your reference.
Jan 7 '08 #10

100+
P: 254
Create a script element and set the src property to the js file and then append to the head, e.g.
Expand|Select|Wrap|Line Numbers
  1. var script = document.createElement("script");
  2. script.src=theSrc; // string containing path to the JavaScript file
  3. document.getElementsByTagName("head")[0].appendChild(script);

Hi Acoder

I am not able to solve this problem. So If you can please tell me where I should put this code. Or If you may guide where should do the modification in this code to work this fine.

Thanks!
Jan 7 '08 #11

acoder
Expert Mod 15k+
P: 16,027
theSrc in this case would be "wysiwyg.js".
Jan 7 '08 #12

gits
Expert Mod 5K+
P: 5,352
as i said ... when the page is loaded and js is added later on ... this code has to be evaluated explicitly ...

for example - this will not work:

Expand|Select|Wrap|Line Numbers
  1. var script = document.createElement("script");
  2. script.src = 'function my_func() { alert("test"); }';
  3. document.getElementsByTagName("head")[0].appendChild(script);
  4.  
  5. // call my_func - my_func is undefined
  6. my_func();
  7.  
but the following will work:

Expand|Select|Wrap|Line Numbers
  1. var script = document.createElement("script");
  2. script.src = eval('function my_func() { alert("test"); }');
  3. document.getElementsByTagName("head")[0].appendChild(script);
  4.  
  5. // now my_func is ready to use
  6. my_func();
and even:

Expand|Select|Wrap|Line Numbers
  1. eval('function my_func() { alert("test"); }');
  2.  
would be enough :) so when getting scripts through ajax the code has to be evaled ... the same way as json has to be evaled ...

kind regards
Jan 7 '08 #13

100+
P: 254
theSrc in this case would be "wysiwyg.js".

Hi I tried to put the code in this way:
Expand|Select|Wrap|Line Numbers
  1.  //  Main Page
  2.  
  3. <html>
  4. <head>
  5. <script type="text/javascript" src="Get_Page.js"></script>
  6. <title>Untitled Document</title>
  7. </head>
  8.  
  9. <body>
  10. <select id="attachMoreLink" name="select" onchange="getPage(this.value)">
  11.               <option selected="selected">--Select One--</option>
  12.               <option value="image">Image</option>
  13.               <option value="content">Text</option>
  14.  
  15.             </select>
  16.             <div id="txtHint"> text will be displayed here</div>
  17. </body>
  18. </html>
  19.  
//Page which to be called i.e. content.php


Expand|Select|Wrap|Line Numbers
  1.  
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  5. <script language="javascript">
  6. var script = document.createElement("script");
  7. script.src="wysiwyg.js"; // string containing path to the JavaScript file
  8. document.getElementsByTagName("head")[0].appendChild(script);
  9. </script>
  10. <title>Untitled Document</title>
  11. </head>
  12.  
  13. <body>
  14. <table width="97%" border="0" align="center" cellpadding="0" cellspacing="0">
  15.       <tr align="left">
  16.         <td width="14%" align="left" valign="middle">Content Id </td>
  17.         <td width="86%" valign="middle"><input type="text" name="Content_Id" value="" /></td>
  18.       </tr>
  19.       <tr align="left">
  20.         <td valign="middle" align="left">Content Name </td>
  21.         <td valign="middle"><input type="text" name="Content_Name" value="" /></td>
  22.       </tr>
  23.       <tr align="left">
  24.         <td align="left" valign="top">Description</td>
  25.         <td valign="middle"><textarea id="textarea2" name="Content_Description" style="height: 200px; width: 500px;">
  26.  
  27.           </textarea>
  28.              <script language="javascript1.2">
  29.                   generate_wysiwyg('textarea2');
  30.             </script> </td>
  31.       </tr>
  32.       <tr align="left">
  33.         <td valign="middle">&nbsp;</td>
  34.         <td valign="middle"><input type="submit" name="Content" value="Add Content" />
  35.           <input name="reset" type="reset" /></td>
  36.       </tr>
  37. </table>
  38. </body>
  39. </html>
  40.  
  41.  
Note: Get_Page.Js page calls content.php in which the editor(wysiwyg.js) is used.

I think I must Hit my head to the Pole now !
Jan 7 '08 #14

acoder
Expert Mod 15k+
P: 16,027
Hi I tried to put the code in this way:
Expand|Select|Wrap|Line Numbers
  1.  //  Main Page
  2.  
  3. <html>
  4. <head>
  5. <script type="text/javascript" src="Get_Page.js"></script>
  6. <title>Untitled Document</title>
  7. </head>
  8.  
  9. <body>
  10. <select id="attachMoreLink" name="select" onchange="getPage(this.value)">
  11.               <option selected="selected">--Select One--</option>
  12.               <option value="image">Image</option>
  13.               <option value="content">Text</option>
  14.  
  15.             </select>
  16.             <div id="txtHint"> text will be displayed here</div>
  17. </body>
  18. </html>
  19.  
//Page which to be called i.e. content.php


Expand|Select|Wrap|Line Numbers
  1.  
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  5. <script language="javascript">
  6. var script = document.createElement("script");
  7. script.src="wysiwyg.js"; // string containing path to the JavaScript file
  8. document.getElementsByTagName("head")[0].appendChild(script);
  9. </script>...
The JavaScript which adds the script to the page should be in the original page, not in the called page.
Jan 7 '08 #15

100+
P: 254
The JavaScript which adds the script to the page should be in the original page, not in the called page.
Hi
Thanks for your kind guidance, one more thing I want to ask, what about the function which is in the wysiwyg.js page which actually do the things where I should put this code means in the content.html where textarea control is or in the main page where script object is created for wysiwyg.js page.

Expand|Select|Wrap|Line Numbers
  1. <script language="javascript1.2">
  2.  generate_wysiwyg('textarea2');
  3. </script>
  4.  
Thanks!
Jan 8 '08 #16

acoder
Expert Mod 15k+
P: 16,027
Hi
Thanks for your kind guidance, one more thing I want to ask, what about the function which is in the wysiwyg.js page which actually do the things where I should put this code means in the content.html where textarea control is or in the main page where script object is created for wysiwyg.js page.
I see that you're calling the generate... function after the textarea with its ID. Does it matter where this function is called as long as it's after the textarea? If it doesn't matter, you can just append it to the body:
Expand|Select|Wrap|Line Numbers
  1. var script2 = document.createElement("script");
  2. var code = document.createTextNode("generate_wysiwyg('textarea2');");
  3. script2.appendChild(code);
  4. document.body.appendChild(script2);
Jan 8 '08 #17

100+
P: 254
I see that you're calling the generate... function after the textarea with its ID. Does it matter where this function is called as long as it's after the textarea? If it doesn't matter, you can just append it to the body:
Expand|Select|Wrap|Line Numbers
  1. var script2 = document.createElement("script");
  2. var code = document.createTextNode("generate_wysiwyg('textarea2');");
  3. script2.appendChild(code);
  4. document.body.appendChild(script2);
Hi

I tried this code and put this code firstly on the caller page's body i.e. main page and then on the called page's body but still no result found. Don't know where I am wrong?
Jan 11 '08 #18

acoder
Expert Mod 15k+
P: 16,027
It should be on the main page after textarea2 has been added to the page.
Jan 11 '08 #19

100+
P: 254
It should be on the main page after textarea2 has been added to the page.
Hi

I tried to alert the code=documen.createText....to get to know whether this function is getting the textarea2 but it is showing only object in alert message. So if textarea2 is not coming to the function how it will execute the editor.
Jan 11 '08 #20

acoder
Expert Mod 15k+
P: 16,027
Hi

I tried to alert the code=documen.createText....to get to know whether this function is getting the textarea2 but it is showing only object in alert message. So if textarea2 is not coming to the function how it will execute the editor.
document.createTextNode() just creates a text node. appendChild adds it to the page. When the textarea has been added to the page via Ajax, then put this code after it. Note that this means that you will need to modify the PHP page. If you can't modify the page, you will need to parse the page to just get the HTML body for display and the JavaScript has to be added as I have described earlier.
Jan 11 '08 #21

100+
P: 254
document.createTextNode() just creates a text node. appendChild adds it to the page. When the textarea has been added to the page via Ajax, then put this code after it. Note that this means that you will need to modify the PHP page. If you can't modify the page, you will need to parse the page to just get the HTML body for display and the JavaScript has to be added as I have described earlier.
Hi

I am not able to do it. So if you may please help me out by modifying the code where it is necessary. I will be highle obliged to you. I know I must not say to you to write code but I think now I have messed up with the things. So please help me!

Thanks.
Jan 17 '08 #22

acoder
Expert Mod 15k+
P: 16,027
I am not able to do it. So if you may please help me out by modifying the code where it is necessary. I will be highle obliged to you. I know I must not say to you to write code but I think now I have messed up with the things. So please help me!
Show your latest version of the code.
Jan 17 '08 #23

100+
P: 254
Show your latest version of the code.
Hi

Here is the code. First one is ajax.html which calls Get_Page.js where string is compared and the page is loaded i.e. content.html. Now friend please help me out.

Expand|Select|Wrap|Line Numbers
  1.  
  2.  
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <script type="text/javascript" src="Get_Page.js"></script>
  6. <script language="javascript">
  7.  
  8. var script = document.createElement("script");
  9. script.src = "wysiwyg.js"; 
  10. document.getElementsByTagName("head")[0].appendChild(script);
  11. </script>
  12. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  13. <title>Untitled Document</title>
  14. </head>
  15.  
  16. <body>
  17. <script language="javascript">
  18. var script2 = document.createElement("script");
  19.  
  20. var code = document.createTextNode("generate_wysiwyg('textarea2');");
  21. script2.appendChild(code);
  22. document.body.appendChild(script2);
  23. </script>
  24. <select id="attachMoreLink" name="select" onchange="getPage(this.value)">
  25.               <option selected="selected">--Select One--</option>
  26.               <option value="image">Image</option>
  27.               <option value="content">Text</option>
  28.  
  29.             </select>
  30.             <div id="txtHint"> text will be displayed here</div>
  31. </body>
  32. </html>

//Get_Page.js

Expand|Select|Wrap|Line Numbers
  1.  
  2. var xmlHttp
  3. function getPage(str)
  4.  
  5.     xmlHttp=GetXmlHttpObject()
  6.     if (xmlHttp==null)
  7.      {
  8.          alert ("Browser does not support HTTP Request");
  9.          return;
  10.      }
  11.      var image="image";
  12.     if(str==image)
  13.     {
  14.     var url="Get_Page.php";
  15.     url=url+"?q="+str;
  16.     url=url+"&sid="+Math.random();
  17.     xmlHttp.onreadystatechange=stateChanged ;
  18.     xmlHttp.open("GET",url,true);
  19.     xmlHttp.send(null);
  20.     }
  21.     else if(str=="content")
  22.     {
  23.     var url="content.html";
  24.     url=url+"?q="+str;
  25.     url=url+"&sid="+Math.random();
  26.     xmlHttp.onreadystatechange=stateChanged ;
  27.     xmlHttp.open("GET",url,true);
  28.     xmlHttp.send(null);
  29.     }
  30.  
  31. }
  32. function stateChanged() 
  33.     if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
  34.      { 
  35.          document.getElementById("txtHint").innerHTML=xmlHttp.responseText 
  36.      } 
  37. }
  38. function GetXmlHttpObject()
  39. {
  40.     var xmlHttp=null;
  41.     try
  42.      {
  43.          xmlHttp=new XMLHttpRequest();
  44.      }
  45.     catch (e)
  46.      {
  47.          try
  48.           {
  49.               xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  50.           }
  51.          catch (e)
  52.           {
  53.               xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  54.           }
  55.       }
  56.     return xmlHttp;
  57. }
//content.html

Expand|Select|Wrap|Line Numbers
  1. <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head>
  3. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  4.  
  5. <title>Untitled Document</title>
  6. </head>
  7.  
  8. <body>
  9.  
  10. <table width="97%" border="0" align="center" cellpadding="0" cellspacing="0">
  11.       <tr align="left">
  12.         <td width="14%" align="left" valign="middle">Content Id </td>
  13.         <td width="86%" valign="middle"><input type="text" name="Content_Id" value="" /></td>
  14.       </tr>
  15.       <tr align="left">
  16.         <td valign="middle" align="left">Content Name </td>
  17.         <td valign="middle"><input type="text" name="Content_Name" value="" /></td>
  18.       </tr>
  19.       <tr align="left">
  20.         <td align="left" valign="top">Description</td>
  21.         <td valign="middle"><textarea id="textarea2" name="Content_Description" style="height: 200px; width: 500px;">
  22.  
  23.           </textarea>
  24.          </td>
  25.       </tr>
  26.       <tr align="left">
  27.         <td valign="middle">&nbsp;</td>
  28.         <td valign="middle"><input type="submit" name="Content" value="Add Content" />
  29.           <input name="reset" type="reset" /></td>
  30.       </tr>
  31. </table>
  32. </body>
  33. </html>
Jan 18 '08 #24

acoder
Expert Mod 15k+
P: 16,027
The code which adds the scripts to the page should be added when content.html is called, otherwise it's not needed. If you're going to add them to the page before the option is selected, you might as well add them in the standard way, e.g.:
Expand|Select|Wrap|Line Numbers
  1. <script type="text/javascript" src="wysiwyg.js"></script>
Jan 18 '08 #25

100+
P: 254
The code which adds the scripts to the page should be added when content.html is called, otherwise it's not needed. If you're going to add them to the page before the option is selected, you might as well add them in the standard way, e.g.:
Expand|Select|Wrap|Line Numbers
  1. <script type="text/javascript" src="wysiwyg.js"></script>

Hi if you may do some modification to this code than it would be better for me just highlight the changes in the given code. Please!

Thanks
Jan 18 '08 #26

acoder
Expert Mod 15k+
P: 16,027
Here are some possible changes:
Expand|Select|Wrap|Line Numbers
  1.  <html xmlns="http://www.w3.org/1999/xhtml">
  2. <head>
  3. <script type="text/javascript" src="Get_Page.js"></script>
  4. <script type="text/javascript" src = "wysiwyg.js"></script>
  5. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  6. <title>Untitled Document</title>
  7. </head>
  8.  
  9. <body>
  10. <form>
  11. <select id="attachMoreLink" name="select" onchange="getPage(this.value)">
  12.               <option selected="selected">--Select One--</option>
  13.               <option value="image">Image</option>
  14.               <option value="content">Text</option>
  15.  
  16.             </select>
  17.             <div id="txtHint"> text will be displayed here</div>
  18. </form>
  19. </body>
  20. </html>

//Get_Page.js

Expand|Select|Wrap|Line Numbers
  1.  
  2. var xmlHttp;
  3. var chosenOption;
  4. function getPage(str)
  5.     chosenOption = str;
  6.     xmlHttp=GetXmlHttpObject()
  7.     if (xmlHttp==null)
  8.      {
  9.          alert ("Browser does not support HTTP Request");
  10.          return;
  11.      }
  12.      var image="image";
  13.     if(str==image)
  14.     {
  15.     var url="Get_Page.php";
  16.     url=url+"?q="+str;
  17.     url=url+"&sid="+Math.random();
  18.     xmlHttp.onreadystatechange=stateChanged ;
  19.     xmlHttp.open("GET",url,true);
  20.     xmlHttp.send(null);
  21.     }
  22.     else if(str=="content")
  23.     {
  24.     var url="content.html";
  25.     url=url+"?q="+str;
  26.     url=url+"&sid="+Math.random();
  27.     xmlHttp.onreadystatechange=stateChanged ;
  28.     xmlHttp.open("GET",url,true);
  29.     xmlHttp.send(null);
  30.     }
  31.  
  32. }
  33. function stateChanged() 
  34.     if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
  35.      { 
  36.          document.getElementById("txtHint").innerHTML=xmlHttp.responseText;
  37. if (chosenOption == "content") generate_wysiwyg('textarea2');
  38.      } 
  39. }
  40.  
//content.html

Expand|Select|Wrap|Line Numbers
  1. <table width="97%" border="0" align="center" cellpadding="0" cellspacing="0">
  2.       <tr align="left">
  3.         <td width="14%" align="left" valign="middle">Content Id </td>
  4.         <td width="86%" valign="middle"><input type="text" name="Content_Id" value="" /></td>
  5.       </tr>
  6.       <tr align="left">
  7.         <td valign="middle" align="left">Content Name </td>
  8.         <td valign="middle"><input type="text" name="Content_Name" value="" /></td>
  9.       </tr>
  10.       <tr align="left">
  11.         <td align="left" valign="top">Description</td>
  12.         <td valign="middle"><textarea id="textarea2" name="Content_Description" style="height: 200px; width: 500px;">
  13.  
  14.           </textarea>
  15.          </td>
  16.       </tr>
  17.       <tr align="left">
  18.         <td valign="middle">&nbsp;</td>
  19.         <td valign="middle"><input type="submit" name="Content" value="Add Content" />
  20.           <input name="reset" type="reset" /></td>
  21.       </tr>
  22. </table>
  23.  
Jan 18 '08 #27

100+
P: 254
Woowwwwwwwww!!!!!!!! Grea88888888888888888.

Thanks. I am so happy now. Really you made me happy


Thanks a lot
Jan 19 '08 #28

100+
P: 254
Here are some possible changes:

Woowwwwwwwww!!!!!!!! Grea88888888888888888.

Thanks. I am so happy now. Really you made me happy


Thanks a lot
Jan 19 '08 #29

acoder
Expert Mod 15k+
P: 16,027
No problem! Glad it worked. If you have any more questions, just post again to the forum.
Jan 19 '08 #30

100+
P: 254
@acoder
Hi

I wanted to display like order details of particular client on the same page using ajax. Here is the process how it should work


browse name by alpha bate

a b c d e f g h i j

so when clicks say 'a' it will display all the name start with 'a' like this using ajax

amar

ajay

abhay

when user click any name say ajay it will display all the order made by him using ajax

order no qty
ty87a 10

mkd6a 5

mkd5a 7


when user will select order no say mkd5a it will display the details of this order underneath using ajax


and I wanted to do this using ajax so how can I do it. approach which I used is like calling a js page when user clicks any alpha bate and in that js page passing the url of the page which will display name.

In name displaying page again I called a function on its click event which calls js page and in that js page url is passed to display the order list and so on

but it is not working so how should I do it or my approach is wrong please advice me
Jun 6 '09 #31

acoder
Expert Mod 15k+
P: 16,027
A simple solution would be to have the JavaScript already within the parent page, so you can make multiple Ajax calls quite easily without having to load the JavaScript code too.
Jun 6 '09 #32

100+
P: 254
@acoder
Hi what I understood to call all js page in the parent page I did but it did not worked or I took it wrong.
Jun 9 '09 #33

acoder
Expert Mod 15k+
P: 16,027
What I meant is that the JavaScript code that you call, keep them in the parent page instead of using Ajax to load the code separately. You said:
approach which I used is like calling a js page when user clicks any alpha bate and in that js page passing the url of the page which will display name.

In name displaying page again I called a function on its click event which calls js page and in that js page url is passed to display the order list and so on
Instead of calling a JS page, have it already included on the parent page:
Expand|Select|Wrap|Line Numbers
  1. <script type="text/javascript" src="file.js">
Jun 9 '09 #34

100+
P: 254
@acoder
I did like this on the parent page
Expand|Select|Wrap|Line Numbers
  1. <script type="text/javascript" src="file.js"> <!--to display name-->
  2. <script type="text/javascript" src="fileabc.js"><!--to display order made by client xxx-->
  3. <script type="text/javascript" src="filexyz.js"><!-- to display order details for a particular order number-->
  4.  
but it is not working.
Jun 9 '09 #35

acoder
Expert Mod 15k+
P: 16,027
Of course, now you would have to call the functions defined within those files at the appropriate times/events.
Jun 9 '09 #36

100+
P: 254
@acoder
I am doing like this but it gives me error for fileabc.js that document.getElementById() is null which is not and most important when I call these files not a single ajax file is called because of this error mentioned above.
Jun 12 '09 #37

Dormilich
Expert Mod 5K+
P: 8,639
@mukeshrasm
there's probably something wrong with your html file. or the id value passed to this method. can't tell without the code or the page…
Jun 12 '09 #38

100+
P: 254
@Dormilich
here is the code
file.html is the root file where i have called all the js files.
Expand|Select|Wrap|Line Numbers
  1. <a href="#"  onclick="clientName('I')">I</a>
  2. <td id="c">name will be displayed here! </td>
  3. <td id="p">projects will be displayed here! </td>
file.js
Expand|Select|Wrap|Line Numbers
  1. var xmlHttp
  2. function clientName(str)
  3. {
  4.     xmlHttp=GetXmlHttpObject()
  5.     if (xmlHttp==null)
  6.      {
  7.          alert ("Browser does not support HTTP Request");
  8.          return;
  9.      }
  10.     var url="fileabc.html";
  11.     url=url+"?q="+str;
  12.     url=url+"&sid="+Math.random();
  13.     xmlHttp.onreadystatechange=stateChanged ;
  14.     xmlHttp.open("GET",url,true);
  15.     xmlHttp.send(null);
  16. }
  17.  
  18. function stateChanged() 
  19.     if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
  20.      { 
  21.          document.getElementById("c").innerHTML=xmlHttp.responseText;
  22.  
  23.      } 
  24. }
  25.  
  26. function GetXmlHttpObject()
  27. {
  28.     var xmlHttp=null;
  29.     try
  30.      {
  31.          xmlHttp=new XMLHttpRequest();
  32.      }
  33.     catch (e)
  34.      {
  35.          try
  36.           {
  37.               xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  38.           }
  39.          catch (e)
  40.           {
  41.               xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  42.           }
  43.       }
  44.     return xmlHttp;
  45. }
  46.  

here is the code for fileabc.html
Expand|Select|Wrap|Line Numbers
  1. <a href="#" onclick="projectName('I')">mukesh</a><a href="#" onclick="projectName('A")">manish</a>
here is the code for fileabc.js

Expand|Select|Wrap|Line Numbers
  1. var xmlHttp
  2. function projectName(str)
  3. {
  4.     xmlHttp=GetXmlHttpObject()
  5.     if (xmlHttp==null)
  6.      {
  7.          alert ("Browser does not support HTTP Request");
  8.          return;
  9.      }
  10.     var url="filexyz.html";
  11.     url=url+"?q="+str;
  12.     url=url+"&sid="+Math.random();
  13.     xmlHttp.onreadystatechange=stateChanged ;
  14.     xmlHttp.open("GET",url,true);
  15.     xmlHttp.send(null);
  16. }
  17.  
  18. function stateChanged() 
  19.     if (xmlHttp.readyState==4 || xmlHttp.readyState=="complete")
  20.      { 
  21.          document.getElementById("p").innerHTML=xmlHttp.responseText;
  22.  
  23.      } 
  24. }
  25.  
  26. function GetXmlHttpObject()
  27. {
  28.     var xmlHttp=null;
  29.     try
  30.      {
  31.          xmlHttp=new XMLHttpRequest();
  32.      }
  33.     catch (e)
  34.      {
  35.          try
  36.           {
  37.               xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
  38.           }
  39.          catch (e)
  40.           {
  41.               xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
  42.           }
  43.       }
  44.     return xmlHttp;
  45. }
here is code for filexyz.html
Expand|Select|Wrap|Line Numbers
  1. <td >Information sytems</td><td >Inventory system</td>
  2.  

I want that it should display the results underneath.
Jun 17 '09 #39

Dormilich
Expert Mod 5K+
P: 8,639
@mukeshrasm
unless you use Apache's mod_rewrite, there is no sense in passing parameters to a html file.

and a matter of personal preference, I'd pass the query string/parameters to the send() method.

@mukeshrasm
underneath what? currently you're replacing the text in the table cells…
Jun 17 '09 #40

acoder
Expert Mod 15k+
P: 16,027
In addition to that, if it's a simple HTML file, you could just use JavaScript to add that content dynamically without the need for Ajax.

I can see where your problem is, though. You've defined GetXmlHttpObject twice. You only need it once. Secondly, you've already declared the global variable xmlhttp in file.js. Thirdly, you've redefined stateChanged(). Change that to something else in fileabc.js and change line 13 to reflect that.
Jun 17 '09 #41

100+
P: 254
@acoder
Thanks again! I fixed the errors now why I need to define GetXmlHttpObject once only and what problem stateChanged() caused in fileabc.js. and finally cann't I define global variables twice.

I am not calling html file actually it is dynamic file. that's why I am using ajax.

Thanks again!
Jun 19 '09 #42

acoder
Expert Mod 15k+
P: 16,027
Although it may not necessarily result in errors, it's bad practice to define the same function twice. In your case, stateChanged was different, so was the main cause of the problem. If you can, try to avoid global variables or keep to a minimum - see this.
Jun 19 '09 #43

100+
P: 254
@acoder
thanks! and useful link to learn if you have some more please refer me.
Jun 20 '09 #44

acoder
Expert Mod 15k+
P: 16,027
See the Off-site links sticky for some useful JavaScript links if you haven't already done so.
Jun 20 '09 #45

100+
P: 254
@acoder
Hi I want to give reference to some thread of this posting to php forum of this site how could I do this
Jun 23 '09 #46

acoder
Expert Mod 15k+
P: 16,027
You mean you want to refer/link to this thread? Just copy the URL in the address bar.
Jun 23 '09 #47

100+
P: 254
@acoder
ok thanks! actually I wanted to refer this thread to some of css and php topic of this site so for that I asked that how I will refer it to others.
Jun 23 '09 #48

Post your reply

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