Forum Discussion

lucasignatius's avatar
lucasignatius
Copper Contributor
Jan 15, 2021
Solved

Button on SharePoint Online to link other list

Hi, I want to add button to link other List SharePoint online in same Environment, there is JSON Script?I mean when click button ClickToOrder it will open a new window SharePoint List Can anybody he...
Lists
microsoft lists
SharePoint Online
  • ganeshsanap's avatar
    ganeshsanap
    Jan 15, 2021

    lucasignatius 

     

    You can add "target": "_blank" to open the link in new browser tab.

     

    You can use below JSON to open another SharePoint list in new browser tab:

     

     

    {
   "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
   "elmType": "a",
   "txtContent": "Click to Order",
   "attributes": {
      "target": "_blank",
      "href": "https://<tenant>.sharepoint.com/sites/siteName/Lists/listName/"
   }
}

     

     

    Replace the URL in href attribute with the actual URL of your 2nd list.

    Please click Mark as Best Response if my post helped you to solve your issue. This will help others to find the correct solution easily. It also closes the item. If the post was useful in other ways, please consider giving it Like.

     

ganeshsanap's avatar
ganeshsanap
MVP
Jan 15, 2021

lucasignatius 

 

You can add "target": "_blank" to open the link in new browser tab.

 

You can use below JSON to open another SharePoint list in new browser tab:

 

 

{
   "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
   "elmType": "a",
   "txtContent": "Click to Order",
   "attributes": {
      "target": "_blank",
      "href": "https://<tenant>.sharepoint.com/sites/siteName/Lists/listName/"
   }
}

 

 

Replace the URL in href attribute with the actual URL of your 2nd list.

Please click Mark as Best Response if my post helped you to solve your issue. This will help others to find the correct solution easily. It also closes the item. If the post was useful in other ways, please consider giving it Like.

 

lucasignatius's avatar
lucasignatius
Copper Contributor
Jan 19, 2021

ganeshsanap how to change icon to be button? because when I change on elmtype it not working 

thanks for your help

  • sascha1065's avatar
    sascha1065
    Copper Contributor
    Aug 14, 2023

    lucasignatius 

     

    i have found a simple tool on this site: https://sharepointdashboards.com/LITE/

     

    you can try this code i have modified. the original code can be found on the site above. 

     

     

    {
  "$schema": "https://developer.microsoft.com/json-schemas/sp/v2/column-formatting.schema.json",
  "elmType": "a",
  "attributes": {
    "class": "ms-fontColor-white ms-fontColor-black--hover",
    "href": "Yourlink.com",
    "target": "=if(1==1,'_blank','_self')"
  },
  "style": {
    "border": "none",
    "cursor": "pointer",
    "background-color": "transparent",
    "display": ""
  },
  "children": [
    {
      "elmType": "div",
      "attributes": {
        "class": "ms-bgColor-tealLight ms-bgColor-success--hover ms-fontColor-white ms-fontColor-black--hover"
      },
      "style": {
        "font-size": "16px",
        "font-family": "arial",
        "border": "1px solid LightGray",
        "border-radius": "=if(1==1,'7px','0px')",
        "box-shadow": "=if(1==1,'2px 2px #999','none')",
        "padding": "3px 5px 3px 5px"
      },
      "children": [
        {
          "elmType": "div",
          "attributes": {
            "iconName": "AccountManagement"
          },
          "style": {
            "display": "=if('AccountManagement' != '','inline-block','none')",
            "vertical-align": "middle",
            "padding-right": "5px"
          }
        },
        {
          "elmType": "div",
          "txtContent": "Your Button Text",
          "style": {
            "display": "inline-block",
            "font-family": "arial",
            "vertical-align": "middle"
          }
        }
      ]
    }
  ]
}

     

Resources