Wrestling with an alternative ajax subscription form

I am trying to convert our older ajax subscription form to a newer direct to CM format.

Our old form simply sent us an email and then we manually subscribed the person.  This was due part to our old emailing system, as well as a means to keep out robo-subscriptions and our competitors ;-)

I have seen the ajax form in the blogs, but to use that verbatim would require recoding the form itself everywhere it appears on our website.  So I am hoping to be able to use a modified version of our current ajax/jquery setup, so that I only need modify one master js file.

I have included our code below.  The function works fine for submitting the subscription request and the new subscriber gets their reconfirm email ... however the success function is not working.

Any ideas from the API gurus as to how I might get some success with the success?

$("#mlist2").click(function() {

var name = $("input#name1").val(),
    email = $("input#email1").val(),
    dataString = 'cm-name=' + name + '&cm-ptxxrr-ptxxrr=' + email;

$.ajax({
    type: "POST",
    url: "http://myaccount.createsend.com/t/r/s/ptxxrr/?callback=?",
    data: dataString,
    success: function(data) {
        if (data.Status === 400) {
            $('#m-list').html("<div id='message'>Oops.</div>");
        } else { // 200
            $('#m-list').html("<div id='message'>Cool.</div>");
        }
    }
});
return false;
});
Phil Phil, 4 years ago

Hi mrcycling,

I believe that the '?callback=?' addition to the url only causes jQuery to parse the response as JSONP data if you're using jQuery's $.getJSON shortcut method.

If you want to use jsonp (which is how this submission type operates) it's worth checking through the $.ajax documentation to verify what follows. Basically you need to include 'dataType:"jsonp"' as a property and get rid of the ''?callback=?", ie:

$.ajax({
    type: "POST",
    url: "http://myaccount.createsend.com/t/r/s/ptxxrr/",
    data: dataString,
    dataType: 'jsonp',
    success: function(data) {
        if (data.Status === 400) {
            $('#m-list').html("<div id='message'>Oops.</div>");
        } else { // 200
            $('#m-list').html("<div id='message'>Cool.</div>");
        }
    }
});
mrcycling, 4 years ago

Thanks for the suggestion.  That did the trick.  I had previously tried the url without the ?callback=? bit, but to no avail (since I was missing the dataType). 

Unfortunately I deal with designing only my one website per year and the speed at which the web evolves it is a constant learning process.  I am hoping to take the sign up form one step further and use the API, so that my responses can be based on the full spectrum of responses ie: you are signed up already, you forgot to confirm before, etc.

Join 200,000 companies around the world that use Campaign Monitor to run email marketing campaigns that deliver results for their business.

Get started for free
1-888-533-8098