How to make an input field have multiple rows

Question

I have a page to edit some settings and then send the new data off in a form to be added etc.

In some of the fields there's quite a bit of writing so just the one line is sometimes not enough and it looks messy.

How can I add multiple rows/lines to an input such as

<input type="text" name="site_notes" rows="5" class="form-control" value="<?php echo $site_notes; ?>">

As you can see I already tried rows= and it didn't work. I'm aware of textarea but as I was reading about it I saw you cannot have a value in textarea which is even more problematic.

Are there any workarounds to this?

"'m aware of textarea but as I was reading about it I saw you cannot have a value in textarea which is even more problematic." - what do you mean exactly? Can you link to where you read this? A textarea is exactly made for the purpose of handling multi-line data input. — jusopi, Oct 26 '18 at 13:01
look at this example of the textarea from the docs - https://developer.mozilla.org/en-US/docs/Web/HTML/Element/textarea — jusopi, Oct 26 '18 at 13:02
@jusopi On here: https://www.w3schools.com/tags/tag_textarea.asp there is no "value" attribute - I need my input/textarea to be able to hold a value (pre-loaded) for editing whilst having multiple rows — David, Oct 26 '18 at 13:05
possible duplicate [Multiple lines of input](https://stackoverflow.com/questions/6262472/multiple-lines-of-input-in-input-type-text) — Matt, Oct 26 '18 at 13:05
@David yes I understand that. See the answer below. Textareas are handled differently in terms of being preloaded with content. In terms of accessing the formdata, you still access that the same way. — jusopi, Oct 26 '18 at 13:07

score 1 · Accepted Answer · answered Oct 26 '18 at 13:05

I posted a few comments for you but I think I understand now what you meant when you said:

I'm aware of textarea but as I was reading about it I saw you cannot have a value in textarea which is even more problematic

Don't give up on the Textarea. It is made exactly for multiple rows. I think you just had the data in the wrong place. Instead of:

<textarea type="text" 
          name="site_notes" 
          rows="5" 
          class="form-control" 
          value="<?php echo $site_notes; ?>">

You need to put the value as a child of the textarea:

<textarea type="text" 
          name="site_notes" 
          rows="5" 
          class="form-control">  

    <?php echo $site_notes; ?>
</textarea>

How to make an input field have multiple rows

1 Answers1