Processing data on the client-side from server-side scripts without page changes

[krycek]

Here's a tricky one!

I am currently building a dynamic IE-based application which I need to tie in with my PHP scripting. Now, I was not sure which forum to put this in, but as it is mainly about the JavaScript part, I am putting it here :)

The idea is, for me to have a hidden frame or something, and the JavaScript to submit a form to that frame using a PHP script and then processing the reply... and then taking appropriate action... hmmm... :confused:

I have seen a couple of places where something similar has been done, most notably OpenThought (http://openthought.net), but I have decided not to use that project because I need to write my own. For a start, I want to use PHP on the server, and also I want to be able to fully understand it.

So... my rough guess is that I build a custom object called Data or something, and use this to store all the information from each form/page etc. Then do the hidden frame stuff on submit, and process the reply and dynamically rewrite the visible page.

I can do most of the client-side stuff such as rewiting the page and building the hidden frame and the data object - but I do not know how to interface these properly with the PHP script. Is it as simple as letting the hidden frame deal with it? Or do I have to build my own header to be sent, with all the post/get variables added manually? :confused:

Any ideas on the best way to do this would be greatly appreciated, someone mentioned JavaScript query or something but I do not know what that is - also, if is is possible to do this without a hidden frame then I would love to know how.

As a final thought, I am thinking of tying this in with XML somehow - I was thinking, I could generate the data from the database as an XML file which could be sent to the browser, and from there, parsed to whatever format is required. Not quite sure what to do or how to do it though - I have a basic understanding of XML but I have never used it. Is there any point to this approach?

I understand that this is a massive question in some ways, and I will simply be looking for thoughts on how to go about it, even if you do not know the details of the technique. However, detailed methods and also any code samples would be greedily welcomed :D and would help me no end!

Cheers everyone!

::] krycek [::

[Vladdy]

I can suggest a code for a very simple method that does not use frames but has the following limitations:
- DOM2 only (IE5+, Gecko browsers)
- would not be able to send files
still interested???

[krycek]

Definitely interested, even if it turns out to be unsuitable for what I want to do :) I can perhaps learn from the technique :D

::] krycek [::

[Vladdy]

In the form use submit buttom to run the following script:


// array with form element IDs (not names)
fe = new Array("Input1","Input2",...."InputN");

function sendInfo()
{ qstring="processrequest.php?" // the name of the file that will process the input
for(i=0;i<fe.length;i++)
qstring+= fe[i] + '=' + escape(document.getElementById(fe[i]).value) + '&';
qstring = qstring.substring(0,qstring.length - 2); // remove the last &
so=document.createElement('script');
so.src=qstring;
document.getElementsByTagName('head')[0].appendChild(so);
}


Now your server side code should process the querry string (could give you an example in ASP) and return javascript that would modify the needed elements as it loads. This way you are not limited to the form fields, but can actually modify ANY element on the web page.

Good Luck