Making an AJAX script more dynamic

[HaLo2FrEeEk]

I have an AJAX script that works perfectly...when what you're doing doesn't require any dynamic...ness.  I want to be able to pass parameters to the script that the url being run by the AJAX can recieve.  Right now, it's set up so only one page can really make anything of it.  What I want is to be able to pass different values depending on what the page I'm running is, so I need your guys' expertise, I have one idea in mind but its not very practical, I was hoping you guys could help me out and tell me the what the best way would be to do what I'm trying to do.

 

Here is my script:

 

var http_request = false;
var obj;

function makePOSTRequest(url, parameters) {
  http_request = false;
  if (window.XMLHttpRequest) { // Mozilla, Safari,...
    http_request = new XMLHttpRequest();
    if (http_request.overrideMimeType) {
      // set type accordingly to anticipated content type
      //http_request.overrideMimeType('text/xml');
      http_request.overrideMimeType('text/html');
      }
    } else if (window.ActiveXObject) { // IE
    try {
      http_request = new ActiveXObject("Msxml2.XMLHTTP");
      } catch (e) {
    try {
      http_request = new ActiveXObject("Microsoft.XMLHTTP");
      } catch (e) {}
    }
  }
  if (!http_request) {
    alert('Cannot create XMLHTTP instance');
    return false;
    }

  http_request.onreadystatechange = alertContents;
  http_request.open('POST', url, true);
  http_request.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
  http_request.setRequestHeader("Content-length", parameters.length);
  http_request.setRequestHeader("Connection", "close");
  http_request.send(parameters);
  }

function loading() {
  var load;
  load = document.getElementById("loading");
  vis = load.style;
  if(vis.display == '' || vis.display == 'block') {
    vis.display = 'none';
    } else if(vis.display == 'none') {
    vis.display = 'block';
    }
  }

function alertContents() {
  if (http_request.readyState == 4) {
    if (http_request.status == 200) {
      //alert(http_request.responseText);
      result = http_request.responseText;
      //document.getElementById('status').innerHTML = result;
      obj.innerHTML = result;
      loading();
      } else {
      alert('There was a problem with the request.');
      loading();
      }
    }
  }

function get(url, user_id, div_id) {
  var poststr = "user_id=" + user_id + "&url=" + escape(encodeURI(document.getElementById('url').value));
  obj = document.getElementById(div_id);
  loading();
  makePOSTRequest(url, poststr);
  }

[HaLo2FrEeEk]

GUYS, Please HELP!

[RichardRotterdam]

Just what is it exactly that the ajax script is suppose to do? like what actions are on your HTML page like buttons/onclick events etc.

 

and what parameters do you want to send when a certain action is preformed. I can make that code look a lot cleaner with the use of mootools framework. I stepped away from Ajax scripting the old way because its simply requires to much coding.

 

anyway give a description and I can help you write your ajax script in no time

[HaLo2FrEeEk]

Well, I have something where a user is submitting url's to a database for a link rotator, I have it so they can submit the url with no problem, I need to make it so they can hide and show the list of url's (and so it updates everytime they re-show it) and so they can dynamically edit any url from the list by clicking an edit link, the url in the list would then turn into a textbox containing the url, they could then edit it if they so desired, then click ok and it would turn back into the edited url.  They also need to be able to delete links using it too.

[RichardRotterdam]

Ok correct me if I am wrong. you want to build some kind of administration tool probably for a CMS.

 

You want the following functionality in that module.

1. Insert new record into link_rotator table

2. Update a record from the link rotator_table (and changing the text to a input field)

3. Delete a record from the link rotator_table

4. the one I don't get

I need to make it so they can hide and show the list of url's (and so it updates everytime they re-show it)

 

You want all of this without refreshing the entire page I presume since that is probably the reason you took the ajax approach and that is what makes ajax so great

[HaLo2FrEeEk]

Ok, it's actually an image rotator.  The user will sign up for an account and get a user_id and a username, they will be able to enter url's into the database using an AJAX form, that part is done.  They need to be able to click a show/hide link that will toggle a table with all the url's that they have entered, it will update everytime they show it though, so if they show it, enter a url, hide it then show it again, the url they just entered will be shown in the list.  They also need to be able to simply click each url in the table that drops down and the url will turn into a textbox containing that url, they can then edit it and click a Save link that will update the url, then turn the textbox back into the updated link.  They also need to be able to delete the links from the drop down list as well.

 

The part I am having the most trouble with is the updating part, I can't get it to pass the new url from the textbox dynamically to the ajax script, I keep getting "expected: ')'" errors from Javascript.  It's driving me insane.

[Philip]

I keep getting "expected: ')'" errors from Javascript.

 

This means you're missing a closing parenthesis  in your script. Any other JS on the page?

[HaLo2FrEeEk]

I have a php page that dynamically creates a javascript array that will display the number of clicks a link has gotten in my click counter, and then the script I posted.  I changed the pages since then, so I couldn't tell you how I was calling it up.  I think it was something like this:

 

onclick="ajax('edit.php', 'test', 'action=edit', 'text='document.getElementById('text'), 'file=$file');"

 

And I think that the getElementById('') was messing it up.  I changed my javascript so I could just pass the id of the textbox to the ajax() function and, if it was present and not null, it would get the element by id in the function, instead of on the php page.

 

I just need to be able to edit the contents of a database row without refreshing the page.  They will click the url which will turn into a textbox with the url in it, they can then edit it and click a button and it will be submitted and the database will be uploaded.  I've seen this done countless times, on forums, mainly, so I know it's 100% possible.  And there are no line breaks to worry about, its just one line.  (line breaks (\n) were another problem I was having, passing them through javascript was giving me errors)