CODEWITHSUNDEEP
javascripthtmlnode.js
FrankS
FrankS

Reputation: 11

Want to push values from nodejs server to html form

I want to be able to add values to an HTML form from my NodeJS code.I want to add var address, city, state, and zip to the respected HTML form in each respected input field.

app.get("/:id", function(req, res){
  var storeID = req.params['id']
  XlsxPopulate.fromFileAsync("./public/dataSheets/customerList.xlsx")
  .then(workbook => {
    
    const allValues = workbook.sheet("All Locations").usedRange().value();
    
    const store = allValues.find(item => item[0]== storeID);
    
    var address = store[3];
    var city = store[4];
    var state = store[5];
    var zip = store[6];
    


  });
});

So basically the form values for address, city, state, and zip will come from the nodejs value and be filled in.

<div class="container" data-aos="fade-up">
        <form action="order.html" method="post" id="checkout-order-form">
            
            <fieldset id="fieldset-billing">
                
                <div>
                    <label for="fname">First Name</label>
                    <input type="text" name="lname" id="name" data-type="string" data-message="This field cannot be empty" />
                </div>
                <div>
                    <label for="lname">Last Name</label>
                    <input type="text" name="lname" id="name" data-type="string" data-message="This field cannot be empty" />
                </div>
                <div>
                    <label for="address">Address</label>
                    <span id="address"><input type="text" name="address" id="address" data-type="string" data-message="This field cannot be empty" /></span>
                </div>
                <div>
                    <label for="city">City</label>
                    <input type="text" name="city" id="city" data-type="string" data-message="This field cannot be empty" />
                </div>
                <div>
                    <label for="state">State</label>
                    <input type="text" name="state" id="state" data-type="string" data-message="This field cannot be empty" />
                </div>
                <div>
                    <label for="zip">ZIP Code</label>
                    <input type="text" name="zip" id="zip" data-type="string" data-message="This field cannot be empty" />
                </div>
            </fieldset>
        </form>
    </div>

Upvotes: 1

Views: 114

Answers (1)

kanuos
kanuos

Reputation: 1203

Are you trying to prefill a HTML form with the data generated by the Node server? If that's the case, you can use a templating engine like ejs pug handlebars etc to render dynamic data or you can simply use AJAX request to the server to fetch data and display it in your UI like the frameworks do.

Upvotes: 0

Related Questions