created re-usable function for rendering phone inputs and added it to job application step

This commit is contained in:
melody-universe 2021-07-18 14:42:55 -07:00
Родитель 2f0dd61c12
Коммит 4318c4913d
4 изменённых файлов: 29 добавлений и 18 удалений

Просмотреть файл

@ -13,6 +13,7 @@ module.exports = {
},
assets: {
"new-ticket.js": "starter-portal/basic-forms/new-ticket",
"application.js": "starter-portal/advanced-forms/application",
"application.js":
"starter-portal/advanced-forms/application/advanced-form-steps/01---personal-information",
},
};

Просмотреть файл

@ -1 +1,6 @@
console.log("hello!");
import domready from "domready";
import renderPhoneNumberControl from "./renderPhoneNumberControl";
domready(() => {
renderPhoneNumberControl("ce_applicantphonenumber");
});

Просмотреть файл

@ -1,20 +1,6 @@
import "react-phone-number-input/style.css";
import "react";
import ReactDom from "react-dom";
import PhoneInput from "react-phone-number-input";
import domready from "domready";
import renderPhoneNumberControl from "./renderPhoneNumberControl";
domready(() => {
const defaultInput = document.getElementById("ce_phonenumber");
defaultInput.style.display = "none";
const phoneContainer = defaultInput.parentElement;
phoneContainer.parentElement.appendChild(defaultInput);
ReactDom.render(
<PhoneInput
onChange={(value) => (defaultInput.value = value)}
value={defaultInput.value}
defaultCountry="US"
/>,
phoneContainer
);
renderPhoneNumberControl("ce_phonenumber");
});

Просмотреть файл

@ -0,0 +1,19 @@
import "react-phone-number-input/style.css";
import "react";
import ReactDom from "react-dom";
import PhoneInput from "react-phone-number-input";
export default function renderPhoneNumberControl(columnName) {
const defaultInput = document.getElementById(columnName);
defaultInput.style.display = "none";
const phoneContainer = defaultInput.parentElement;
phoneContainer.parentElement.appendChild(defaultInput);
ReactDom.render(
<PhoneInput
onChange={(value) => (defaultInput.value = value)}
value={defaultInput.value}
defaultCountry="US"
/>,
phoneContainer
);
}