Add a time duration to a list/library

Years ago, I setup an InfoPath form for an approval process.  There are around 7 status changes during the duration of this form.  We wanted to be able to see how long a request would take from creation to approval.  This was actually pretty simple.  All that you need is a calculated column.  Follow these steps and you will be able to time an event/process.

  1. Open list/library.
  2. Create Calculated Column (Form Duration)
  3. Enter this for the formula:  =TEXT(Modified-Created,”h:mm”)
  4. Click OK

That’s it!  The calculation will look at the fields provided in the formula.  The time will then calculate based on how long it took from creation to when it was last modified.  If you have a form that hides a submit button based on a status, you will then be able to lock down the time calculation.

Enjoy!

Adjust Width of SharePoint Columns

SharePoint lists and libraries are great.  However, you may have noticed that sometimes, the column width on certain items just looks funky.  To remedy this, all you need to do is add a little javascript.

Go to the list or library that you want to resize and add a Content Editor Web Part.

From the script below, I am referencing jQuery from my internal site.

Copy and paste this code into the CEWP.

<script src=”/PublishingImages/javascript/jquery-1.3.2.min.js” type=”text/javascript”></script><script type=”text/javascript”>$(function(){$(“TH.ms-vh2-nograd:contains(‘Column 1’)”).css(“width”, “350px”);

$(“TH.ms-vh2-nograd:contains(‘Column 2’)”).css(“width”, “350px”);

});

</script>

Column 1” and “Column 2” will be the name or your columns that you want to resize.

Here is an example I used and only resized one column:

Before:

 

 

 

__________________________________________________

After:

 

Highlight line items in a SharePoint list

This is actually a very simple process and only requires a small amount of javascript to do the job.

Follow these steps and your will be highlighting in no time!!!

  1. Go to your list to be highlighted
  2. Edit Page
  3. Add a Content Editor Web Part
  4. Move the CEWP to the bottom of the page
  5. Click the Edit Source button
  6. Copy and paste the following lines of code into the source code section
<script src=”/PublishingImages/javascript/jquery-1.3.2.min.js” type=”text/javascript”></script><script type=”text/javascript” language=”javascript”>var x = document.getElementsByTagName(“TD”) // find all of the TDsvar i=0;for (i=0;i<x.length;i++){if (x[i].className==”ms-vb2″) //find the TDs styled for lists{

if (x[i].innerHTML==”Next Day Pickup”) //find the data to use to determine the color

{

x[i].parentNode.style.backgroundColor=’yellow’; // set the color

}

}

}

</script>

  1. Make your changes to the innerHTML section to reflect the list value for the jquery lookup
  2. Set the color of your choosing.  You can also choose to use the html value for the color: FFFFOO

Please note, I am referencing jquery inside of my SharePoint site.  This way, I do not have to add an external reference.