Is there a way to have special Brands based off the group or email people have?
Hi all,
I work with a larger company that currently have 8-10 smaller companies using DOMO for reporting. My colleagues and I typically create a copy of Dashboards and now some App Studios for when we bring get a new company onto DOMO.
Basically, is there a way to make an entire App/ Dashboard PDP, not just based on the data? I want to change the colors and images based on their group or email associated with that individual.
Best Answers
-
Not really. You could get creative with images though. For example, I have a page in Domo where an image in the top left of the page changes depending on what product is selected. You could do the same and have a dynamic image that changes based on which user logs in.
If I solved your problem, please select "yes" above
0 -
I used a DDX brick + a webform. This is the DDX brick I am using:
For your webform, you'll also want a column with values that can correspond to a PDP policy.
My Webform:
DDX Brick code:
Javascript:
var domo = window.domo; var datasets = window.datasets; var myDataTable = document.getElementById('myDataTable'); // Data Column Names var dataColumnName = 'Image URL'; // Form the data query var select = [dataColumnName]; var query = `/data/v1/${datasets[0]}?select=${select.join()} &filter='Image URL'!=null`; // Get the data and build table domo.get(query, {format: 'array-of-arrays'}).then(buildTableGrid); function buildTableGrid(data){ // var max = 0, min = 0, total = 0; var totalTableHeaders = [data.columns[0]]; var totalTable = []; data.rows.forEach(function(row, index){ totalTable.push([row[0]]) }); buildTable(myDataTable, totalTableHeaders, totalTable); } function buildTable(tableEl, headers, data){ // Build header row var thead = tableEl.appendChild(document.createElement('thead')); var headerRow = thead.appendChild(document.createElement('tr')); headers.forEach(function(h){ var th = headerRow.appendChild(document.createElement('th')); th.innerText = h; }); // Add table data rows var tbody = tableEl.appendChild(document.createElement('tbody')); var fragment = document.createDocumentFragment(); data.forEach(function(row){ fragment.append(getRow(row)); }); tbody.appendChild(fragment); } function getRow(rowData){ var rowEl = document.createElement('tr'); rowData.forEach(function(d){ debugger var td = rowEl.appendChild(document.createElement('td')); td.innerHTML = d; }); return rowEl; }
HTML:
<link href="//fonts.googleapis.com/css?family=Roboto+Mono:300" rel="stylesheet" type="text/css"> <table id="myDataTable"></table>
CSS:
body{ font-size: 14px; } table { border-collapse: collapse; } .column_heading { height:0px; } th { background-color: transparent; border: transparent; text-align: left; padding: 0px; color: #333; border-top: 0px; } .form-matrix-row-headers { display : none !important; } th:nth-child(1){ display: none; } table tr th { border: transparent; border-top: none; border-bottom: none; } th:first-child { visibility:hidden; padding: none; border-collapse: collapse; } td { border: transparent; padding: none; width: 1500px; font-family: "Arial", monospace; font-weight: 300; color: #333; text-align: left; } tr:nth-child(odd) td { background-color: transparent; } #myStatsTable{ float: left; margin-right: 20px; }
Final result:
If I solved your problem, please select "yes" above
2
Answers
-
Not really. You could get creative with images though. For example, I have a page in Domo where an image in the top left of the page changes depending on what product is selected. You could do the same and have a dynamic image that changes based on which user logs in.
If I solved your problem, please select "yes" above
0 -
Interesting, how exactly would that work?
0 -
I used a DDX brick + a webform. This is the DDX brick I am using:
For your webform, you'll also want a column with values that can correspond to a PDP policy.
My Webform:
DDX Brick code:
Javascript:
var domo = window.domo; var datasets = window.datasets; var myDataTable = document.getElementById('myDataTable'); // Data Column Names var dataColumnName = 'Image URL'; // Form the data query var select = [dataColumnName]; var query = `/data/v1/${datasets[0]}?select=${select.join()} &filter='Image URL'!=null`; // Get the data and build table domo.get(query, {format: 'array-of-arrays'}).then(buildTableGrid); function buildTableGrid(data){ // var max = 0, min = 0, total = 0; var totalTableHeaders = [data.columns[0]]; var totalTable = []; data.rows.forEach(function(row, index){ totalTable.push([row[0]]) }); buildTable(myDataTable, totalTableHeaders, totalTable); } function buildTable(tableEl, headers, data){ // Build header row var thead = tableEl.appendChild(document.createElement('thead')); var headerRow = thead.appendChild(document.createElement('tr')); headers.forEach(function(h){ var th = headerRow.appendChild(document.createElement('th')); th.innerText = h; }); // Add table data rows var tbody = tableEl.appendChild(document.createElement('tbody')); var fragment = document.createDocumentFragment(); data.forEach(function(row){ fragment.append(getRow(row)); }); tbody.appendChild(fragment); } function getRow(rowData){ var rowEl = document.createElement('tr'); rowData.forEach(function(d){ debugger var td = rowEl.appendChild(document.createElement('td')); td.innerHTML = d; }); return rowEl; }
HTML:
<link href="//fonts.googleapis.com/css?family=Roboto+Mono:300" rel="stylesheet" type="text/css"> <table id="myDataTable"></table>
CSS:
body{ font-size: 14px; } table { border-collapse: collapse; } .column_heading { height:0px; } th { background-color: transparent; border: transparent; text-align: left; padding: 0px; color: #333; border-top: 0px; } .form-matrix-row-headers { display : none !important; } th:nth-child(1){ display: none; } table tr th { border: transparent; border-top: none; border-bottom: none; } th:first-child { visibility:hidden; padding: none; border-collapse: collapse; } td { border: transparent; padding: none; width: 1500px; font-family: "Arial", monospace; font-weight: 300; color: #333; text-align: left; } tr:nth-child(odd) td { background-color: transparent; } #myStatsTable{ float: left; margin-right: 20px; }
Final result:
If I solved your problem, please select "yes" above
2
Categories
- All Categories
- 1.8K Product Ideas
- 1.8K Ideas Exchange
- 1.5K Connect
- 1.2K Connectors
- 300 Workbench
- 6 Cloud Amplifier
- 8 Federated
- 2.9K Transform
- 100 SQL DataFlows
- 616 Datasets
- 2.2K Magic ETL
- 3.8K Visualize
- 2.5K Charting
- 731 Beast Mode
- 55 App Studio
- 40 Variables
- 682 Automate
- 175 Apps
- 451 APIs & Domo Developer
- 46 Workflows
- 10 DomoAI
- 35 Predict
- 14 Jupyter Workspaces
- 21 R & Python Tiles
- 394 Distribute
- 113 Domo Everywhere
- 275 Scheduled Reports
- 6 Software Integrations
- 122 Manage
- 119 Governance & Security
- 8 Domo Community Gallery
- 38 Product Releases
- 10 Domo University
- 5.4K Community Forums
- 40 Getting Started
- 30 Community Member Introductions
- 107 Community Announcements
- 4.8K Archive