0

I am trying to edit the "Post.aspx" page of my blog. Here are the steps that I am trying to take:

I go to any random blog post. I click on "edit". I then click on "Add Web Part" on the Right hand side. I then add a "Script Editor" Web Part. I plan to add a custom field to the blog; but for now it would help if I could get any value from the "Posts" list in to this web part.

Here is an example of something that does work. What I would like to do is have this web part actually retrieve the src URL part from a custom field in the list rather than the hard coded url in this script. So if there is any way for me to retrieve data in to this script editor web part that would be great.

<div id="sidebar">

    <iframe width="420" height="315" src="https://www.youtube.com/embed/fTTPYH-o5YM" frameborder="0" allowfullscreen></iframe>

</div>
  • What does the iframe have to do with anything? Is there a specific post you want to grab? Or multiple ones? – Colbs Jul 12 '14 at 20:21
  • @Colbs thank you very much. I intend to add a column to the posts list that has the iframe src and then have this web part pull that column. – Sean W. Jul 14 '14 at 1:53
1

You can use SPServices to grab the column you want, and set the iFrame source with it. Give your iFrame an ID if you can, otherwise select it from its parent div. In your script editor, add the following (replace the query if necessary) :

<script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery.SPServices/2014.01/jquery.SPServices.min.js">  </script>

$(document).ready(function () {

var frameSrc;
var id = 1;
$().SPServices({
    operation: 'GetListItems',
    async: false,
    debug: false,
    listName: 'Posts',
    CAMLQuery: '<Query><Where><Eq><FieldRef Name="ID"/><Value Type="Counter">' + id +  '</Value></Eq></Where></Query>',
    completefunc: function (xData, Status) {
             var xNode = $(xData.responseXML).SPFilterNode("z:row")[0];
             $(xData.responseXML).SPFilterNode("z:row").each(function () {
                 //ows_CustomField
                 frameSrc = $(this).attr("ows_LinkFilename");
             });
         }
     }
  });

   //Set the iFrame src
   $('#myIframe').attr('src', frameSrc);

});
  • Thank you. I like this approach a CAMLQuery to get the list item and a jquery to set the result to the appropriate iframe attribute. – Sean W. Jul 14 '14 at 21:52
  • Cool, glad it worked. Sounds like a good way to serve up a dynamic video – Colbs Jul 14 '14 at 22:02

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.