Skip to main content

I have a Content Editor Web Part that I'd like to have some HTML code in. I plan on using the web part's Content Link field to link to a text file with my code. However, that HTML will need to be dynamically updated. Specifically, an ID number in the code will need to be updated from a list field. 

Does anyone know of a way, presumably with a Nintex Workflow, to update or create/overwrite a text file in a SharePoint library? I plan to store the text file in SiteAssets.

Also, just so you have the big picture, this process is going to be in a site template, which means it will be used in numerous different sites after they're created from the template. The HTML code is an iFrame that points to a mapping site, and the iFrame URL has a query string parameter. That parameter will be different for each site, but it will be in a dedicated list column, which is where I'd like to pull it from.

I think this is still a good question, but I ended up solving my issue with HTML and JavaScript instead of Nintex.


In case anyone else has a similar issue in the future, I'll detail my solution here.

I ended up not using a Nintex solution at all. I used HTML and JavaScript and saved it to a txt file in the SiteAssets library at the root of the site collection. I then used the Content Link field in a Content Editor Web Part on the homepage of the site template to link to the txt file. This allowed me to use the same URL in the template for all sites built from it, and set it up so there's only one place to make any future changes that will automatically replicate across all sites.

My code queries the current site looking for a specific list that will always be named Project Statement and then returns the value from the BrightWorkProjectNumber field. 

**Important Note:

The Project Statement list will only ever have one entry.

If there were multiple, this code would only return the last item as it's written right now.

The code then tests to ensure the number exists.

If it does, it builds the iFrame code and includes the number in the URL.

If it doesn't, an error message is displayed on the screen asking for the number to be entered into the list.

Here's the code:

<div id='locationMap'></div>
<script type='text/javascript'>
     var clientContext = new SP.ClientContext(_spPageContextInfo.webServerRelativeUrl);
     var oList = clientContext.get_web().get_lists().getByTitle('Project Statement');
     var camlQuery = new SP.CamlQuery();
     this.collListItem = oList.getItems(camlQuery);
     clientContext.load(collListItem);
     clientContext.executeQueryAsync(
        Function.createDelegate(this, this.onSucceeded),
          Function.createDelegate(this, this.onQueryFailed)
     );
     function onSucceeded(sender, args) {
          var bwProjectNum = '';
          var listItemEnumerator = collListItem.getEnumerator();
          while (listItemEnumerator.moveNext()) {
               var oListItem = listItemEnumerator.get_current();
               bwProjectNum = oListItem.get_item('BrightWorkProjectNumber');
               console.log("Brightwork Project Number: " + bwProjectNum);
          }
          if (bwProjectNum) {
               bwProjectNum = bwProjectNum.match(/d+$/g);
               console.log("Map Project Number: " + bwProjectNum);
               document.getElementById('locationMap').innerHTML =
                    "<iframe src='<My Map URL>?proj_ID=" + bwProjectNum + "' style='width:100%;height:450px;'></iframe><br>" +
                    "<a href='<My Map URL>?proj_ID=" + bwProjectNum + "' target='_blank'>View Larger Map</a>";
          } else {
               document.getElementById('locationMap').innerHTML =
                    "<div style='color:red;font-weight:bold;'>Please enter a Brightwork Project Number into the Project Statement to display map.</div>";
          }
     }          
     function onQueryFailed(sender, args) {
          document.getElementById('locationMap').innerHTML =
               "<div style='color:red;font-weight:bold;'>An error has occurred.<br>Please review the browser console (F12) for details.</div>";
          console.log('Project Location Map Error: ' + args.get_message() + '
'
+ args.get_stackTrace());
     }
</script>
‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍‍

And here's my end result:

221708_pastedImage_2.png

or:

221709_pastedImage_3.png


Reply