AJAX Signup Module

Advanced Questions & Problems

AJAX Signup Module

Postby jarredt » 10:29pm, Thu 12 Mar, 2009

Hello, I want to create a custom signup module to put on the left nav of my site, but am having some problems. I know how AJAX works, so I don't need to know about that. But each time I submit my form, I am sent to the ?p=subscribe&id=1 page, and asked to enter my email address again.

So here's my question: Can someone provide me with the SQL query that subscribes an email address and sends a confirmation email? That way I can easily run the query without having to deal with phplist's subscribe pages?

Thanks!
jarredt
phpList newbie
 
Posts: 1
Joined: 10:25pm, Thu 12 Mar, 2009

Same need too

Postby yourownfriend » 5:25am, Wed 25 Mar, 2009

I'm actually trying to do the same for my website but was wondering if you can share the code that you are using for your customized subscription page and if you figure it out please share that too, thanks!
yourownfriend
phpLister
 
Posts: 9
Joined: 5:22am, Wed 25 Mar, 2009

Re: AJAX Signup Module

Postby yonation » 7:14pm, Sat 12 Dec, 2009

BUMP. any success with this? i know how to do the ajax, but i need to know how to send headers. i even used firebug to see the http headers sent:

Code: Select all
http://mydomain.org/newsletter/?p=subscribe&id=1&VerificationCodeX=&email=jimmybaloney%40hellodolly.com&htmlemail=1&list%5B1%5D=signup&listname%5B1%5D=members&makeconfirmed=1&subscribe=Subscribe


i get sent back to the subscribe page. when i click submit, it works. what gives? what is it checking for that can't be sent through POST headers???
yonation
phpList newbie
 
Posts: 2
Joined: 7:12pm, Sat 12 Dec, 2009

Re: AJAX Signup Module

Postby calete » 2:46am, Mon 01 Mar, 2010

Hi everyone :D :

I have successfully do it. First, I have noticed that the data sended by the ajax post omits the "subscribe/Submit" value/Button, so I made a hidden input, with the name "subscribe" and some value (anything); then I rename the submit button, so the code is:

Code: Select all
<input type="submit" name="accion" id="accion" value="Submit" />
<input type="hidden" name="subscribe" value="it's done" />
calete
phpList newbie
 
Posts: 2
Joined: 2:39am, Mon 01 Mar, 2010

Re: AJAX Signup Module

Postby compextra » 11:25pm, Sun 07 Mar, 2010

To all of you who have limited success in getting AJAX to work with the subscribe page, try this step!

<drumroll>...</drumroll>

#1) When creating your AJAX function, be sure to set the URL you are posting to...INCLUDING the
Code: Select all
 ?p=subscribe&id=1
part.
For whatever reason, as the form is processed through ./lists/index.php and ./lists/admin/subscribelib2.php, it appears that the subscribe/unsubscribe and the subscribe page id are retrieved by GET, where as the actual newsletters, email, verification code, etc. , are obtained via POST.

Although still not properly doctored up...I'm posting all the code I wrote and appears to work.
Code: Select all
function frmValidate()
{
   //declarations
   var x; var y; var strErrors; var strURL;

   //the HTML DIV where the errors will show up.
   document.getElementById('subscribebox_errors').innerHTML="";

   //function call....returns how many checkboxes have actually been checked. 
   var x = numberChecked();
   
   //function call....uses regular expressions to validate if the value in the email form box is
   //indeed a valid email.  Please note, I had to add an actual ID tag to the form, not just use
   //the HTML name tag.

   var y = validateEmail(document.getElementById('ml_email').value);
   
   //if neither a checkbox is checked, or it's not a valid email.
   if( (!(x>=1)) || (!y) )

   {
      //build the error text/html string
      strErrors='<ul class="error_text">Errors found:';
      
      if(!(x>=1))
      {
         strErrors = strErrors + '<li>Please select at least one newsletter.</li>';
      }
         
      if(!y)
      {
         strErrors = strErrors + '<li>Please input a valid e-mail address.</li>';
      }
   
      strErrors = strErrors + '</ul>';

      //write the error HTML to the appropriate error area.
      document.getElementById("subscribebox_errors").innerHTML=" " + strErrors;
   }
   
   else if( (x>=1) && (y=1) )
   {
      //its all good!  Begin the AJAX post procedure.
      ajaxSendSubscribeInfo();
   }
   else
   {
      //if you get here, something went really wrong.
      alert('Error!');
   }

}

function ajaxSendSubscribeInfo()
{
   //declarations
   var urlStr; var urlParams; var returnResponse;
   var sForm;
   var xmlhttp;


   //standard AJAX object creation
   if (window.XMLHttpRequest)
   {// code for IE7+, Firefox, Chrome, Opera, Safari
      xmlhttp=new XMLHttpRequest();
   }
   else
   {// code for IE6, IE5
      xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
   }

   //place your PHPList URL here.  IMPORTANT! Be sure to add ?p=subscribe and the &id= if you are using these functions.
   
   urlStr = 'http://www.mydomain.org/lists/?p=subscribe&id=2';
   
   //declare your AJAX form
   sForm = document.forms["subscribeform"];
   
   //prepping POST post string.  Should probably use a proper URL encoding.  Haven't got there yet.
   urlParams = urlParams + '&email=' + escape(sForm.elements["email"].value);

   //iterate through all the checkboxes.  IMPORTANT side note regarding PHPLIST.  The list names in your form must be in this format.
   // list[1]=signup list[2]=signup etc.  Be sure to use the word "signup" (all lower case, no spaces) as the value for each list, or
   // phplist won't recognize it.

   for(var i=0;i<sForm.elements.length;i++)
   {
      if( (sForm.elements[i].type=="checkbox") && (sForm.elements[i].checked) )
         {   
               urlParams=urlParams + '&' + escape(sForm.elements[i].name) + '=' + escape(sForm.elements[i].value);      
         }
   }
   
   //must add the subscribe variable to the POST parameters. 
   urlParams = urlParams + '&subscribe=hitme';

   
   //Start POSTING via AJAX.
   xmlhttp.open("POST",urlStr,true);

   //Send the proper header information along with the request
   xmlhttp.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
   xmlhttp.setRequestHeader("Content-length", urlParams.length);
   xmlhttp.setRequestHeader("Connection", "close");
   
   xmlhttp.onreadystatechange = function()
   {
      if (xmlhttp.readyState == 4)
      {

         if (xmlhttp.status == 200)
         { // only if "OK"
         
            var returnResponse = String(xmlhttp.responseText);
            document.getElementById('subscribebox').innerHTML="Thank you for subscribing.  Please check your email for information about confirming your subscription.";
         }
      
         else
         {
               document.getElementById('subscribebox').innerHTML="An Error has occured while submitting your request.  Please contact the webmaster.";
         }
      }
   }

   xmlhttp.send(urlParams);
}

function validateEmail(elementValue)
{
   var emailPattern = /^[a-zA-Z0-9._-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/;
   return emailPattern.test(elementValue);
}


function numberChecked()
{
   var numChecked = 0;
   
   var sForm = document.forms["subscribeform"];

   for(var i=0;i<sForm.elements.length;i++)
   {   
      if( (sForm.elements[i].type=="checkbox") && (sForm.elements[i].checked) )
      {   
            numChecked++;      
      }
   }
   
   return numChecked;
}


I hope this saves you many hours. Thanks to the developers for this product!
compextra
phpList newbie
 
Posts: 1
Joined: 10:43pm, Sun 07 Mar, 2010

Re: AJAX Signup Module

Postby yonation » 9:43pm, Sun 15 Aug, 2010

hey all, i've gone ahead and made an ajax phplist signin plugin for wordpress.

follow here and download: http://www.social-ink.net/blog/yphplista-an-ajax-wordpress-plugin-for-phplist-integration
yonation
phpList newbie
 
Posts: 2
Joined: 7:12pm, Sat 12 Dec, 2009

Re: AJAX Signup Module

Postby hort » 11:43am, Tue 28 Sep, 2010

It's my time to give back....

Code: Select all
<form action="" method="" id="newsletter">
<input type="hidden" name="VerificationCodeX" value="" />
<input type="hidden" name="list[2]" value="signup">
<input type="hidden" name="listname[2]" value="Name_of_List"/>
<label for="name">Name</label> <input type="text" size="20" value="" name="attribute1" id="name" /><br />
<label for="email">E-mail</label> <input type="text" size="20" value="" name="email" id="email" />
<a href="javascript:;" onclick="$.ajax({type: 'POST', data: $('#newsletter').serialize(), url: 'lists/?p=subscribe&id=2', success: function(msg){ alert('Thank you for your registration. Please check your email to confirm.'); }})">OK</a>
</form>


Jquery used.
In this code there is no code validation, it up to you validate the user input information.

Hope this helps someone.
hort
hort
phpList newbie
 
Posts: 1
Joined: 11:30am, Tue 28 Sep, 2010

Re: AJAX Signup Module

Postby fedegonzal » 10:14pm, Tue 01 Feb, 2011

Hi all,

Somebody know why ajax posting return the same form page? I can't understand.. in my case, sometimes works and sometimes return the form :(

Thanks, Federico
fedegonzal
phpList newbie
 
Posts: 1
Joined: 10:09pm, Tue 01 Feb, 2011

Re: AJAX Signup Module

Postby Mr5o1 » 2:34am, Thu 03 Mar, 2011

compextra hit the nail on the head... you need to make sure your sending both 'get' & 'post' data with your ajax request.

the get data needs to be "?p=subscribe&id=1" or so, and then the rest of the data gets "posted"

After seeing the 'get' string in the url.. I got confused and tried to submit all the data in the url.. and then wondered why it didnt work. That cost me a few hours...
Mr5o1
phpList newbie
 
Posts: 1
Joined: 2:05am, Thu 03 Mar, 2011

Re: AJAX Signup Module

Postby zerohero1 » 8:34pm, Sun 01 May, 2011

Hi there

Can any of you post your code please? I haven't managed to get this to work, or point out why my code doesnt work? - thanks
Code: Select all

<form method="post" name="newsletter" id="newsletter" action="/lists/?p=subscribe&id=2">
    <input type="text" name="email" value="" size="40" />
    <input type="hidden" name="htmlemail" value="1" />
    <input type="hidden" name="list[2]" value="signup" />
    <input type="hidden" name="listname[2]" value="XXXX" />
    <input type="hidden" name="VerificationCodeX" value=""  />
    <input type="submit" name="subscribe" id="go" value="Subscribe to the Selected Newsletters" />
    </form>
    <span id="eee"></span>
    <script type="text/javascript">
        $(document).ready(function () {
            $('#go').click(function () {
                $.ajax({
                    type: 'POST',
                    data: $('#newsletter').serialize(),
                    url: $('#newsletter').attr('action'),
                    success: function (msg) {
                        $('#eee').html(msg);
                        alert('Thank you for your registration. Please check your email to confirm.');
                    }
                })


                return false;
            });

        });
    </script>
zerohero1
phpList newbie
 
Posts: 1
Joined: 8:31pm, Sun 01 May, 2011

Re: AJAX Signup Module

Postby conrado » 9:46pm, Wed 04 May, 2011

Hi zerohero1,

Out of the multiple problems that there might actually be, I would start diagnosing your problem at the beginning...

1- You might not have configured phplists properly. (have you tested it to confirm it is working?)
2- Have you created the appropriate lists?
3- Are you using including jQuery properly in the html?

If all that is working fine, I suggest you brush up on some programming skills such as using a debugger. There are very good tools out there such as Firebug and Venkman. If you could be a little more specific rather than asking people to paste code we could be more specific with hints.

Best,
Conrado.
conrado
phpList newbie
 
Posts: 1
Joined: 9:37pm, Wed 04 May, 2011

Re: AJAX Signup Module

Postby borsodas » 3:20am, Tue 12 Jul, 2011

I used the above code, and it loaded the success message but no confirmation was sent.

jquery is loaded on my page, as i have working effects.

php list is configured, if i go directly to the sign up page lists/?p=subscribe i can register.
borsodas
phpLister
 
Posts: 8
Joined: 3:39pm, Sat 23 Apr, 2011

finally got it to work

Postby borsodas » 4:18am, Thu 14 Jul, 2011

after comparing headers between my ajax page that did not work and the standard phplist submit form i found that the name value pair <input type=submit name="subscribe" value="Subscribe" onClick="return checkform();"> were not going through. so i added them into a hidden input and it now works. possibly because of "return false" in the ajax call. but it works now!
borsodas
phpLister
 
Posts: 8
Joined: 3:39pm, Sat 23 Apr, 2011

Re: finally got it to work

Postby atlanteavila » 3:25pm, Sun 24 Jul, 2011

borsodas wrote:after comparing headers between my ajax page that did not work and the standard phplist submit form i found that the name value pair <input type=submit name="subscribe" value="Subscribe" onClick="return checkform();"> were not going through. so i added them into a hidden input and it now works. possibly because of "return false" in the ajax call. but it works now!

Any chance you can post your full working code? Thanks a million!
atlanteavila
phpList newbie
 
Posts: 1
Joined: 7:51pm, Tue 21 Jun, 2011

Re: AJAX Signup Module

Postby borsodas » 6:09pm, Tue 26 Jul, 2011

this is the site with the code in it

http://www.officeyoganyc.com/
borsodas
phpLister
 
Posts: 8
Joined: 3:39pm, Sat 23 Apr, 2011

Next

Return to Advanced Questions & Problems

Who is online

Users browsing this forum: No registered users and 0 guests