Question

I’m using Jquery to process a form without loading a new page. I’m getting as far as being able to get an alert with the email address placed in the input field ‘mailingfield’.
I cant work out why post isn’t working (more directly, the image doesn’t do anything onclick.
the .mailbutton is an image.

window.onload = init;

function init() {
    $(".mailbutton").click(function() {
        var email = $(".mailingfield").val();
        $.post("/localhost/PHP_scripts/mailinglist.php", {
            email: email
        }, function(data) {
            var content = $(data).find('#content');
            $("#box").empty().append(content);
        }
        });
    };

the mailinglist.php is looking for “email” to be set by $_POST.
It then validates for security etc then if the email address pass the validations it’s inserted into a database then the code parses a block of html preceeded with a div ID’d content. If the validations fail it produces a similar block of html preceeded with the content div, with a relevant warning.
Am i going about this the right way.
Any help greatly appreciated.

Answer 1

I would suggest binding the event to the button in the document ready block like this (Not to mention I fixed your syntax errors. As long as the url is correct this will work):

window.onload = init;

$(function(){

   $(".mailbutton").click(function() {
      var email = $(".mailingfield").val();
      $.post("/localhost/PHP_scripts/mailinglist.php", { email: email }, function(data) {
            var content = $(data).find('#content');
            $("#box").empty().append(content);
      });
   });
});