ListViewWebPart Datasheet Grid : How To Automatically Resize To Fill Parent Container

Alle Antworten

• Dienstag, 13. März 2012 02:58

  Moderator

   

   
  

  0

  Hi ,

  Could you provide the detailed information about how do you add the list view web part on the page in SharePoint Designer and set it to
  display in datasheet grid format ?

  As far as I know ,when we add a list view on a form ,it will display in xsltlistviewwebpart or a dataformwebpart .When add a list on a page
  in browser ,the list will display in listiewwebpart .I have a test with the Full Page web part page .Then add the listviewwebpart in browser .Then change the web part zone properties to make it display full page when the page open .

  Find this line in your web part page : <ZoneTemplate: webpartzone runat="server"…></ZoneTemplate> .

  Change it to < ZoneTemplate: webpartzone runat="server" FrameType="None" ID="Main" Title="loc:main"></ ZoneTemplate >  

  Thanks

  ---

  Entan Ming

  TechNet Community Support

  

  • Antworten
  • Zitieren

   
• Dienstag, 13. März 2012 13:52

   

   
  

  0

  In SPD I placed the ListViewWebPart on the page by first opening a page containing an existing datasheet view of the desired list, then copy and pasted to empty WebPartZone on new page. The existing datasheet view was created using "Create View > Datasheet" using browser outside of SPD.

  The code is as follows:

  <WebPartPages:WebPartZone runat="server" FrameType="None" ID="Main" Title="loc:Main" allowlayoutchange="false" allowcustomization="false"><ZoneTemplate>
  <WebPartPages:ListViewWebPart runat="server" __MarkupType="xmlmarkup" WebPart="true" __WebPartId="{50FD1A19-0F73-4AF7-99A7-0C4993A68B32}" >
  <WebPart xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns="http://schemas.microsoft.com/WebPart/v2">
    <Title>Activities</Title>
    <FrameType>None</FrameType>
    <Description>List containing activities.</Description>
    <IsIncluded>true</IsIncluded>
    <PartOrder>2</PartOrder>
    <FrameState>Normal</FrameState>
    <Height />
    <Width />
    <AllowRemove>true</AllowRemove>
    <AllowZoneChange>true</AllowZoneChange>
    <AllowMinimize>true</AllowMinimize>
    <AllowConnect>true</AllowConnect>
    <AllowEdit>true</AllowEdit>
    <AllowHide>true</AllowHide>
    <IsVisible>true</IsVisible>
    <DetailLink>/personal/jbielefeld/Lists/master</DetailLink>
    <HelpLink />
    <HelpMode>Modeless</HelpMode>
    <Dir>Default</Dir>
    <PartImageSmall />
    <MissingAssembly>Cannot import this Web Part.</MissingAssembly>
    <PartImageLarge />
    <IsIncludedFilter />
    <ExportControlledProperties>false</ExportControlledProperties>
    <ConnectionID>00000000-0000-0000-0000-000000000000</ConnectionID>
    <ID>g_50fd1a19_0f73_4af7_99a7_0c4993a68b32</ID>
    <WebId xmlns="http://schemas.microsoft.com/WebPart/v2/ListView">00000000-0000-0000-0000-000000000000</WebId>
    <ListViewXml xmlns="http://schemas.microsoft.com/WebPart/v2/ListView">&lt;View Name="{50FD1A19-0F73-4AF7-99A7-0C4993A68B32}" Type="GRID" DisplayName="Today" Url="/personal/jbielefeld/reports/actions/activities1.aspx" Level="1" BaseViewID="1" ContentTypeID="0x" ImageUrl="/_layouts/images/generic.png"&gt;&lt;ViewFields&gt;&lt;FieldRef Name="Date" /&gt;&lt;FieldRef Name="Type1" /&gt;&lt;FieldRef Name="Activity_x002f_Goal_x0020_Type" /&gt;&lt;FieldRef Name="Work" /&gt;&lt;FieldRef Name="Task_x0020_Name" /&gt;&lt;FieldRef Name="Title" /&gt;&lt;FieldRef Name="Pragmatic" /&gt;&lt;FieldRef Name="ContentTypeId" /&gt;&lt;/ViewFields&gt;&lt;Query&gt;&lt;OrderBy&gt;&lt;FieldRef Name="Date" /&gt;&lt;FieldRef Name="Created" /&gt;&lt;/OrderBy&gt;&lt;Where&gt;&lt;And&gt;&lt;Eq&gt;&lt;FieldRef Name="Date" /&gt;&lt;Value Type="DateTime"&gt;&lt;Today /&gt;&lt;/Value&gt;&lt;/Eq&gt;&lt;Eq&gt;&lt;FieldRef Name="Author" /&gt;&lt;Value Type="Integer"&gt;&lt;UserID /&gt;&lt;/Value&gt;&lt;/Eq&gt;&lt;/And&gt;&lt;/Where&gt;&lt;/Query&gt;&lt;Aggregations Value="Off" /&gt;&lt;Mobile MobileItemLimit="99" /&gt;&lt;Formats&gt;&lt;FormatDef Type="RowHeight" Value="Auto" /&gt;&lt;Format Name="Private"&gt;&lt;FormatDef Type="ColWidth" Value="69" /&gt;&lt;/Format&gt;&lt;Format Name="Date"&gt;&lt;FormatDef Type="ColWidth" Value="72" /&gt;&lt;/Format&gt;&lt;Format Name="Duration"&gt;&lt;FormatDef Type="WrapText" Value="1" /&gt;&lt;FormatDef Type="ColWidth" Value="77" /&gt;&lt;/Format&gt;&lt;Format Name="Type1"&gt;&lt;FormatDef Type="WrapText" Value="1" /&gt;&lt;FormatDef Type="ColWidth" Value="104" /&gt;&lt;/Format&gt;&lt;Format Name="Activity_x002f_Goal_x0020_Type"&gt;&lt;FormatDef Type="WrapText" Value="1" /&gt;&lt;FormatDef Type="ColWidth" Value="101" /&gt;&lt;/Format&gt;&lt;Format Name="Work"&gt;&lt;FormatDef Type="WrapText" Value="1" /&gt;&lt;FormatDef Type="ColWidth" Value="85" /&gt;&lt;/Format&gt;&lt;Format Name="Work_x0020_Hours0"&gt;&lt;FormatDef Type="ColWidth" Value="96" /&gt;&lt;/Format&gt;&lt;Format Name="Task_x0020_Name"&gt;&lt;FormatDef Type="WrapText" Value="1" /&gt;&lt;FormatDef Type="ColWidth" Value="170" /&gt;&lt;/Format&gt;&lt;Format Name="Title"&gt;&lt;FormatDef Type="WrapText" Value="1" /&gt;&lt;FormatDef Type="ColWidth" Value="220" /&gt;&lt;/Format&gt;&lt;Format Name="Pragmatic"&gt;&lt;FormatDef Type="WrapText" Value="1" /&gt;&lt;FormatDef Type="ColWidth" Value="201" /&gt;&lt;/Format&gt;&lt;Format Name="Activity_x002f_Goal_x0020_Area"&gt;&lt;FormatDef Type="WrapText" Value="1" /&gt;&lt;FormatDef Type="ColWidth" Value="120" /&gt;&lt;/Format&gt;&lt;/Formats&gt;&lt;Toolbar Type="None" /&gt;&lt;XslLink Default="TRUE"&gt;main.xsl&lt;/XslLink&gt;&lt;RowLimit Paged="TRUE"&gt;30&lt;/RowLimit&gt;&lt;/View&gt;</ListViewXml>
    <ListName xmlns="http://schemas.microsoft.com/WebPart/v2/ListView">{F88DF64D-8025-444E-A846-001BE031BDAA}</ListName>
    <ListId xmlns="http://schemas.microsoft.com/WebPart/v2/ListView">f88df64d-8025-444e-a846-001be031bdaa</ListId>
    <ViewFlag xmlns="http://schemas.microsoft.com/WebPart/v2/ListView">2053</ViewFlag>
    <ViewFlags xmlns="http://schemas.microsoft.com/WebPart/v2/ListView">Html TabularView Grid</ViewFlags>
    <ViewContentTypeId xmlns="http://schemas.microsoft.com/WebPart/v2/ListView">0x</ViewContentTypeId>
  </WebPart>
  </WebPartPages:ListViewWebPart>
  </ZoneTemplate></WebPartPages:WebPartZone>

  Thank you in advance for your assistance with this matter.
  
  • Antworten
  • Zitieren

   
• Freitag, 16. März 2012 04:54

  Moderator

   

   
  

  0

  Hi ,

  I can reproduce you issue when copy the web part to a blank aspx page .But when using the web part on a web part page ,the datasheet will fill the parent container .You can add the web part on a web part page instead ,or add some javascript on the blank aspx page to resize the datasheet .

  <script type="text/javascript">

    function ResizePage(){    
  document.getElementById("STSListControlWPQ1").style.height=document.documentElement.clientHeight-20+"px";//change
  the id to the datasheet id using development tool (pressF12 in browser)  }

  </script>

  </head>

  <body onload="ResizePage();">

  Thanks

  ---

  Entan Ming

  TechNet Community Support

  

  • Antworten
  • Zitieren

   
• Freitag, 16. März 2012 19:33

   

   
  

  0

  Greetings Entan,

  First of all, thank you very much for taking the time to research this, duplicate the problem I was seeing and providing suggestions. Problem solved. Your suggested javascript approach worked well for the initial page display. Upon page load the height of the ListViewWebPart would be properly resized. However upon IE window resize events, the height of the ListViewWebPart would not change. So with the use of some additional jQuery event binding I was able to implement the desired automatic resizing behavior as follows:

  <script type="text/javascript">
  	function ResizePageContents(){    
  		//change the id to the datasheet id using development tool (pressF12 in browser)
  		document.getElementById("STSListControlWPQ1").style.height=document.documentElement.clientHeight-20+"px";
  	}	
  </script>
  
  <script type="text/javascript">
  	$(function() {$(window).bind('resize', function(){ResizePageContents();});});
  </script>
  
  </head>
  
  <body onload="ResizePageContents();">
  

  Thanks again for your time and suggestion, sincerely appreciated.
  

  • Als Antwort markiert jbielefeld Freitag, 16. März 2012 19:34
  •  
  • Antworten
  • Zitieren