•
•
•
•
What is DaniWeb IT Discussion Community?
You're currently browsing the JavaScript / DHTML / AJAX section within the Web Development category of DaniWeb, a massive community of 430,100 software developers, web developers, Internet marketers, and tech gurus who are all enthusiastic about making contacts, networking, and learning from each other. In fact, there are 3,166 IT professionals currently interacting right now! Registration is free, only takes a minute and lets you enjoy all of the interactive features of the site.
Please support our JavaScript / DHTML / AJAX advertiser: Lunarpages Web Hosting
Views: 1538 | Replies: 8
 |
•
•
Join Date: Jun 2007
Posts: 71
Reputation: 
Rep Power: 0
Solved Threads: 0
Junior Poster in Training
Hello everybody, I've written a program which contains AJAX...
The program is a messenger...
The code was:
The problem was:
when the user selects a text ... the text becomes unselected automaticially !!
I think the mistake was in:
What do you think??
Please help me quickly
The program is a messenger...
The code was:
var http = createRequestObject();
function createRequestObject(){
var request_;
var browser = navigator.appName;
if(browser == "Microsoft Internet Explorer"){
request_ = new ActiveXObject("Microsoft.XMLHTTP");
}
else{
request_ = new XMLHttpRequest();
}
return request_;
}
function getInfo(){
http.open('get', 'Rooms_Func.php?id=23');
http.onreadystatechange = handleInfo;
http.send(null);
}
function handleInfo(){
if(http.readyState == 4){
var response = http.responseText;
document.getElementById('ChtPlc').innerHTML = document.getElementById('ChtPlc').innerHTML+response;
}
}when the user selects a text ... the text becomes unselected automaticially !!
I think the mistake was in:
document.getElementById('ChtPlc').innerHTML = document.getElementById('ChtPlc').innerHTML+response;Please help me quickly
The great scientist see his web-site:
http://www.elnaggarzr.com/en
I'm sure that will be good for you!
http://www.elnaggarzr.com/en
I'm sure that will be good for you!
•
•
Join Date: Dec 2007
Posts: 75
Reputation:
Rep Power: 1
Solved Threads: 10
Junior Poster in Training
From your problem description it is not clear if you have a select list within a div ( or some other element) with id="ChtPlc". At any rate, the following code should do what you are aiming if your HTML code is similar to the following:
Your javascript codewould then be:
<div id="ChtPlc"> <select onchange="getInfo();"><option value="1">alpha</option><option value="2">beta</option></select> </div>
Your javascript codewould then be:
var http = createRequestObject();
function createRequestObject(){
var request_=null;
if( window.XMLHttpRequest )
request_ = new XMLHttpRequest();
else if( window.ActiveXObject)
request_ = new ActiveXObject("Microsoft.XMLHTTP");
return request_;
}
function getInfo(){
http.open('GET', 'Rooms_Func.php?id=23');
http.onreadystatechange = handleInfo;
http.send('');
}
function handleInfo(){
if(http.readyState == 4){
var response = document.createTextNode(http.responseText);
document.getElementById('ChtPlc').appendChild(response);
}
} •
•
Join Date: Jun 2007
Posts: 71
Reputation:
Rep Power: 0
Solved Threads: 0
Junior Poster in Training
•
•
•
•
Originally Posted by hielo 
From your problem description it is not clear if you have a select list within a div ( or some other element) with id="ChtPlc". At any rate, the following code should do what you are aiming if your HTML code is similar to the following:
I said I want to write a messenger
And the messenger does not need a (Select)
I hope you can help
The great scientist see his web-site:
http://www.elnaggarzr.com/en
I'm sure that will be good for you!
http://www.elnaggarzr.com/en
I'm sure that will be good for you!
•
•
Join Date: Sep 2005
Posts: 689
Reputation:
Rep Power: 6
Solved Threads: 41
Practically a Master Poster
Re: Trouble with AJAX including PHP Attach DOM nodes to your Document instead of replacing innerHTML. Any text selection will disappear when you remove text, then replace it with new text.
When attaching DOM nodes, only the added HTML Node is injected into your HTML, and the text selection will remain. It will also not flicker in older browsers (innerHTML replacement on an element with overflow had that bug).
It is also more efficient when you'll run into a long list of element. Its easier to work with also as its actual DOM elements and not dead HTML injected via innerHTML.
Eg: if you get 1000 elements, you may want to trim the last one off, thats easier with actual dom nodes.
When attaching DOM nodes, only the added HTML Node is injected into your HTML, and the text selection will remain. It will also not flicker in older browsers (innerHTML replacement on an element with overflow had that bug).
It is also more efficient when you'll run into a long list of element. Its easier to work with also as its actual DOM elements and not dead HTML injected via innerHTML.
Eg: if you get 1000 elements, you may want to trim the last one off, thats easier with actual dom nodes.
www.fijiwebdesign.com - web design and development and fun
Cpanel Email - Let users Register email accounts on your website upon registration
Ajax Chat - Fully browser based chat!
Cpanel Email - Let users Register email accounts on your website upon registration
Ajax Chat - Fully browser based chat!
•
•
Join Date: Jun 2007
Posts: 71
Reputation:
Rep Power: 0
Solved Threads: 0
Junior Poster in Training
•
•
•
•
Originally Posted by digital-ether
Attach DOM nodes to your Document instead of replacing innerHTML. Any text selection will disappear when you remove text, then replace it with new text.
Thanks, In your reply I see that you did not understand my question well, I do not want to remove a text and that is not my problem.
My problem is that the text being removed and being created automatically, So If you have the answer please give me it with one or two examples.
The great scientist see his web-site:
http://www.elnaggarzr.com/en
I'm sure that will be good for you!
http://www.elnaggarzr.com/en
I'm sure that will be good for you!
•
•
Join Date: Sep 2005
Posts: 689
Reputation:
Rep Power: 6
Solved Threads: 41
Practically a Master Poster
•
•
•
•
Originally Posted by Pro2000
Thanks, In your reply I see that you did not understand my question well, I do not want to remove a text and that is not my problem.
My problem is that the text being removed and being created automatically, So If you have the answer please give me it with one or two examples.
I thought your problem was:
The problem was: when the user selects a text ... the text becomes unselected automaticially !!
This will happen because of:
function handleInfo(){
if(http.readyState == 4){
var response = http.responseText;
document.getElementById('ChtPlc').innerHTML = document.getElementById('ChtPlc').innerHTML+response;
}
}you want to actually insert DOM nodes, not replace innerHTML.
function handleInfo(){
if(http.readyState == 4){
var response = http.responseXML; // get XML, not TXT
document.getElementById('ChtPlc').addChild(response); // add Child Nodes, not innerHTML
}
}Where Element.addChild() is a pseudo function that will clone your XML and insert it as a child of document.getElementById('ChtPlc').
Sorry if I'm misreading your question? I can be a bit dim at times..
www.fijiwebdesign.com - web design and development and fun
Cpanel Email - Let users Register email accounts on your website upon registration
Ajax Chat - Fully browser based chat!
Cpanel Email - Let users Register email accounts on your website upon registration
Ajax Chat - Fully browser based chat!
•
•
Join Date: Jun 2007
Posts: 71
Reputation:
Rep Power: 0
Solved Threads: 0
Junior Poster in Training
•
•
•
•
Originally Posted by digital-ether
Sorry if I'm misreading your question? I can be a bit dim at times..
Thanks for helping, I'm going to try it.. thanks again.
The great scientist see his web-site:
http://www.elnaggarzr.com/en
I'm sure that will be good for you!
http://www.elnaggarzr.com/en
I'm sure that will be good for you!
•
•
Join Date: Jun 2007
Posts: 71
Reputation:
Rep Power: 0
Solved Threads: 0
Junior Poster in Training
I've done that but the HTML page says:
<<Error: Object doesn't support this property or method>>
This is the HTML page(ctb.htm):
And this is gtcht.js:
<<Error: Object doesn't support this property or method>>
This is the HTML page(ctb.htm):
HTML Syntax (Toggle Plain Text)
And this is gtcht.js:
var http = createRequestObject();
function createRequestObject(){
var request_;
var browser = navigator.appName;
if(browser == "Microsoft Internet Explorer"){
request_ = new ActiveXObject("Microsoft.XMLHTTP");
}
else{
request_ = new XMLHttpRequest();
}
return request_;
}
function getInfo(){
http.open('get', 'GtCht.php');
http.onreadystatechange = handleInfo;
http.send(null);
}
function handleInfo(){
if(http.readyState == 4){
var response = http.responseXML; // get XML, not TXT
document.getElementById('ChtPlc').addChild(response); // add Child Nodes, not innerHTML
}
} The great scientist see his web-site:
http://www.elnaggarzr.com/en
I'm sure that will be good for you!
http://www.elnaggarzr.com/en
I'm sure that will be good for you!
•
•
Join Date: Sep 2005
Posts: 689
Reputation:
Rep Power: 6
Solved Threads: 41
Practically a Master Poster
Sorry if I wasn't clear. DOM nodes do not have a native addChild() method. You have a create a function that will do that for you.
See: http://www.quirksmode.org/blog/archi...p_notes_c.html
First try doing:
That will probably only work in Firefox. But its a starting point.
Another solution is to iterate through each xml Node in the response, recursively, and create the corresponding DOM elements in your Document.
eg:
I haven't tested that fully so there may be bugs. Tested in FF2.0, IE6 and IE7.
This is how you would implement it in your code:
A good DOM ref: http://www.howtocreate.co.uk/tutoria...t/domstructure
See: http://www.quirksmode.org/blog/archi...p_notes_c.html
First try doing:
function handleInfo(){
if(http.readyState == 4){
var response = http.responseXML; // get XML, not TXT
document.getElementById('ChtPlc').appendChild(response.documentElement.cloneNode(true)); // add Child Nodes, not innerHTML
}
}That will probably only work in Firefox. But its a starting point.
Another solution is to iterate through each xml Node in the response, recursively, and create the corresponding DOM elements in your Document.
eg:
/**
* Clones XML nodes to the current Document's DOM
*/
function cloneXMLtoDOM(Node) {
var DOMNode;
if (Node.nodeName == '#text') {
DOMNode = document.createTextNode(Node.data);
} else {
// clone root node
DOMNode = document.createElement(Node.nodeName);
// clone the attributes
for(var i = 0; i < Node.attributes.length; i++) {
DOMnode.setAttribute(Node.attributes[i].nodeName, Node.attributes[i]);
}
// recursively clone the child nodes
if (Node.hasChildNodes()) {
for(var i = 0; i < Node.childNodes.length; i++) {
DOMNode.appendChild(cloneXMLtoDOM(Node.childNodes[i]));
}
}
}
return DOMNode;
}I haven't tested that fully so there may be bugs. Tested in FF2.0, IE6 and IE7.
This is how you would implement it in your code:
// after including the cloneXMLtoDOM() function
function handleInfo(){
if(http.readyState == 4){
var response = http.responseXML; // get XML, not TXT
document.getElementById('ChtPlc').appendChild(cloneXMLtoDOM(response.documentElement)); // add Child Nodes, not innerHTML
}
}A good DOM ref: http://www.howtocreate.co.uk/tutoria...t/domstructure
www.fijiwebdesign.com - web design and development and fun
Cpanel Email - Let users Register email accounts on your website upon registration
Ajax Chat - Fully browser based chat!
Cpanel Email - Let users Register email accounts on your website upon registration
Ajax Chat - Fully browser based chat!
|
•
•
•
•
•
•
•
•
DaniWeb JavaScript / DHTML / AJAX Marketplace
•
•
•
•
Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)
Linear Mode
•
•
•
•
ajax asp blog competition cross-browser javascript menu with few lines of code daniweb developer development firefox gentoo home html internet javascript javascript smooth scrolling scroll smoothly window document position javascript tab menu with rounded corners generator linux microsoft msdn news office php prevent javascript menu from getting hidden under flash movies security site software spam sql vista web
- Previous Thread: How to link towards a div tag?
- Next Thread: Multiple Mouseover Events
