Sparky

Insert Video into List Item (Enhanced Rich text box field) SharePoint 2010

noreply@blogger.com (Unknown) — Fri, 02 Mar 2012 21:40:00 +0000

Problem: In our News site, any article is published as new list item, we wanted to have ability to add Videos in to the Article.

Limitations:

We could not add out of the box web part on the list’s display.aspx page as it will display same video on each article, and at the same time, it will not be embedded in to the text and will have separate appearance on bottom or top of the article page.

SharePoint does not support embedding video object using ribbon or enhanced rich text box html editor, if you try then it removes the <embed> or <object> tags once you save the list item.

I goggled to see if embedding video in to rich text box is achievable, and I could found solution for MOSS 2007 only, with query rich text control.

As we didn’t have much time to develop the ribbon control, I could manage below workaround. I hope below solution works for you.

Solution:

Apart from the SharePoint out of the box Media Web Part, SharePoint uses the Silverlight overlay player, I observed it when I had uploaded the Video in asset/media library on thumbnail view .

You can use this player on any SharePoint page/HTML Page/content editor web part or your Media/Training /Video library sites.

Below is the basic script that you could use, you may make it more dynamic to work with your video libraries.

1) Copy below script where you want to display the video, and pass the required parameters.

mediaPlayer.createMediaPlayer(

videoHolder, videoHolder.id, '500px', '333px',

{

displayMode: 'Inline',

mediaTitle: 'Video Entry',

mediaSource: ‘videoURL’,

previewImageSource:'',

autoPlay: false,

loop: true,

mediaFileExtensions:'wmv;wma;avi;mpg;mp3;',

silverlightMediaExtensions:'wmv;wma;mp3;'

}

);

For more details visit below site-

http://msdn.microsoft.com/en-us/library/ee558890.aspx

To use this player as embedded in to the Rich text box follow below steps:

1) Open display.aspx page of the list where you want to embed the video.

2) Go to, Site Actions -> Edit Page

3) Add content editor web part on your display.aspx page at bottom.

4) Make sure you have jquery.js included in master page if not then include the reference to jquery file in below script.

5) Copy and paste below script into the content editor web part you just added.

$("a[title^='Media']").each(function(){

var txt = "<div id='"+ $(this).attr("title") +"'>" +

"<a href='"+ $(this).attr("href") +"'><img width='"+ $(this).children('img').attr("width") +"' height='" + $(this).children('img').attr("height")+"' src='"+ $(this).children('img').attr("src") +"'/></a></div>";

$(this).replaceWith(txt);

_spBodyOnLoadFunctionNames.push('mediaPlayer.createOverlayPlayer');

mediaPlayer.attachToMediaLinks((document.getElementById( $(this).attr("title"))),['wmv', 'avi', 'mp4']);

});</script>

6) Stop editing the page, and save current changes.

7) Now Edit the item where you want to embed the video.

8) Insert the cursor where you want to add the video (as highlighted below)

9) In ribbon go to Insert -> Picture -> picture from computer

10) Select the Preview image (considering already uploaded in some image library) from the image library which will be act as preview for the video, resize it if you want

11) Make sure inserted image is selected, then go to ribbon -> insert -> Link -> from SharePoint

12) Link the image with the video you want from the asset library (Considering you have already uploaded the video in asset/media lib)

13) Make sure after linking you give description as Media1( you may change this name, make sure you also change it in the script as well)

14) If you want to add multiple videos, follow the same steps except step 13. For last step you need to be sure of adding description, it should be unique and follow same naming convention e.g Media1, Media2, media3 etc…

15) After adding videos save the article/list item, and once its rendered you will see the overlay player working for you.

Sorting SharePoint list item attachments

noreply@blogger.com (Unknown) — Thu, 10 Nov 2011 19:12:00 +0000

-This script is designed/tested only on Display form of list item.
-Add your attachment field under a div using SP designer, <div id="divAttachment"> <SharePoint:AttachmentsField ControlMode="Display" FieldName="Attachments" runat="server" Visible="true"/></div>
-Add below script on the page
<script language="javascript">
var fullHtml = $('#idAttachmentsTable').html();
var fileName = new Array();
var i = 0;
$("#idAttachmentsTable").find('a').each(function() {
fileName[i] = new Array();
fileName[i][0]= $(this).text();
fileName[i][1] = $(this).attr('href');
i++;
});
fileName.sort();
document.getElementById('divAttachment').innerHTML = '';
for(var cntArr=0; cntArr<fileName.length;cntArr++)
{
var strHref = "<a href='"+fileName[cntArr][1]+"'>"+fileName[cntArr][0]+"</a><br/>";
document.getElementById('divAttachment').innerHTML += strHref;
}
</script>

Hide SharePoint List Fileds with blank value from Display form, using HTML comments

noreply@blogger.com (Unknown) — Thu, 24 Mar 2011 20:16:00 +0000

jQuery to find and replace HTML content

noreply@blogger.com (Unknown) — Fri, 23 Apr 2010 18:38:00 +0000

$(document).ready(function(){

$('body').children().each(function() {
//I wanted to replace localhost\sparky to sparky
//first param of replace is nothing but the regex, you can also use the regex
var loginname= $(this).html().replace(/localhost\\sparky/g,'sparky');

//this replaces the modified HTML
$(this).html(loginname);

//I wanted to remove the time stamp 12.00 AM from date
var time= $(this).html().replace(/12.00 AM/g,' ');

//this replaces the modified HTML
$(this).html(time);
});

});

Getting Current User and setting it to the People Picker using JavaScript

noreply@blogger.com (Unknown) — Tue, 28 Apr 2009 11:51:00 +0000

//Set People picker field to current user by Andy Bonner

_spBodyOnLoadFunctionNames.push("fillDefaultValues");

function fillDefaultValues()

{

fillPeoplePickerWithCurrentUser('Submitted_x0020_By');

}

function fillPeoplePickerWithCurrentUser(pickerName)

{

//get the current user from the welcome menu
var currentUser = getCurrentUser();
//check to see that we've got it
if(currentUser != null)
{
//get the people pickers input div
var pp = getPickerInputElement(pickerName);
//set it to the current user if we've found it
if(pp != null)
pp.innerHTML = currentUser;

}

}

function getCurrentUser()
{
var tags = document.getElementsByTagName('a');
for (var i=0; i < tags.length; i++)
{
if(tags[i].innerText.substr(0,7) == 'Welcome')
{
return tags[i].innerText.substr(8,tags[i].innerText.length);
}
}
}

function getPickerInputElement(fieldsInternalName)
{
var result = "";
var divs = document.getElementsByTagName("DIV");
for(var i=0; i < divs.length ; i++)
{
if(divs[i].id=="WebPartWPQ2")
{
var tds = divs[i].getElementsByTagName("TD");
for(var j=0; j < tds.length; j++)
{
var cellHTML = tds[j].innerHTML;
if(cellHTML.indexOf('FieldInternalName="' + fieldsInternalName + '"') >= 0)
{
var innerDivs = tds[j].getElementsByTagName("DIV");
for(var k=0; k < innerDivs .length; k++)
{
if(innerDivs[k].id.indexOf("UserField_upLevelDiv") > 0)
{
result = innerDivs[k];
break;
}
}
}
}
}
}
return result;
}

JavaScript funtion to hide fields on Newform.aspx/Editform.aspx

noreply@blogger.com (Unknown) — Tue, 28 Apr 2009 11:26:00 +0000

•TAGNAME: HTML element that is being rendered ("SELECT", "INPUT"...)

•IDENTIFIER: SharePoint field type identifier ("TextField", "DropDownChoice"...)

•FIELD NAME: Display name of the field (e.g. "Status", "Customer Name"...)

Script starts...

_spBodyOnLoadFunctionNames.push("hideFields");

function hideFields() {
var control = getTagFromIdentifierAndTitle("TAGNAME","IDENTIFIER","FIELD NAME");
control.parentNode.parentNode.parentNode.style.display="none";
}

function getTagFromIdentifierAndTitle(tagName, identifier, title) {
var len = identifier.length;
var tags = document.getElementsByTagName(tagName);
for (var i=0; i < tags.length; i++) {
var tempString = tags[i].id;
if (tags[i].title == title && (identifier == "" || tempString.indexOf(identifier) == tempString.length - len)) {
return tags[i];
}
}
return null;
}

Script ends...

you can also refer to this link

JavaScripts to Disable controls on Newform.aspx/Editform.aspx

noreply@blogger.com (Unknown) — Mon, 27 Apr 2009 08:49:00 +0000

JavaScripts to Disable controls on Editform.aspx

for(var i = 0; i < document.aspnetForm.elements.length; i++)
if ((document.aspnetForm.elements[i].title == "Recommendation")) // give the title of the control that you want to disable
{
document.aspnetForm.elements[i].disabled =
true;
}

JavaScript function to get element using tag name and title

noreply@blogger.com (Unknown) — Mon, 27 Apr 2009 08:38:00 +0000

Add Custom Menu to List Item and Document Library Item

noreply@blogger.com (Unknown) — Mon, 27 Apr 2009 08:30:00 +0000

Filtered Lookup Lists in SharePoint

noreply@blogger.com (Unknown) — Mon, 27 Apr 2009 07:29:00 +0000

SharePoint allows you to create custom lists with your own custom columns. One type you can use for these columns is a lookup against one of your other lists in the SharePoint site. By default this lookup gives the user all the items that are available in the list. Many times, you probably want to have a filtered list instead of the complete one.
Lately, I had to do exactly this for a customer. The approach explained here is probably not the only one you can take but it is one you can start with and it is not difficult to incorporate that within your NewForm/EditForm.aspx (the pages where you actually see the lookup). The approach I have taken is a small JavaScript function that repopulates the dropdown based on the items in the lookuplist that are visible via a view you create. Take for example a list that allows users to submit questions to SharePoint. Besides columns for capturing data regarding the question itself, the user also has to select the person who has to handle the question. In our case, the person submitting the question has one or more roles he or she can select from. A custom list storing this information is create to support the lookup that needs to be done.
When you create the Questions list, you can create a column Role that points to that second lookup list. Problem is that everything out of that list is displayed to the user and we want to have the user only see those entries that are relevant for him or her. So, I first thing I did was to create a new view on the second list that only displays all the roles for the logged on user. This view has the filter set to [Me] (a common practice when creating views).
Next thing you do is to open up the EditForm.aspx of the first list (the questions one) in FrontPage. At the bottom of the HTML (just before the closing BODY tag) you can add the following script blocks.

The first block points to a Javascript file with a generic function to repopulate lists (note that it needs more exception handling to become really generic!). Here is the content of that file:

function RepopulateList(controlName,siteName,lookupListName,lookupViewName,textField,valueField) { // -- retrieve the list for the elements var listEl = document.getElementsByName(controlName) // -- emptying the listif(listEl.length>0) { listEl(0).innerHTML = ""; // -- getting the filtered lookup var reqstring = siteName + "/_vti_bin/owssvr.dll?CS=109&XMLDATA=1&RowLimit=0&List=" + lookupListName + "&View=" + lookupViewName; var req = new ActiveXObject("MSXML2.XMLHTTP"); req.open("GET",reqstring,false); req.send(); // -- loading response in XML Document var doc = new ActiveXObject("MSXML2.DOMDocument"); doc.loadXML(req.responseText); var data = doc.documentElement.childNodes(1); for (i=0;i

The second script block calls this function providing it the necessary values to go back to the server and retrieve the XML with only the data provided by the created view. I use that XML to repopulate the list then. Notice the owssvr.dll I am calling in the script. When you look at a view in a SharePoint, you can always view the source of that page and at the bottom of the page you will find the following information: You can copy this link and run it in the browser. The result is the following: This is the response I need to repopulate the dropdown then with only the roles for the current visitor. The performance is not that great if you apply this technique for big lookup lists so be careful. Test it first for your own specific scenario. To filter big lookup lists, you better have a look at your own custom ASP.NET control.

You can refer to this link as well

JavaScript Funtions to get Query String Value, Host Name and Site Url

noreply@blogger.com (Unknown) — Mon, 27 Apr 2009 07:22:00 +0000

PreSaveAction to EditForm.aspx

noreply@blogger.com (Unknown) — Mon, 27 Apr 2009 07:15:00 +0000

The creators of that script added a “hook” for custom validation called PreSaveAction. This function gets called during the submit action but was never defined so we can create our own. We have a simple strategy: identify Tasks surfaced through our Linked Tasks web part and stop the submit action if Issue status = ‘Closed’ and number of Tasks > 0. Translating that “simple” logic into javascript takes patience and testing. Add the PreSaveAction to the EditForm.aspx page

Sample Event Handler to set Permissions

noreply@blogger.com (Unknown) — Mon, 27 Apr 2009 07:13:00 +0000

This is something I have been seeing the need for in the forums for quite some time, and today I found an hour to find this. A request is often made to have an event handler that automagically sets the permissions on a list item so that only the author of the item can edit it, while other people with contributor permissions on the library can only read it.Sometimes the logic is more complex, but I think this sample code should be enough to get anyone started!

Creating & Adding Event Handler

noreply@blogger.com (Unknown) — Mon, 27 Apr 2009 07:08:00 +0000

In this article, author has create an event handler that captures the events of the document library and add an entry in the cell of the document added. It can add an event handler using code or as a feature. In order to write an event handler, we will first create a sharepoint site and create a document library. We will, then, capture the events of the document library.