Forum

Thread tagged as: Question, Problem, Members

Member registration with no refresh

Hi All

On contact forms, I usually plump for trapping the submit request and handling the post through an ajax call, just because I believe it looks nicer to keep the form and contents visible and showing a thank you message.

So, I thought I'd do the same for the members registration form, but for some reason it doesn't work. I have stepped through the code and there are no errors both in the client side scripts or the server side. As I stated, I have done this loads of times but this is the first time with the registration form. Is there anything in the members app that could be preventing this?

Thanks in advance!

My client side script is:

$("#form-register").submit(function(e) {

   //prevent Default functionality
   e.preventDefault();

   //get the action-url of the form
   var actionurl = e.currentTarget.action;          

   // post the values to perch
   $.ajax({
      url: actionurl,
      type: 'post',
      dataType: 'json',
      data: $("#form-register").serialize(),
      success: function(data) {
         $("#success-message").fadeIn();
     $("#submit").attr("disabled", true);
      },
      error: function (err) {
            if (err.status != 200) {
               alert(err.status + " - " + err.statusText);
            }
      }
   });

});
Michael Wilkinson

Michael Wilkinson 6 points

  • 6 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

What result do you get?

Michael Wilkinson

Michael Wilkinson 6 points
Registered Developer

Hi Drew

I get the success message fading in and the submit button disables as expected, but looking in Perch, I see no new member data pending. If I remove the code and the page does a refresh, everything works perfectly. Oddly, I have used the exact same script with the contact form on this particular site, and everything behaves as it should.

When I step through the script, all variables are assigned the right values, the ajax call behaves as expected and no errors are raised at all, but the data doesn't seem to get to Perch.

Thanks.

Drew McLellan

Drew McLellan 2638 points
Perch Support

Are you able to return the debug for the post response?

Michael Wilkinson

Michael Wilkinson 6 points
Registered Developer

Hi Drew

I've managed to get it working and it was down to the template. When I added the ajax code, I changed the form id in the template and also added the 'prefix="none"' attribute to make it a bit cleaner. I did go in to the 'form' section in the members app within Perch and re-save everything but then I noticed the key was set to 'register.default' and it never seems to change. I changed the form id back to the default and removed the prefix attribute and now it's working perfectly.

I'm guessing I could have changed the key in the database to reflect the from id maybe, but thought it easier to just change it back.

So, if anyone has this issue, once you've registered your form within Perch, changing the id of the form doesn't update the key. I think I'm right in saying that you'd need to delete the form from the members app and re-register it so it gets a new key.

Thanks for your time as always Drew.

Drew McLellan

Drew McLellan 2638 points
Perch Support

Ah ha! Good detective work.