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>
2
  • What does the iframe have to do with anything? Is there a specific post you want to grab? Or multiple ones? Jul 12, 2014 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, 2014 at 1:53

1 Answer 1

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);

});
2
  • 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, 2014 at 21:52
  • Cool, glad it worked. Sounds like a good way to serve up a dynamic video Jul 14, 2014 at 22:02

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

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