Some times, when working with the Multiline fields, they may occupy the whole page :-).
We can solve this issue by introducing Expand-Collapse Trick with jQuery. On clicking on the little Arrow that row will be expanded, then again clicking will collapse.
We can solve this issue by introducing Expand-Collapse Trick with jQuery. On clicking on the little Arrow that row will be expanded, then again clicking will collapse.
Here is How: Add the CEWP webpart and place the below code, then hide the webpart.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
| <script type= "text/javascript" > if ( typeof jQuery== 'undefined' ){ document.write( '<script src="' ,jQPath, '" type="text/javascript"><\/script>' ); } </script> <style type= "text/css" > .expandText {height:auto;} .collapseText {height:28px;overflow:hidden} </style> <script type= "text/javascript" > function ExpGroupRenderData(htmlToRender, groupName, isLoaded) { $( "#tbod" +groupName+ "_" ).attr( "isloaded" ,isLoaded) .html(htmlToRender) .show( "fast" ,collapseText( "#tbod" +groupName+ "_" )); } function collapseText(group){ if (!group) group = "#MSO_ContentTable" ; var html = "<img alt='collapseText' style='cursor:pointer;' src='/_layouts/images/menudark.gif'/>" ; $(group+ " td.ms-vb2>div" ).each( function (i,e){ $(e).css({display: "inline-block" }); if (e.clientHeight > 35){ $(e).toggleClass( "collapseText" ) .prepend(html); } }); $(group+ " img[alt='collapseText']" ).click( function (event){ $(event.target).parent().toggleClass( "collapseText" ); }); } $( function () { collapseText(); }); </script> <style type= "text/css" > .ms-vb{ vertical-align: middle } .ms-vb2{ vertical-align: middle; } .ms-vh2-nograd { text-align: center; } </style> |
Thanks to: https://www.nothingbutsharepoint.com/sites/eusp/Pages/jquery-for-everyone-collapse-text-in-list-view.aspx?replytocom=15961
Other ways:
Codeplex project: http://spcollapser.codeplex.com/
Jquery: http://www.myrocode.com/post/2009/04/22/Collapse-or-Expand-SharePoint-web-parts-in-your-pages-get-OpenCloseWps.aspx
http://fitandfinish.ironworks.com/2010/02/how-to-expand-collapse-web-parts-in-sharepoint-using-jquery.html
Read more: http://www.sharepointdiary.com/2010/07/expand-collapse-for-multiline-text.html#ixzz2qpJQq1uq
Reference:
http://www.sharepointdiary.com/2010/07/expand-collapse-for-multiline-text.html
No comments:
Post a Comment