Need some help with this Ajax script please :)

**hyde360** · 07-10-2009, 02:05 PM

Hello,

I do apologize if this is in the wrong forum...

I've written this Ajax script to process a request to remove data from a MySQL database, however they are both on the server but it doesn't seem to do the process whatsoever so it's baffled me

Here's my Ajax script:

Code:

<script type="text/javascript">
//-->
function removeBuddy(bud) {
$.ajax({
type: "GET",
url: "removeBuddy.php",
data: "buddy="+ bud,
success: function(msg){

$("#removed").ajaxComplete(function(event, request, settings){

if(msg == 'OK')
{

  $("#removed").css("padding", "10px", "font-size", "8pt");
  $(this).html('&nbsp;You have successfully removed <b>'+ bud +'</b> from your buddy list...');
} 
else
{

  $("#removed").css("padding", "10px", "font-size", "8pt");
  $(this).html(msg);

});

}

});

}
else
   {

   $("#removed").css("padding", "10px", "font-size", "8pt");
   $("#removed").html('FATAL: There was an error while processing your request... Please try again');
   }

});

});

}
//-->
</script>

And for the part that sends the request to the Ajax script is this

HTML Code:

<a href="#" onclick="removeBuddy('User1');">Delete Now...</a>

Also the DIV that returns the message is this:

Code:

<div id="removed"></div>

Can someone please be kindly and help me solve this, any help will be much appreciated

**Jesdisciple** · 07-10-2009, 08:42 PM

Please post a link to the page on your site that contains the problematic script so we can check it out.

Immediately I notice that your JavaScript is obtrusive. That is, JS-disabled users cannot use the feature. JS-disabled users include the visually impaired (who use special browsers) and folks who intentionally disable JS for security reasons. If you're interested, I'd be glad to show you how to fix this.

**hyde360** · 07-10-2009, 09:06 PM

Hello,

Thanks for your kind response, however my website is in currently development and the script is used to remove friends from their friends list as you probably already noticed.

All friends are stored on one Database Table, assigned to one another.

Don't know if that's a problem or not...

And yes if you wouldn't mind showing me

I'll appreciate it a lot

**Jesdisciple** · 07-10-2009, 10:09 PM

I don't really want to build your page from its components, and I can't anyway because I don't have all the components. Debugging by reading is often harder than that, because we don't work like computers... which is why we invented them in the first place.

The first step to unobtrusive JS is to build the page without JavaScript, and make sure it works. Any server-side logic that JS will need to use should be kept in separate script files than the non-JS pages.

Next, you need to make some JS run after the page is loaded which modifies the page with event-listeners. This involves finding the elements to modify (usually with document.getElementById) and assigning to their "on[...]" properties, in this case "onclick".

After you complete the first step, your link should look like this:

Code:

<a href="friend_deleted.php?user=User1">Delete Now...</a>

We need an ID to find it with, so...

Code:

<a id="delete" href="friend_deleted.php?user=User1">Delete Now...</a>

Now we can JS-enable that link when the page loads:

Code:

document.getElementById('delete').onclick = function (){
    removeBuddy('User1');
    return false;
};

There are two ways to wait for the page to load, favored by different people for different reasons.

You can register an onload event-listener on the window. This is equivalent to <body onload> except that logic and layout aren't jumbled together.

Code:

window.onload = function (){
    // Do your stuff.
};

Scripts placed in the body are run when the browser reaches them. For example, this script will be run after the form is loaded but before the footer exists:

Code:

    <body>
        <form></form>
        <script type="text/javascript">
            doSomething();
        </script>
        <div id="footer"></div>
    </body>

Some people (most notably Douglas Crockford) prefer to put scripts at the very bottom of the page.

Originally Posted by http://javascript.crockford.com/script.html

A <script src="url"></script> will block the downloading of other page components until the script has been fetched, compiled, and executed. It is better to call for the script as late as possible, so that the loading of images and other components will not be delayed. This can improve the perceived and actual page loading time. So it is usually best to make all <script src="url"></script> the last features before the </body>. An in-page <script> does not have a significant impact on loading time.

If a script is defining functions or data that are used by other functions, then the defining must be done before use. So the defining scripts must come before the using scripts.

**hyde360** · 07-11-2009, 12:44 AM

Hello,

Thank you for your very kind response there

I couldn't agree more with the computer subject

Right, back on subject... I've done the testing and it works perfectly although the reason for using Ajax was to prevent page reloads, and to be honest it's a personal opinion they just annoy the hell out of me

So is my Ajax script out of the question? Would you say <noscript>non js goes here</noscript> would also work for those people who have JS turned off? Yet your idea seems more constructive and easy to do

As for the JS could I use Ajax to perform the request, that's if the end-user has JS enabled? Again I don't mind if this is out of the question, I just think Ajax is nice

**Jesdisciple** · 07-11-2009, 01:03 AM

I was assuming that removeBuddy performs your Ajax...

noscript tags are stripped by corporate proxies for security reasons... I don't know the reasons; I got this piece of info from a guru on another forum.

Because my onclick handler returns false, you shouldn't see the non-JS alternative if JS is enabled.

**hyde360** · 07-11-2009, 01:15 AM

Thanks again

You have been a great help on this!

And on that subject about "noscript" being stripped by companies seems odd but oh well, again thanks a lot mate

Regards,
Hyde360

**Jesdisciple** · 07-11-2009, 01:32 AM

Oh, you were asking something different with "out of the qustion" than I thought. Plus I forgot that you posted the source for removeBuddy...

But anyway... If I can't work with the actual page, I don't think it's a good idea to try to solve any problems with it. That will probably just result in me spending a lot of time getting frustrated.

**hyde360** · 07-11-2009, 02:57 AM

Hello,

I have solved this now and it's working perfectly, took some time and pretty much a lot of stress... But that's what coding is all about fun, stress, enjoy, well I think so anyway

Again thanks for your help in trying to solve this!!!

- Hyde360