Topic: Textarea rows attribute ignored

Harry Shepard free asked 6 years ago


I have come across this problem. In your examples, changing the rows attribute works correctly, but when I try to do it, rows is ignored. This is somewhere else where changing the rows attribute of a text area doesn't work: https://codepen.io/mdbootstrap/pen/LRNZBz Any idea why it works in your examples but not anywhere else? I don't really want to be changing the min-height as suggested elsewhere because first of all it's inconsistent and secondly it works in your examples so I really shouldn't need to do that. Thanks!

Ollie Vincent pro commented 6 years ago

What are you trying to change and what are you trying to change it to?

Harry Shepard free commented 6 years ago

I'm just trying to increase the rows attribute. On the mdbootstrap codepen page it doesn't work like when I try to do it, but if I change it on this mdbootstrap.com website (using chrome inspect) it does work correctly. https://mdbootstrap.com/sections/contact-sections/#v-1 here for example, if you inspect the icon prefix textarea in v1 and edit rows from 3 to 6, the height correctly increases. On the codepen page or when I have a textarea on my site, if I add rows="10" it just seems to be ignored. Sorry for the late reply, the update when to spam for some reason

Ollie Vincent pro commented 6 years ago

That is because the the code is incorrect. If you copy the code from the demo you linked it works. Try this:

Harry Shepard free commented 6 years ago

I should be very worried if I can't do something so basic! Mine: <pre><div class="md-form"> <textarea type="text" id="comment" name="comment" class="form-control md-textarea" rows="6"></textarea> <label for="comment" class="">Comment</label> </div></pre> Demo (I deleted the icon element and added rows): <pre><div class="md-form"> <textarea type="text" id="form-text" class="form-control md-textarea" rows="8"></textarea> <label for="form-text" class="">Icon Prefix</label> </div></pre> Apart from my name attribute it's identical, if I add validate it works fine as well. Just the rows attribute is being ignored. If you add rows="6" to the codepen textarea demo it is ignored there as well.

Ollie Vincent pro commented 6 years ago

What version of MDB are you using? Are you using the Pro version? I ask because it works fine in mine

Harry Shepard free commented 6 years ago

It seems the mdb.free I downloaded from this website doesn't have the correct css. When I use the cdnjs version, the rows work correctly. Interesting! I have copied the cdnjs version and it works!

Harry Shepard free commented 6 years ago

I'm trialling the free version but apart from this issue it has been great so I will most probably be going pro. Any idea when 4.5.0 was released? I downloaded mdb.free from this site 3 weeks ago and it seems it was 4.4.5. I must have downloaded it just before 4.5.0 was released, the date on all my files are Feb 15, so 3 weeks ago now.

Ollie Vincent pro commented 6 years ago

MDB 4.5 was released a couple of weeks ago. You can read the change log here: https://mdbootstrap.com/changelog/ They updated their site according to the latest version of MDB, and some of the syntax may have changed - hence why it is not working. You could try the newest free version and see if it works. You should know that if something is marked as a Pro component then it can only be used in the Pro version of MDB.

Harry Shepard free commented 6 years ago

Thanks, that is all my problem was. They were obviously already using 4.5.0 on the demos but I downloaded a week before it was released so I was on 4.4.5! I don't know why those contact forms are tagged as pro components, they work with free just fine, it's just a few form fields and with an icon. Now I'm updated to 4.5.0 it's all working.


Please insert min. 20 characters.

FREE CONSULTATION

Hire our experts to build a dedicated project. We'll analyze your business requirements, for free.

Status

Resolved

Specification of the issue

  • ForumUser: Free
  • Premium support: No
  • Technology: MDB jQuery
  • MDB Version: -
  • Device: -
  • Browser: -
  • OS: -
  • Provided sample code: No
  • Provided link: Yes
Tags