How to create table inside an Input type text (text field)?

Question

I want to create a dynamic size table inside a text field(input type="text") It is to be created by the click of a button, the table will be filled from within that text-box before the whole post being submitted.

So its a text box for blog posting, so that the table will be posted along with the text.

how to do that? (in the simplest way please).

Edit: i was thinking is there a way to say highlight a certain part of the text and apply table html tags from there <table><th><td>? but what about the tag attributes?

You should show us an example of the inputs/outputs you want. I don't understand all your needs. — Takit Isy
– Takit Isy, Commented May 21, 2018 at 18:16
@TakitIsy the input is an input-button to create a table where the cursor is, inside the input-text box. i don't have an example, i am at the start of my project, it is just some basic html tags. — topcat
– topcat, Commented May 21, 2018 at 18:28

Takit Isy · Accepted Answer · 2018-05-21 18:14:20Z

1

You can't create a table inside a input.

⋅ ⋅ ⋅

But you can use a div with the contenteditable property to create a modifiable table:

table td{
  border: 1px solid black;
  padding: 4px 12px;
}

<div contenteditable=true>
  <table>
    <tr>
      <td>1</td>
      <td>2</td>
      <td>3</td>
    </tr>
    <tr>
      <td>4</td>
      <td>5</td>
      <td>6</td>
    </tr>
    <tr>
      <td>7</td>
      <td>8</td>
      <td>9</td>
    </tr>
  </table>
</div>

Hope it helps.

answered May 21, 2018 at 18:14

Takit Isy

10.2k3 gold badges29 silver badges48 bronze badges

Sign up to request clarification or add additional context in comments.

Collectives™ on Stack Overflow

How to create table inside an Input type text (text field)?

1 Answer 1

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Related