When I think about the 402 error that suddenly appeared in the middle of the introduction of PAY.jp, there was an unexpected place

Today, I have already done the task of introducing Pay, jp and processing payments with a credit card, and I would like to describe the 402 error that appeared on the console in the middle stage.

What does the 402 error mean?

402 Payment Required (Reservation code for future use) http://www5.plala.or.jp/vaio0630/mail/st_code.htmより That's right, but I didn't understand the meaning even if I saw this. If you look a little closer, it says that it is not currently implemented due to an error that appears when payment is required. The description at that time was like this.

hoge.js

const formResult = document.getElementById("charge-form");
    const formData = new FormData(formResult);

const card = {
      number: formData.get("item[number]"),
      cvc: formData.get("item[cvc]"),
      exp_month: formData.get("item[exp_month]"),
      exp_year: `20${formData.get("item[exp_year]")}`,
    };

    Payjp.createToken(card, (status, response) => {
      if (status == 200) {
        const token = response.id;
        console.log(token)
      }
    }); //Not all, some omitted//

In the part from Payjp.createToken ~, if the status code is 200 (200 means success) in the if statement, the token information is displayed on the console. Considering this and 402, I reviewed the description from const card ~. Up to that point, I had a good log, and this is the only reason for the reservation code.

index.html.erb

<%= form_with model: @item, url: item_purchases_path, id: 'charge-form', class: 'transaction-form-wrap',local: true do |f| %>

I was pulling the id of this part from the above view code. First of all, the reason for the error was that the @item part had to bring in a different instance. Lol On the contrary, I wondered why @item worked normally so far. It's a rudimentary error when I try to solve it, but it worked fine up to this point, which caused confusion and took a lot of time to solve: joy:

Summary

Until now, when thinking about the reason for the error, if it was rails, the error amount was solid and it was better to check the error under MVC. And even with regard to JS, I felt that I was blind spotted this time because there were many basic parts so far, and the error part was almost a mistake without JS. The description of rails is correct because it was so successful! It took me an hour and a half, but it was a very valuable experience to know that there was a postpaid feeling of such an error. I'm very sorry for the title of 402 error. Lol Thank you for reading.