Question

I want to make a faq panel when user ask any question it show on the top of division without reloading the page for that i think i have to make a connection with database after every few second. Now the question is that how to make connection without reloading the page and how to show new question ?

Answer 1

You have two options:

1. Ajax, which allows you to retrieve data from the server with JavaScript, which you can then use to manipulate the DOM. The basis of Ajax is the XMLHttpRequest object, which allows you to retrieve data completely behind-the-scenes in JavaScript. Note that Ajax is limited by the Same Origin Policy, but for what you’re describing, that’s fine — you’ll be loading data from the same origin.

2. Frames (e.g., iframe elements), which you can load content into by setting their src property.

Of the two, Ajax is much more flexible.

References / further reading:

• DOM2 Core
• DOM2 HTML
• DOM3 Core
• HTML5 Web Applications APIs
• XMLHttpRequest object

---

Side note: Although obviously you can use XMLHttpRequest and the DOM methods directly, note that there are cross-browser differences (and outright bugs), which can be smoothed over for you by a good library like jQuery, Prototype, YUI, Closure, or any of several others. They also provide a lot of useful utility functionality, allowing you to focus on the actual problem you’re trying to solve rather than the details of the plumbing.

For example, here’s how you would send an Ajax request to a server using jQuery and have an element on the page updated with the HTML fragment the server sends back:

$("#target").load("get_the_data.php", {article: x});

That says: Request an HTML fragment from get_the_data.php sending it the parameter article with the value from the x variable, and put that HTML fragment inside the element that has the HTML id “target”. That would be a good 10 lines of code if you didn’t use a library. Now, that’s not a lot, but repeat that over and over (and in the process deal with an IE bug around looking up elements by their id), and you see how it can add up.

I do recommend you read the references above so you know how the libraries are doing what they’re doing (it’s not magic), but there’s no reason not to leverage the hard work people have done to make this stuff easier.