Handling Input Values Using Form Elements

In this example, we will create an HTML page (A9.Html) with a form containing different form elements such as ID, price, and stock status. We'll then write JavaScript code to handle the user's input, display it on the webpage, and store it in variables for further use. Here's a step-by-step breakdown of how we can achieve this:

1. 
   In our HTML structure, create form elements with appropriate IDs for product information (e.g., ID, name, price, manufacturer, stock status).
   
2. 
   Write JavaScript code to access the entered data in each form element using document.getElementById() or similar methods.
   
3. 
   Store the retrieved data in variables for easy access and further processing.
   
4. 
   To display the product information on the webpage, create table rows and cells (td) within a table with appropriate IDs. For example, use LBL ID for product ID, LBL name for product name, LBL price for price, LBL MFD for manufacturer data, and LBL stock for stock status.
   
5. 
   Access the variables containing the entered data and display them in their respective table cells using innerText. For example: document.getElementById("LBL ID").innerText = id;
   
6. 
   Style the displayed information as needed using CSS (e.g., font weight for data terms).
   
7. 
   Call your JavaScript function when the user clicks the 'register' button to trigger the display of entered product information.