[SOLVED] Newsletter missing from POST request of data-members-form

Themes
1

[SOLVED] by upgrading to latest version of Ghost

Hello everyone,

I am trying to implement two different newsletter signup forms on different pages in my theme.I am following the instructions at Ghost Theme Development: Building custom membership flows

However, when I specify which newsletter the data-members-form should be signing up for, with the hidden input element, it does not work. The only way to get a member to sign up for a newsletter is to have that newsletter automatically subscribe new members to it, and for the member to not exist before signup.

If the member already exists, the form just acts as a login form, with no signup e-mail ever sent, even though I am specifying data-members-form=ā€œsubscribeā€

Here is the html from my theme

<form data-members-form="subscribe">
    <input type="email" name="email" data-members-email required="true" autocomplete="off">
    <input data-members-newsletter type="hidden" value="Test Newsletter" />
    <button type="submit">SUBSCRIBE</button>
</form>

This form will never cause a member to be signed up to receive the ā€œTest Newsletterā€, but according to the instructions in the Ghost docs it should. Any help would be very much appreciated.

2

I think you need the slug of the newsletter, not itā€™s nameā€¦

3

Hi Cathy_Sarisky thank you very much for replying! In the ghost docs they donā€™t appear to be using slugs, but rather the title of the Newsletter:

<form data-members-form>
  ...
  <input data-members-newsletter type="hidden" value="Weekly Threads" />
  <input data-members-newsletter type="hidden" value="Shocking Revelations" />

  
  <button type="submit">Subscribe</button>
</form>

Where do I find or set the Newsletter slug?

4

When I edit my newsletter, there is a slug of random numbers and letters in the URL, I tried that and it still does not work.

5

let me give it a try on my test setup.

6

Hey @jordankittle

I just tried it out and it worked OK for me, using the newsletter name. Are you sure it isnā€™t working for you? Where does it go wrong? Do you not get a magic link, or do you not see the subscriptions appear in your account after you click the magic link ? (Until the subscriber clicks the link, they arenā€™t going to show up as subscribed.)

I tried it with two newsletters, exactly like you have it, too. Worked fine!

7

Hey Cathy,

My situation is that after the user submits the form they are not subscribed to the newsletter.

I am getting the magic link and clicking it. Sorry forgot to add that.

8

I have tried deleting my member and using the form as a new member, and when the member already exists. In the case that the member already exists I get a sign-in e-mail only, as expected per Ghost docs. When the member doesnā€™t exist I get a subscribe e-mail as expected, but in both cases the user is not added to my 2nd Newsletter, even though I have copied the Newsletter name and then Ctrl+F to verify it in my code editor where I specify the value of the newsletter in the hidden input element. And even though the magic link is being received and clicked.

9

Super weird! Which version of Ghost? Is the site online so I can try it? :)

10

It is very weird! Yes the site is online but the page with the second signup form hasnā€™t been released yet. Maybe I can make a test route for you. Edit: DMā€™ed you the link!

11

So thatā€™s interesting. I can see where you have <input data-members-newsletter="" type="hidden" value="JAN3 Financial">

But when I submit, the ā€˜newslettersā€™ part of the POST is missing. So it seems like the Portal code that should process that submission is not quite working right - itā€™s definitely a problem on the POST side, not the API side.

1 Like
12

Thank you for checking on that for me! Is this something I should open a support ticket with Ghost for?

Edit: Youā€™re right! I just inspected the network request for the magic link and there is nothing about which newsletters. The only thing that comes to mind is that there are two forms on this page, one is for mobile. Maybe something is having trouble with two data-members-newsletter elements on the same page.

13

I have submitted the form too many times for testing and am getting errors now. When I can I will test the form in mobile view to see if that form also submits without the newsletters in the POST request.

14

I donā€™t think itā€™s a Ghost support issue. Iā€™m not even sure itā€™s a generalizable bug (which would merit raising an issue on Github). I suspect itā€™s something to do with the other javascript on the page --thereā€™s a lot going on!

If you create a very simple page with just that little bit of html, does it work correctly? I see you have some other code also firing on the ā€˜subscribeā€™ button click - I wonder if thatā€™s interfering?

For comparison, hereā€™s a correctly formatted POST from the simple example.

Code:

<form data-members-form="subscribe">
    <input type="email" name="email" data-members-email required="true" autocomplete="off">
    <input data-members-newsletter type="hidden" value="Cathy's second newsletter" />
      <input data-members-newsletter type="hidden" value="CSOFutures" />
    <button type="submit">SUBSCRIBE</button>
</form>

POST (as seen in dev tools, goes to /members/api/send-magic-link/:

{
  "email": "me+teststringsoIcanmakemoreaccounts@gmail.com",
  "emailType": "subscribe",
  "labels": [],
  "autoRedirect": true,
  "urlHistory": [
    --bunch of stuff removed -- 
  ],
  "newsletters": [
      {"name": "Cathy's second newsletter" },{ "name": "CSOFutures" }
  ]
}
15

I just commented out the entire event listener on the submit button. Still no newsletter data in the POST request. :(

16

Boo. :( It might be time to make a new template and strip everything out of it to make sure THAT works, then start adding bits back until you break it?

ALTERNATIVELY, thereā€™s no reason you have to use the Portal form setup at all. You just have to construct the post request, and you can 100% do that manually. So you could remove the data-members-form, data-members-newsletter, etc, and just make your post request to one of your existing event listeners bound on that buttonā€¦

Iā€™m not sure which is going to be easier at this point.

1 Like
17

Thank you that sounds like a good solution if I canā€™t find any other way! I am testing right now on a basic page with a single form.

18

I removed all event listeners from all buttons and still the same POST request. I think at this point I will have to try it the way you described and build the request myself.

19

Thank you very much for all your help. One last question, this Ghost version is [5.60.0], which version did you use on your test site?

20

Iā€™ve got 5.68 on my test site.

1 Like