List of forms on a webpage - html

I want to display a list of contact addresses.
Each contact has information such as name, street, city, country, phone, email, website, ...
There are several hundred addresses I have to display.
A contact has to be editable on demand. That is if the user clicks an "edit" button on the side.
Now here is my issue: Is it appropriate to have several hundred forms on page which I activate with the click on the button?
Or is it better to display the data in a <div>, <p> layout and have something like a modal with the form popup?
Does it cause problems to have so many forms?

Having so many forms will cause the webpage to become bulky and slow, and it will be a hassle to maintain. In order to avoid having hundreds of forms on one page, you can have a single form which is dynamically edited according to which contact address the user selects.

There is no problem. MDN approves of multiple forms in one page.
https://developer.mozilla.org/en-US/docs/Web/HTML/Element/form

Related

Provide editable functionality for fields in a webpage

I have a web page showing multiple fields and a button for each of the fields which are editable.
As an example a page is showing name, age, address, nationality,salary and gender out of which say address and salary are editable. There are 2 update buttons at the bottom of the page namely
update salary
update address
Clicking on each of these buttons opens a form for the necessary edits. I would like to move the edit next to the displayed field where ever applicable and show it as a pencil. This way the page will look less cluttered when multiple fields are editable.
Any suggestion as to what can be used? I have bootstrap 4.x in my project but not sure what to use from here as I have some basic idea on Bootstrap. The project is based on Angular.

Boltforms multiple (same) forms on 1 page sent twice

When I have multiple forms on one page with boltforms the submission sent twice. It are two the same forms one in a modal and one in the footer. How fix this? And if I made two different forms woulds that resolve the issue?
The form submission is handled by the boltforms system based on the name of the form - if you have two forms on the same page both forms will be triggered, and if the name of those forms is the same, both forms will continue with the submission.
If you make two forms that have different names, only one of the forms will continue, so that would fix your problem.

accessibility of one dynamic form compared to two forms

I have a question about the accessibility for visually impaired or blind people using forms on a page.
I have two forms that can be selected via a checkbox - let's call the checkboxes 'sales' & 'rent'. Is it better to:
Have 2 forms in the page but only the 'sales' form shows for sighted people, but can be switched to the other form in the page by clicking the 'rent' checkbox.
or
Have the form being dynamic and only one form. So you have to manually click the 'sales' or 'rent' checkboxes to change the forms elements (form, inputs, selects, etc).
Which of the above is more accessible?
Both approaches can be made equally accessible. If you choose to have two forms, make sure that only one of the forms is visible to both the screen reader and the sighted users at the same time. To do this, make sure to hide the invisible form using display:none

Passing the value of an HTML form to another form

I have a HTML form which allows a radio button selection of two products. After the product is selected, the user has the option of digital download or delivery of which there is a separate form for each asking different questions.
I need to ensure that the product selection is passed to either of the two form for when the user makes the decision on which delivery option to opt for. Only one of the forms is submitted.
Basically I have:
Form1: Product Selection Radio Button (2 Options)
// Choice of delivery options hidden by a javascript reveal of the relevant form
Form2a: Digital download form fields with actions for validation and submission to Paypal
Form2b: Regualar delivery form fields with actions for validation and submission to Paypal
I look forward to a solution from the excellent minds on this site!
Assuming this is all on a single page, it sounds like you don't really need multiple forms. I would suggest just including everything in a single form, wrapping the applicable questions for each selection in separate <div> tags and using some JavaScript to present the applicable <div> when either radio button is selected. When the form is submitted, check the radio button selection on the server side to determine which other form fields to utilise.

Access Form with multiple tab controls

This is not a developer question, it's a novice question from someone that has used Access as a front-end for a SQL database for years with no problems. I've now created a standalone Access database that I've created for various staff to fill out different pages of a three page form. The form has control tabs for pages 1, 2 and 3. Each page has the social security (SS) number of an individual on it. Pages 2 and 3 are just memo fields except for the SS number. I have created 4 records for individuals. When I try to print or do a print preview from the form, it shows just the first page for each individual. If I save it as a report, it does the same thing.
How can I get three pages to print for each individual, or just print three pages on one individual?
Personally, I would separate your reports from your user interface. That way your report can be exactly what you need rather than making a duel purpose form.
If you don't want to use the report wizards to build a custom report, then how about removing the tab control and building a long (vertical) form with all the fields in it in three sections, with a vertical scrollbar. Then the print should work.