I'm trying to use dotdotdot plugin on my MVC project. I need it in my table, where I want to restrict some rows to only 3-4 lines of text. Every row and column of this table that could contain big text (over 25 characters) is assigned a class the following way:
<td>
<div class="longTextColumn">
@Html.DisplayFor(modelItem => item.Reasons_For_Issue)
</div>
</td>
DisplayFor is HTMLHelper class, which extracts data based on a model from my database. I'm using jQuery 1.8.1, so I attached the scripts:
<script type="text/javascript" src="~/Scripts/jquery-1.9.1.js"></script>
<script type="text/javascript" src="~/Scripts/dotdotdot.js"></script>
...and set the function:
<script>
$(document).ready(function () {
$(".longTextColumn").dotdotdot();
});
</script>
Which should be enough according to the instructions. My css of the class:
.longTextColumn {
width: 600px;
max-height: 60px;
word-wrap: break-word;
/*overflow:hidden;*/
}
When I load the page, the overflow is not hidden, which leads me to believe that the script is not fired. When I troubleshoot with IE, error comes up "Object doesn't support property or method 'dotdotdot''. On other browsers I don't recieve any errors but nothing happens. Can you give me any ideas as to why that happens and how to solve the problem? Thanks in advance!
So people, look very carefully how you link your script files. I was supposed to link jquery.dotdotdot.js, and instead I copied link for dotdotdot.js from the site's instructions. Don't do it like me! Thanks a million to NightOwl888!