Home

List View Format Stopping at 10 items

%3CLINGO-SUB%20id%3D%22lingo-sub-859822%22%20slang%3D%22en-US%22%3EList%20View%20Format%20Stopping%20at%2010%20items%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-859822%22%20slang%3D%22en-US%22%3E%3CP%3EI%20am%20trying%20to%20implement%20the%20Profile%20Card%20view%20(%3CA%20href%3D%22https%3A%2F%2Fgithub.com%2FSharePoint%2Fsp-dev-list-formatting%2Ftree%2Fmaster%2Fview-samples%2Fprofile-card%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%20noopener%20noreferrer%20noopener%20noreferrer%20noopener%20noreferrer%20noopener%20noreferrer%22%3Ehttps%3A%2F%2Fgithub.com%2FSharePoint%2Fsp-dev-list-formatting%2Ftree%2Fmaster%2Fview-samples%2Fprofile-card%3C%2FA%3E)%20onto%20a%20list%20of%20people%20with%20about%20100%20items.%26nbsp%3B%20However%2C%20when%20I%20apply%20it%20it%20only%20loads%20the%20first%2010%20items.%20It%20works%20okay%20if%20I%20remove%20the%20float%3Aleft%20but%20then%20I%20just%20have%20one%20long%20column%2C%20which%20is%20not%20what%20I'm%20going%20for.%26nbsp%3B%20Has%20anyone%20else%20experienced%20this%3F%20I'm%20not%20a%20CSS%20master%20unfortunately.%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EHere%20is%20a%20shortened%20version%3A%26nbsp%3B%3C%2FP%3E%3CPRE%20class%3D%22lia-code-sample%20language-javascript%22%3E%3CCODE%3E%7B%0A%20%20%22schema%22%3A%20%22%3CA%20href%3D%22https%3A%2F%2Fdeveloper.microsoft.com%2Fjson-schemas%2Fsp%2Fview-formatting.schema.json%22%20target%3D%22_blank%22%20rel%3D%22noopener%20noreferrer%20noopener%20noreferrer%20noopener%20noreferrer%20noopener%20noreferrer%22%3Ehttps%3A%2F%2Fdeveloper.microsoft.com%2Fjson-schemas%2Fsp%2Fview-formatting.schema.json%3C%2FA%3E%22%2C%0A%20%20%22hideSelection%22%3A%20true%2C%0A%20%20%22hideListHeader%22%3A%20true%2C%0A%20%20%22rowFormatter%22%3A%20%7B%0A%20%20%20%20%22elmType%22%3A%20%22div%22%2C%0A%20%20%20%20%22style%22%3A%20%7B%0A%20%20%20%20%20%20%22display%22%3A%20%22flex%22%2C%0A%20%20%20%20%20%20%22flex-wrap%22%3A%20%22wrap%22%2C%0A%20%20%20%20%20%20%22flex-direction%22%3A%20%22column%22%2C%0A%20%20%20%20%20%20%22align-items%22%3A%20%22center%22%2C%0A%20%20%20%20%20%20%22justify-content%22%3A%20%22space-around%22%2C%0A%20%20%20%20%20%20%22min-width%22%3A%20%22300px%22%2C%0A%20%20%20%20%20%20%22min-height%22%3A%20%22200px%22%2C%0A%20%20%20%20%20%20%22border-radius%22%3A%20%228px%22%2C%0A%20%20%20%20%20%20%22margin-right%22%3A%20%2210px%22%2C%0A%20%20%20%20%20%20%22margin-bottom%22%3A%20%2210px%22%2C%0A%20%20%20%20%20%20%22box-shadow%22%3A%20%222px%202px%204px%20darkgrey%22%0A%20%20%20%20%7D%2C%0A%20%20%20%20%22attributes%22%3A%20%7B%0A%20%20%20%20%20%20%22class%22%3A%20%22ms-bgColor-neutralLighterAlt%20ms-bgColor-neutralLight--hover%20ms-fontColor-themePrimary--hover%22%0A%20%20%20%20%7D%2C%0A%20%20%20%20%22children%22%3A%20%5B%0A%20%20%20%20%20%20%7B%0A%20%20%20%20%20%20%20%20%22elmType%22%3A%20%22div%22%2C%0A%20%20%20%20%20%20%20%20%22children%22%3A%20%5B%0A%20%20%20%20%20%20%20%20%20%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%22elmType%22%3A%20%22img%22%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%22style%22%3A%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%22display%22%3A%20%22block%22%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%22height%22%3A%20%22auto%22%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%22max-height%22%3A%20%2296px%22%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%22max-width%22%3A%20%2296px%22%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%22border-radius%22%3A%20%2250%25%22%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%22attributes%22%3A%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%22src%22%3A%20%22%3D%20%40currentWeb%20%2B%20'%2F_layouts%2F15%2Fuserphoto.aspx%3Fsize%3DL%26amp%3Baccountname%3D'%20%2B%20%5B%24Person.email%5D%20%2B%20'%26amp%3BUA%3D0%26amp%3Bsize%3DHR48x48'%22%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%22title%22%3A%20%22%5B%24Person.title%5D%22%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%5D%0A%20%20%20%20%20%20%7D%2C%0A%20%20%20%20%20%20%7B%0A%20%20%20%20%20%20%20%20%22elmType%22%3A%20%22div%22%2C%0A%20%20%20%20%20%20%20%20%22style%22%3A%20%7B%0A%20%20%20%20%20%20%20%20%20%20%22text-align%22%3A%20%22center%22%0A%20%20%20%20%20%20%20%20%7D%2C%0A%20%20%20%20%20%20%20%20%22children%22%3A%20%5B%0A%20%20%20%20%20%20%20%20%20%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%22elmType%22%3A%20%22div%22%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%22style%22%3A%20%7B%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%22font-weight%22%3A%20%22500%22%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%20%20%22font-size%22%3A%20%221.5rem%22%0A%20%20%20%20%20%20%20%20%20%20%20%20%7D%2C%0A%20%20%20%20%20%20%20%20%20%20%20%20%22txtContent%22%3A%20%22%5B%24Person.title%5D%22%0A%20%20%20%20%20%20%20%20%20%20%7D%0A%20%20%20%20%20%20%20%20%5D%0A%20%20%20%20%20%20%7D%0A%20%20%20%20%5D%0A%20%20%7D%0A%7D%3C%2FCODE%3E%3C%2FPRE%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-LABS%20id%3D%22lingo-labs-859822%22%20slang%3D%22en-US%22%3E%3CLINGO-LABEL%3ECSS%3C%2FLINGO-LABEL%3E%3CLINGO-LABEL%3ELists%3C%2FLINGO-LABEL%3E%3CLINGO-LABEL%3ESharePoint%20Online%3C%2FLINGO-LABEL%3E%3C%2FLINGO-LABS%3E%3CLINGO-SUB%20id%3D%22lingo-sub-860019%22%20slang%3D%22en-US%22%3ERe%3A%20List%20View%20Format%20Stopping%20at%2010%20items%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-860019%22%20slang%3D%22en-US%22%3E%3CP%3EHi%26nbsp%3B%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F4572%22%20target%3D%22_blank%22%3E%40Courtney%20Prothero%3C%2FA%3E%2C%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3EThat%20is%20one%20of%20the%20more%20complicated%20view%20formats.%20I%20can't%20do%20much%20to%20debug%20the%20code%20but%20I%20can%20confirm%20that%20it%20is%20working%20with%20a%20list%20with%20more%2010%20items.%3C%2FP%3E%3CP%3E%3CSPAN%20class%3D%22lia-inline-image-display-wrapper%20lia-image-align-inline%22%20style%3D%22width%3A%20999px%3B%22%3E%3CIMG%20src%3D%22https%3A%2F%2Fgxcuf89792.i.lithium.com%2Ft5%2Fimage%2Fserverpage%2Fimage-id%2F132232iA0691CD6EAC993AE%2Fimage-size%2Flarge%3Fv%3D1.0%26amp%3Bpx%3D999%22%20alt%3D%22Capture.PNG%22%20title%3D%22Capture.PNG%22%20%2F%3E%3C%2FSPAN%3E%3C%2FP%3E%3CP%3EI%20followed%20the%20instructions%20provided%20on%20the%20GitHub%20site.%26nbsp%3BI%20know%20its%20not%20much%20help%20but%20it%20does%20work%20as%20described.%26nbsp%3B%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3ENorm%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-873146%22%20slang%3D%22en-US%22%3ERe%3A%20List%20View%20Format%20Stopping%20at%2010%20items%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-873146%22%20slang%3D%22en-US%22%3E%3CP%3EThanks%20for%20trying.%20It%20worked%20slightly%20better%20on%20a%20brand%20new%20communication%20site%20(my%20other%20site%20was%20an%20older%20site).%20But%20still%20had%20weird%20behavior.%20I%20ended%20up%20just%20giving%20up%20and%20creating%20a%20PowerApp%20with%20the%20look%20I%20wanted.%26nbsp%3B%3C%2FP%3E%3C%2FLINGO-BODY%3E%3CLINGO-SUB%20id%3D%22lingo-sub-873176%22%20slang%3D%22en-US%22%3ERe%3A%20List%20View%20Format%20Stopping%20at%2010%20items%3C%2FLINGO-SUB%3E%3CLINGO-BODY%20id%3D%22lingo-body-873176%22%20slang%3D%22en-US%22%3E%3CP%3E%3CA%20href%3D%22https%3A%2F%2Ftechcommunity.microsoft.com%2Ft5%2Fuser%2Fviewprofilepage%2Fuser-id%2F4572%22%20target%3D%22_blank%22%3E%40Courtney%20Prothero%3C%2FA%3E%26nbsp%3Bsorry%20it%20didn't%20work%20out.%3C%2FP%3E%3CP%3E%26nbsp%3B%3C%2FP%3E%3CP%3ENorm%3C%2FP%3E%3C%2FLINGO-BODY%3E
Highlighted
Courtney Prothero
Contributor

I am trying to implement the Profile Card view (https://github.com/SharePoint/sp-dev-list-formatting/tree/master/view-samples/profile-card) onto a list of people with about 100 items.  However, when I apply it it only loads the first 10 items. It works okay if I remove the float:left but then I just have one long column, which is not what I'm going for.  Has anyone else experienced this? I'm not a CSS master unfortunately.

 

Here is a shortened version: 

{
  "schema": "<a href="https://developer.microsoft.com/json-schemas/sp/view-formatting.schema.json" target="_blank">https://developer.microsoft.com/json-schemas/sp/view-formatting.schema.json</a>",
  "hideSelection": true,
  "hideListHeader": true,
  "rowFormatter": {
    "elmType": "div",
    "style": {
      "display": "flex",
      "flex-wrap": "wrap",
      "flex-direction": "column",
      "align-items": "center",
      "justify-content": "space-around",
      "min-width": "300px",
      "min-height": "200px",
      "border-radius": "8px",
      "margin-right": "10px",
      "margin-bottom": "10px",
      "box-shadow": "2px 2px 4px darkgrey"
    },
    "attributes": {
      "class": "ms-bgColor-neutralLighterAlt ms-bgColor-neutralLight--hover ms-fontColor-themePrimary--hover"
    },
    "children": [
      {
        "elmType": "div",
        "children": [
          {
            "elmType": "img",
            "style": {
              "display": "block",
              "height": "auto",
              "max-height": "96px",
              "max-width": "96px",
              "border-radius": "50%"
            },
            "attributes": {
              "src": "= @currentWeb + '/_layouts/15/userphoto.aspx?size=L&accountname=' + [$Person.email] + '&UA=0&size=HR48x48'",
              "title": "[$Person.title]"
            }
          }
        ]
      },
      {
        "elmType": "div",
        "style": {
          "text-align": "center"
        },
        "children": [
          {
            "elmType": "div",
            "style": {
              "font-weight": "500",
              "font-size": "1.5rem"
            },
            "txtContent": "[$Person.title]"
          }
        ]
      }
    ]
  }
}

 

3 Replies

Hi @Courtney Prothero,

 

That is one of the more complicated view formats. I can't do much to debug the code but I can confirm that it is working with a list with more 10 items.

Capture.PNG

I followed the instructions provided on the GitHub site. I know its not much help but it does work as described. 

 

Norm

Thanks for trying. It worked slightly better on a brand new communication site (my other site was an older site). But still had weird behavior. I ended up just giving up and creating a PowerApp with the look I wanted. 

@Courtney Prothero sorry it didn't work out.

 

Norm

Related Conversations
Tabs and Dark Mode
cjc2112 in Discussions on
22 Replies
Stable version of Edge insider browser
HotCakeX in Discussions on
35 Replies
flashing a white screen while open new tab
cntvertex in Discussions on
13 Replies
How to Prevent Teams from Auto-Launch
chenrylee in Microsoft Teams on
28 Replies