A
Anonymous

Customer Billing Form - Copy this Angular, Tailwind Component to your project

Add-a-new-"Customer-Address-Line-2"-field-in-"Customer-Billing-Information"-section.-The-value-entered-in-this-field-should-automatically-populate-the-"Address-Line-2"-field-on-the-"Billing-Contact"-page-within-the-"Contacts"-tab-for-both-Customer-and-Enterprise-accounts.-(See-Attachment-6).-Add-"Customer-Address-Line-2"-row-in-the-"Preview".-Add-a-new-checkbox-under-the-current-fields-in-"Customer-Billing-Information"-section,-with-the-label-"Please-check-this-box-if-the-billing-address-differs-from-the-service-address."-Add-"Billing-Address-matches-Service-Address"-row-in-the-"Preview",-and-set-the-default-value-to-"Yes".-3.-"Customer-Service-Address"-Section-(See-Attachment-2)-When-the-newly-added-checkbox-is-selected,-display-a-new-"Customer-Service-Address"-section,-containing-fields-related-to-the-service-address.-The-new-section-and-fields-should-also-appear-in-the-"Preview".-Additionally,-the-value-of-"Billing-Address-matches-Service-Address"-should-be-updated-to-"No"-in-the-"Preview".-The-following-fields-are-included-in-the-new-section-Company-Name-(pre-filled-from-the-corresponding-field-above,-editable,-and-required).-Contact-Email-Address-(pre-filled-from-the-corresponding-field-above,-editable,-and-required).-Customer-Phone-Number-(pre-filled-from-the-corresponding-field-above,-editable,-and-required).-Authorized-User-First-Name-(pre-filled-from-the-corresponding-field-above,-editable,-and-required).-Authorized-User-Last-Name-(pre-filled-from-the-corresponding-field-above,-editable,-and-required).-Customer-Address-(required)-Customer-Address-Line-2-(optional)-Customer-City-(required)-Customer-State-(required)-Customer-Zip-(required)-Country-(required)-IMPORTANT:-Fields-under-the-"Customer-Service-Address"-section-should-follow-the-same-validation-rules-as-the-corresponding-fields-above-(e.g.-phone-number-should-be-10-digit)-Values-entered-in-these-fields-should-be-reflected-in-real-time-in-the-"Preview",-consistent-with-the-behavior-of-the-other-fields.-Changes-in-"E911"-Tab-in-Order-Forms-The-following-updates-should-be-made-to-the-"E911"-tab-in-the-specified-forms-(4th-tab-in-the-"New-Customer"-form,-and-5th-tab-in-the-"Add-Group-to-an-Enterprise"-form).-(See-Attachment-3).-1.-Field-Updates-Rearrange-the-fields-under-this-tab,-and-in-the-"Preview".-Eliminate-the-"Please-check-this-box-to-skip-911-service"-and-"Use-Address-from-Customer-Information"-checkboxes.-Remove-the-"e911"-row-from-the-"Preview"-Rename-the-"State"-field-to-"Customer-State".-Add-a-new-"Country"-field-Merge-"Customer-Floor",-"Customer-Suite",-and-"Customer-Bldg"-fields-into-a-single-field-named-"Customer-Address-Line-2."-The-new-field-should-be-optional-and-have-a-character-limit-of-20.-If-the-character-limit-is-exceeded,-validation-and-error-messages-should-match-the-behavior-of-the-e911TN-field-on-the-same-page.-All-changes-above-should-be-reflected-in-the-"Preview"-2.-Pre-fill-Fields-All-fields-on-this-tab-should-automatically-be-pre-filled-with-the-data-from-the-corresponding-fields-in-the-"Customer-Service-Address"-section-on-the-Customer-tab.-If-the-"Customer-Service-Address"-section-is-not-available,-pre-fill-the-fields-with-data-from-the-"Customer-Billing-Information"-section-instead.-All-fields-should-be-editable-The-field-mappings-are-as-follows:-E911-Field-Corresponding-field-from-Service-Address/Billing-Information-Customer-Address-Customer-Address-Customer-Address-Line-2-Customer-Address-Line-2-Customer-City-Customer-City-Customer-State-Customer-State-Customer-Zip-Customer-Zip-Country-Country-e911TN-Customer-Phone-Number

Prompt
Component Preview

About

Customer Billing Form - Add Address Line 2, checkbox for service address differences, and real-time preview. Built with Angular and Ta. Get component free!

Share

Last updated 1 month ago