How can I use the 1 tag value in a post request?

I am trying to take the name from h1 tag in post request to nodejs and store it in database.

I got the quantity value,but name field is not updating.

see my htmlcode snippet below.

<div id="main">
    <div class="cake" id="0">
        <div class="text">
        <form method="POST" action="/cart">  
        <img src="/Cakes-images/cake2.jpg" alt="img1" id="img1">
        <h1 id="title" name = "name">Chocolate Delight</h1>
        <label>Select Qty:</label>
        <select id="cake" name="quantity">
            <option value="0.5Kg">0.5Kg</option>
            <option value="1Kg" selected>1Kg</option>
            <option value="2Kg">2Kg</option>
            <option value="3Kg">3Kg</option>
        </select>
        </div>
        <button value="Add to cart" id="add-to-cart" >Add to cart</button>
        </form>
    </div>

and my post request :

router.post('/',async (req,res) => {
    
    console.log(req.params.name);
    const carts= new Cart({
        name:req.body.name,
        qty:parseInt(req.body.quantity)
    });

    //res.render('cartwithitem');

    try{
    const a= await carts.save();
    res.json(carts);
    console.log(carts);
    }catch(err)
    {
        res.send(err);
    }    
})

Please let me now how can I do it?

Answer

<h1> elements are used to define the primary heading in a document.

They are not form controls. They do not have name attributes.

If you want a form to always submit data which is hard coded in the HTML (as opposed to being entered or selected by the user) then you need to use an <input> element of type="hidden" (with a name and value).


MDN has an introductory guides to using forms you might find useful as well as a reference for the input element which includes a section on hidden inputs.