[thelist] Re: XMLhttpRequest, javascript arrays? [SOLVED]
Courtenay
court3nay at gmail.com
Fri Mar 18 04:35:52 CST 2005
Well, I solved the problem, with a little help from callbacks, and a
kickstart from
http://www.cabezal.com/blog/archives/000607.shtml
Here's the code, which enables you to queue up ajax requests. I'm
still open to neater solutions.. the ajax code is a little hacked-up,
and its untested in everything except ffx1
function xmlLoad(url, obj, func)
{
if (!url) return false;
if (window.XMLHttpRequest)
var http = new XMLHttpRequest();
else if (window.ActiveXObject)
try { http = new ActiveXObject("Msxml2.XMLHTTP");
} catch(e) {
http = new ActiveXObject("Microsoft.XMLHTTP");
}
if (!http) return false;
if (func)
http.onreadystatechange = function() {
if (http.readyState != 4) return;
func(obj, http.responseText);
};
http.open('GET', url, true);
http.send(null); // probably wants to be http.send() in IE
if (func) {} else return http.responseText;
return false;
}
Then to call it from the form submitter, you go
function formsubmit(frm) {
url = frm.action; // also, you can convert POSTs to GET here.
thetable = getParent(frm, 'table'); // navigate up the foodchain
lastrow = thetable.rows[thetable.rows.length-1]; // get last row
.. // add form data to last row here
xmlLoad(url, lastrow.cells[0], function(ob,tx) { ob.innerHTML = tx; });
// set the first cell as the response from the server (in this case an image)
}
---------- Forwarded message ----------
Hi all,
I'm (bravely) building a data-entry app (in Rails, heh) that uses
xmlHttpRequest to send the form data asynchronously to the server (it
also degrades without javascript).
The code works something like this:
-Data is in a table with 3 columns
- User enters data in a form field at the end of the table
- Javascript intercepts form.onsubmit, appends a new row to the
existing data with the text from the form.
- Javascript sends xmlHttpRequest to a controller, which adds it to the db.
So the process is quite fast for the user (immediate in fact) and
there's no waiting around for the database (inserts being quite slow).
If there's an error, it uses a css popup to alert the user. If the
insert is successful, it changes a little icon next to the item.
[x] [ Item name ] [ $4.50 ]
[x] [ Other Item name ] [ $3.25 ]
[ ] [ New item name ] [ $2.50 ]
[ (form field ] [ (form field) ] [Submit]
Here's the problem: I store the 'current row' as a global var (eek).
If the user adds a few rows quickly, it can't keep up with the icon
changes.
javascript:
var req;
var cur;
function XMLreq(url, target) {
cur = target;
if (window.XMLHttpRequest) {
req = new XMLHttpRequest();
... etc.
}
function processReqChange() {
if (req.readyState == 4 && req.status == 200) {
cur.innerHTML += req.responseText;
}
}
So maybe if I use associative arrays like
cur[url] = target;
then on processReqChange use
cur[url].innerHTML = req.responseText
However, there's no way of retrieving the URL from the xmlHTTPrequest
data... or is there?
Any other suggestions? Another list to post to?
TIA
court3nay
More information about the thelist
mailing list