taulant-iban-element

[marsh hill]

Hi there

Can you share your code here?

[fleet pond]

this is the code I am using to confirmSepaDebitSetup

[marsh hill]

Thanks

[fleet pond]

this si the code I use to initialize the ibanElement

[dreamy breach]

taulant-iban-element

@fleet pond can you share real code instead of pictures of code?

[fleet pond]

yes sure

one moment please

[dreamy breach]

also can you share which exact doc you are following?

[fleet pond]

    const result = await this.paymentService.getStripeClientSecret(this.vertragsvorlageBeduerftigeComponent?.contractModel?.id);

    this.clientSecret = result.clientSecret;
    const options = {
      clientSecret: this.clientSecret,
      // appearance: {},
    };
    this.stripe = Stripe(environment.stripe.pk, result.account);
    this.elements = this.stripe.elements(options);
    // Create and mount the Payment Element
    this.ibanElement = this.elements.create('iban', {
      // classes: 'base',
      supportedCountries: ['SEPA'],
      placeholderCountry: 'DE',
      style: {
        base: {
          padding: 40,
          fontSize: '18px',
        },
      },
    });
    this.ibanElement.mount('#iban-element');
  }```

    this.stripe
      .confirmSepaDebitSetup(this.clientSecret, {
        payment_method: {
          sepa_debit: this.ibanElement,
          billing_details: {
            email: this.vertragsvorlageBeduerftigeComponent.formGroup.get('paymentData')?.get('email'),
            name: this.vertragsvorlageBeduerftigeComponent.formGroup.get('paymentData')?.get('fullName'),
          },
        },
      })
      .then((setupIntent: any) => {
        if (setupIntent.status !== 'succeeded') {
          // failed
        } else {
          // setupIntent
        }
      })
      .catch((ex: any) => {
        console.log(ex);
      });
  }```

[dreamy breach]

also the error doesn't seem to be about Stripe or the IBANElement right?

it taks about your own FormGroup

Can you try just in a simple example without any form or anything and calling the confirmSepaDebitSetup() call? It should just work and confirm the problem is unrelated

[fleet pond]

this is the error:

    --> starting at object with constructor 'FormGroup'
    |     property 'controls' -> object with constructor 'Object'
    |     property 'personalData' -> object with constructor 'FormGroup'
    --- property '_parent' closes the circle: object with constructor 'FormGroup'
    |     property 'controls' -> object with constructor 'Object'
    |     property 'personalD

the html code is:

    <div id="iban-element">
      <!-- Elements will create form elements here -->
    </div>
    <button (click)="submitIban()">Submit</button>
  </div>```

[dreamy breach]

yeah that's my point right now it all seems unrelated to the IBAN code

[fleet pond]

so @dreamy breach , the code above shared from your perspective is correct?

[dreamy breach]

@fleet pond It seems correct. It's hard to say honestly. My advice is to basically do a standalone HTML/JS file that just mounts that specific Element and then a button to confirm, nothing else, no form, no form submission, etc.

[fleet pond]

alright, thank you @dreamy breach I will try that out

@dreamy breach u were right. Thanks 🙏