Modify Popup Template for Video from url in attribute table

1089
3
01-25-2017 05:52 AM
RuthCostley4
New Contributor II

I am trying to modify the code found at https://community.esri.com/thread/121245 to use a text field from the attribute table of the layer for the URL of the video. I am new to Javascript, so I'm struggling. I need to change line 7 so that the src is text from my attribute table. thx...

  1.  var template  = new PopupTemplate();  
  2.         template.setTitle("<b>City</b>");  
  3.         template.setContent(getContent); //this will call the getContent function where you can custom build your fields and add video  
  4.       
  5.         function getContent(graphic){  
  6.           var Content = "<b>City Name:  </b>" + graphic.attributes.areaname + "<br> <b>Population:  </b>" + graphic.attributes.pop2000 + "<br>";   
  7.           var Hyperlink = '<video width="250" height="250" controls><source src=http://techslides.com/demos/sample-videos/small.mp4 type=video/mp4></video> ';  
  8.         
  9.           return Content + Hyperlink;  
  10.         }     
0 Kudos
3 Replies
RobertScheitlin__GISP
MVP Emeritus

Ruth,

   You are using an attribute already from data in that method "pop2000" so it is not much different:

        var template  = new PopupTemplate();  
        template.setTitle("<b>City</b>");  
        template.setContent(getContent); //this will call the getContent function where you can custom build your fields and add video  
      
        function getContent(graphic){  
          var Content = "<b>City Name:  </b>" + graphic.attributes.areaname + "<br> <b>Population:  </b>" + graphic.attributes.pop2000 + "<br>";   
          var Hyperlink = '<video width="250" height="250" controls><source src=' + graphic.attributes.videourl + ' type=video/mp4></video> ';  
        
          return Content + Hyperlink;  
        } 
RuthCostley4
New Contributor II

Thanks!!!

0 Kudos
RobertScheitlin__GISP
MVP Emeritus

Ruth,

Don't forget to mark this question as answered by clicking on the "Correct Answer" link on the reply that answered your question.