Using the solution from above, provide an external JavaScript code that will validate all the fields of the form using the following criteria: a) Name field must not be empty. b) Phone number must accept the regular expression pattern: "[0-9]{3}-[0-9]{3}- [0-9]{4}" c) Email address must not be empty and must be tested against the regular expression: /^\S+@\S+\.\S+$/ d) The Gender field field must not be empty. Use the following in the list: 1. Select an option 2. Female 3. Male 4. Prefer not to say e) The amount field must not be empty. It must only accept numeric entries between 1 and 1000 f) The Fund field must not be empty. Use the following in the list: 1. Select an option 2. Building 3. Accommodation 4. Food g) If validation passes, display an alert that captures all what the user has entered in the form as shown in Figure 2.
About Pearson Charitable Foundation Pearson announced today that, to support and increase its efforts to maximise social impact, it will integrate its corporate responsibility activities and functions into its business and, as of 2015, will no longer fund the Pearson Charitable Foundation as the primary vehicle for its philanthropic and community activities. Having been informed of this change in its funding, the Foundation Board of Directors on November 17 passed a resolution to wind down its operations and close at the end of 2014. Since 2003, the Foundation has contributed more than $130 million to programs that improve learning opportunities for people throughout the United States and globally. Pearson Charitable Foundation Chief Executive, Mark Nieker, said: “The Foundation is proud of the contribution it has made for teachers and students around the globe in the course of our history, with the support of Pearson and our other funders. We would like to extend our thanks to the vast number of organizations, institutions, teachers and students we have had the privilege to work alongside.” Pearson is working with the Foundation team to facilitate the transition of the Foundation’s work and programs to ensure that the interests of its charitable partners and beneficiaries are protected. Some programs will draw to a close, while others will be taken forward by other charitable organizations that share the Foundation’s mission and values.
Design a contact form using HTML and CSS that resembles the one shown in Figure 1. Ensure placeholders are used as well.
Using the solution from above, provide an external JavaScript code that will validate all the fields of the form using the following criteria:
a) Name field must not be empty.
b) Phone number must accept the regular expression pattern: "[0-9]{3}-[0-9]{3}- [0-9]{4}"
c) Email address must not be empty and must be tested against the regular expression: /^\S+@\S+\.\S+$/
d) The Gender field field must not be empty. Use the following in the list:
1. Select an option
2. Female
3. Male
4. Prefer not to say
e) The amount field must not be empty. It must only accept numeric entries between 1 and 1000 f) The Fund field must not be empty. Use the following in the list:
1. Select an option
2. Building
3. Accommodation
4. Food g) If validation passes, display an alert that captures all what the user has entered in the form as shown in Figure 2.
Step by step
Solved in 2 steps
