user10298495
user10298495

Reputation:

Setup max characters limit in paragraph tag

What I need to accomplish is simple - set the limit of the length of paragraph elements to 60 characters after that it will show dots. The jQuery script I have written is as follows:

var myDiv = $('.paragraph-24');
myDiv.text(myDiv.text().substring(0,300))

can anyone please help me to solve this?

Upvotes: 1

Views: 1239

Answers (2)

M3ghana
M3ghana

Reputation: 1271

Option 1 - Just try to use <textarea>

<textarea maxlength="50">
    Enter text here...
</textarea>

where you can set the maxlength

Option 2 - Using CSS

<div class = "paragraph-24" height="200" width="200"> abcd </div>

.paragraph-24 {
    display: block;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

where height and width can be adjusted as per the requirement.

Upvotes: 0

Jitendra G2
Jitendra G2

Reputation: 1206

You can create your custom attribute likewise i have created Maxlength for div tag.

If you add Maxlength attribute in div tag it will apply dot dot (...) after completion of length.

<div id="address_line" Maxlength="300">

Otherwise, it will append complete data into div tag.

$(document).ready(function() {

  var MaxLength = $('#address_line').attr("Maxlength");

  var data = "test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test test";

  if (MaxLength != undefined && data.length > MaxLength) {
    data = data.substring(0, MaxLength).concat("...")
  }

  $('#address_line').append(data);
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="address_line" Maxlength="300">

</div>

Upvotes: 2

Related Questions