WEBVTT 00:01.050 --> 00:06.960 So let's keep working on our JavaScript and first of all, on line one hundred and twenty seven on my 00:06.960 --> 00:14.070 page, labeled or named Brons Dash Plan Page HTML, I love the art of stripe and I added that before 00:14.070 --> 00:16.630 I posted the source code and I was just sloppy on my part. 00:16.650 --> 00:17.320 My apologies. 00:18.480 --> 00:23.790 So we're working on this function stripe payment method handler and we're handling the situation where 00:23.790 --> 00:24.450 there's no error. 00:24.510 --> 00:26.500 In other words, we've got our payment method. 00:28.230 --> 00:33.540 So what we're going to do now is, as the comment says, create a customer and subscribe to a plan. 00:34.110 --> 00:38.250 Now, obviously, we're going to be calling some things that don't exist on the back end yet, but let's 00:38.250 --> 00:41.220 get started writing it and we'll take care of the backend before too long. 00:41.820 --> 00:46.710 So first of all, if we want to create a customer and we're going to create a payload and send Jason 00:46.710 --> 00:54.690 to the back end, so I'll create a payload variable that payload equal and it'll be a JavaScript object 00:56.640 --> 00:57.820 and I'll put a few things in here. 00:57.840 --> 01:01.200 So the plan, for example, that's something we definitely want to know. 01:01.230 --> 01:03.180 What plan are we subscribing the person to? 01:03.660 --> 01:09.750 And of course, because we have that now in the widget variable, we can simply put in single quotes, 01:09.750 --> 01:16.020 dollar sign widget DOT plan ID and then close off our single quotes. 01:18.160 --> 01:25.060 We also want the payment method, payment method, payment underscore method, and that is going to 01:25.060 --> 01:31.240 be equal to from the result that was handed to this function dot payment method. 01:31.750 --> 01:33.160 We're getting this from strike, of course. 01:34.870 --> 01:42.970 And we also want the email and I suggest document get element by ID and we're looking for cardholder 01:44.740 --> 01:51.750 email value in the last four digits of the credit card. 01:52.270 --> 02:01.650 And that's from result dot payment method, lowercase P. payment method, dot card to last for. 02:01.990 --> 02:03.230 And that's probably enough for now. 02:04.330 --> 02:05.280 So that's our payload 02:07.840 --> 02:12.910 now, just as we did last time, will create some request options to request options. 02:14.050 --> 02:21.010 And that will be equal to a JavaScript object and our method will be post. 02:23.120 --> 02:28.640 And our headers will be equal to an object with two elements. 02:30.860 --> 02:40.270 The first one is accept, and the value is applications, Jason, and the second one is content type. 02:43.840 --> 02:47.140 Which is also application, Jason. 02:53.440 --> 03:06.850 And our body will be Jason Stringfield and we're stratifying fine pillow, OK, once we have our payload 03:06.850 --> 03:13.680 and our request options now we can call, fetch and we'll call a non-existent URL on the back end fetch. 03:14.050 --> 03:17.230 And again, it's going to be using API. 03:17.230 --> 03:26.170 So we have the correct prefix to our URL and we'll make this API slash, create dash customer dash and 03:26.320 --> 03:30.220 dash subscribe dash to dash plant. 03:30.250 --> 03:34.790 It's long, but it's very descriptive and it tells me exactly what's going on and we'll put a request 03:34.790 --> 03:35.620 to options in there. 03:36.430 --> 03:41.470 Then we'll call then and get our response and we'll convert it to Jason. 03:43.090 --> 03:44.320 Response to Jason. 03:49.200 --> 03:56.900 Then we'll have a function data and we'll just for right now, we'll say console log data has. 04:00.430 --> 04:03.410 Console the log data. 04:03.460 --> 04:05.810 We can't do anything until we get the actual back end written. 04:06.470 --> 04:18.520 We also want to say hi to our processing button processing class list, dot and dash, none bootstraps 04:18.520 --> 04:19.830 hide this class. 04:21.370 --> 04:27.250 And after that, we will say set in verse in our form and we'll have to change those. 04:27.250 --> 04:30.070 But, well, we'll do that and then we'll submit the form. 04:31.570 --> 04:34.050 And all of that requires some work on the back end. 04:34.060 --> 04:35.170 But this is a good start. 04:35.470 --> 04:41.980 So in the next lecture, we'll start working on the back end that you, Earle, fetch whatever the approval 04:41.980 --> 04:45.500 is opposed to create customer unsubscribed plan. 04:45.520 --> 04:47.400 We'll get started on that in the next election.