DGNum/demarches-normaliennes
15
1
Fork 0
Code Issues 1 Pull requests Projects Releases Packages Wiki Activity

Merge pull request #7479 from betagouv/feat/7478

Browse source 
ETQ Usager, je veux entrer mon Iban de manière plus simple
This commit is contained in:
Kara Diaby 2022-06-22 16:58:32 +02:00 committed by GitHub
commit b35aeb778a
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 17 additions and 1 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

13
app/javascript/controllers/iban_input_controller.ts Normal file
View file

@ -0,0 +1,13 @@
import { ApplicationController } from './application_controller';
export class IBANInputController extends ApplicationController {
connect() {
this.on('input', (event) => {
const target = event.target as HTMLInputElement;
target.value = target.value
.replace(/[^\dA-Z]/g, '')
.replace(/(.{4})/g, '$1 ')
.trim();
});
}
}

2
app/javascript/controllers/index.ts
View file

@ -13,6 +13,7 @@ import { TurboEventController } from './turbo_event_controller';
import { TurboInputController } from './turbo_input_controller';
import { TurboPollController } from './turbo_poll_controller';
import { TypeDeChampEditorController } from './type_de_champ_editor_controller';
import { IBANInputController } from './iban_input_controller';
const Stimulus = Application.start();
Stimulus.register('autofocus', AutofocusController);
@ -28,3 +29,4 @@ Stimulus.register('turbo-event', TurboEventController);
Stimulus.register('turbo-input', TurboInputController);
Stimulus.register('turbo-poll', TurboPollController);
Stimulus.register('type-de-champ-editor', TypeDeChampEditorController);
Stimulus.register('iban-input', IBANInputController);

3
app/views/shared/dossiers/editable_champs/_iban.html.haml
View file

@ -2,4 +2,5 @@
id: champ.input_id,
placeholder: "27 caractères au format FR7630006000011234567890189",
required: champ.mandatory?,
aria: { describedby: champ.describedby_id }
aria: { describedby: champ.describedby_id },
data: { controller: 'iban-input'}