CODEWITHSUNDEEP
htmlnode.jshtml-table
jrocc
jrocc

Reputation: 1346

Form <td> get data for post method

Is it possible to get data from td in a html table like you would with a input?

<form action="/user/editUser" method="post">
    <tr>
        <td>
            <button type="submit" class="btn btn-primary">Edit</button>
        </td>
        <td name="firstName"><%= user.firstName %></td>
        <td name="lastName"><%= user.lastName %></td>

    </tr>
</form>

Upvotes: 1

Views: 588

Answers (2)

JohnH
JohnH

Reputation: 61

Tables are not form elements, so they are ignored when a form is submitted. One thing you could do is with Javascript is to override the submit event for the form and perform an Ajax post to your action. First add an id to your form. (<form id="myForm" ...>). I would also add error handling to this.

Sample

<script>
    $('#myForm').submit(function (e) {
        e.preventDefault();
        var firstName = $('td[name="firstName"]').html();
        var lastName = $('td[name="lastName"]').html();

        $.ajax({
            method: 'POST',
            url: '/user/editUser',
            data: {
                firstName,
                lastName,
            },
            success: (res) => {
                // do something
                console.log(res);
            }
        });
    });
</script>

Upvotes: 2

user3781737
user3781737

Reputation: 1012

I assume by "like you would with a input" you're referring to an input's .value property, and the data you're interested in is the user.firstName and user.lastName after your HTML has been templated? If so, then <td> doesn't have a .value property.

Instead, you access the inner HTML or the inner text of a td (or any tag) by using .innerHTML and .innerText properties, respectively.

Upvotes: 1

Related Questions