Cincinnati SharePoint User Group Meeting Thursday 8/4/11

 

http://www.CincinnatiSPUG.org/

 

Meeting date:     Aug 4, 2011, Thursday
Time:                   6:00 – 8:00 pm.
Where:                Max Technical Training, 4900 Parkway Dr. #160 Mason, OH.  
                             Directions  http://www.maxtrain.com/directions

 

Schedule:
6:00 – 6:25 - Socials and Networking - No Registration required
6:25 – 6:30 - Introduction of Agenda and Speakers
6:30 – 8:00 – Presentation

 

Session Title: “Caching-In” for SharePoint Performance

Abstract: Caching is a critical variable in the SharePoint scalability and performance equation, but it’s one that’s oftentimes misunderstood or dismissed as being needed only in Internet-facing scenarios.  In this session, we’ll build an understanding of the caching options that exist within the SharePoint platform and how they can be leveraged to inject some pep into most SharePoint sites.  We’ll also cover some sample scenarios, caching pitfalls, and watch-outs that every administrator should know.

Speaker bio: Sean P. McDonough
Bio: Sean is a Product Manager for SharePoint Products at Idera, a Microsoft gold certified partner and creator of tools for SharePoint, SQL Server, and PowerShell.  As a consultant, Sean has worked with a number of Fortune 500 companies to architect, implement, troubleshoot, tune, and customize their SharePoint environments. Sean is an MCPD, an MCTS, and the co-author of both the “SharePoint 2007 Disaster Recovery Guide” and the “SharePoint 2010 Disaster Recovery Guide”.

 

.

SharePoint 2010: Finding a Unique HTML ID Using the $get Function

 

ID=…

 

Go look up the definition of the HTML ID attribute. The standards say that the ID must be unique in the page. No two elements should share the same ID.  SharePoint frequently breaks this rule. If you have two web parts of the same, or similar, type, they will often each have elements with the same ID. As an example, any web part in 2010 that displays a document icon (Word, Excel, etc) has an anchor tag like this one: <a id="diidSortDocIcon". As a result, the DOM method getElementById will not work as you might hope. While methods like getElementsByTagName (note the “s”) will return a collection of elements, getElementById (note no “s”) either returns null or the first element found with that ID. Bottom line, unless you loop through all of the elements in the page and check each one for that ID, you will only be able to retrieve the first element that uses that ID.

 

$get

To deal with this problem, Microsoft added a function to SharePoint with the name $get(). (Actually I believe this $get is part of the AJAX client side libraries.) This function, when passed a single parameter, will return the first element with that ID in the document. When called with an object as the second parameter, it searches all of the child nodes of that object for an element with that ID and returns the first one it finds.

Here’s what the function code looks like when displayed from an alert():

   

 

$get("IdToFind",ElementToSearchWithin)

The code displayed above is kind of interesting. If the second parameter is not supplied, then the code just uses getElementById and returns a null or a the single element. If the second parameter is supplied, then the code finds all of the child nodes of the the element listed as the second parameter. It then loops through all of the child elements until it finds one with the ID in the first parameter. (if (a.id == f)

 

As an example, the following will display the innerHTML of the element with the ID of “diidSortDocIcon”, but only if it is found in the element with the ID of “MSOZoneCell_WebPartWPQ6”.

var mywebpart = document.getElementById(“MSOZoneCell_WebPartWPQ6”)

$get("diidSortDocIcon", mywebpart).innerHTML

 

This could also be written as:

$get("diidSortDocIcon",$get("MSOZoneCell_WebPartWPQ6")).innerHTML

 

$get(), just another little tool for your SharePoint customization toolbox!

 

.

SharePoint: Changing the “Add New” Icon

 

I just got an interesting question on the “Change the “Add New” message for a web part” article about replacing the icon in the Add New Item area of a web part. As CSS does not let you change the attributes of an element (i.e. “src=”), the solution is a bit of a trick.

The before and the after for SharePoint 2007:

 

And in 2010:

   

The CSS below first hides the existing icon, and then adds a background image to the anchor (“A”) tag. As this results in the text being displayed over the icon, the CSS also needs to add a little padding to move the text over a bit.

The CSS for both 2007 and 2010

Add just before the </head> tag in the master page or in a content editor web part on a single page.

<style>

/*  hide the existing image  */
.ms-addnew img
{
  display:none;
}

/*  add a background image  */
.ms-addnew a
{
  background:url(_layouts/images/titlegraphic.gif) no-repeat;
  padding-left: 25pt;
}

</style>

 

 

.

SharePoint Saturday Columbus 2011!

 

Join me and thirty other speakers for a free day of SharePoint learning on Saturday August 20th, 2011.

 

Go and check out the list of speakers and register!  It’s FREE!

   http://www.sharepointsaturday.org/columbus/default.aspx

Stolen right from their web site:

Join SharePoint architects, developers, and other professionals that work with SharePoint 2007 and 2010 for SharePoint Saturday Columbus event.  SharePoint Saturday is an educational, informative & lively day filled with sessions from respected SharePoint professionals & MVPs, covering a wide variety of SharePoint-orientated topics.  SharePoint Saturday is FREE, open to the public and is your local chance to immerse yourself in SharePoint!

 

I will be speaking on a subject that I’ve always enjoyed (and what much of this blog is about), “SharePoint 2007 and 2010 Customization for Site Owners”.

This session will get you, the SharePoint Site Owner, started in customizing your SharePoint site. It is not a programming session, but does include some JavaScript coding. It is not a graphics design session, but does include some Cascading Style Sheets. It is not a SharePoint Designer session, but it will make use of it. And nothing requires access to the SharePoint servers.

While the session is for the SharePoint Site Owner, it's also for the developer who does not want to "reinvent the wheel". All you need to apply what you learn here are basic SharePoint skills, how to copy and paste and some puzzle solving skills.

And as I have just released a book on the same topic, I’ll be brining a few copies to give away! If you don’t want to wait until August, you can get it at Amazon (with free shipping) or until the end of July, directly from the publisher with a 25% discount (with this code: 77ULP6VH).

 

 

.

SharePoint 2007: Moving the View Dropdown for Wide Lists

 

One of the annoying “features” of SharePoint 2007 is how the View dropdown gets pushed off of the page when working with list views with many columns.

 

Left part of the page:

One scroll to the right:

     

Two scrolls to the right and we can now find the view menu:

           

 

What would be nicer would be a View menu just to the right of the other toolbar buttons.

 

All we need to do is write a little JavaScript to find the toolbar TABLE and adjust the column widths.

Steps for a single view page:

1. Display the list’s view page
2. Click Site Actions, Edit Page
3. Add a Content Editor Web Part and move it to the bottom of the page (below the list’s web part)
4. Edit the Content Editor Web Part, click the Content Editor button and paste in the following JavaScript
5. Save everything and test!

Steps for all lists, pages and views:

1. Open SharePoint Designer and open your site
2. Open your master page (typically default.master)
3. Scroll to the bottom of the page and click just before the </body> tag
4. Paste the following JavaScript
5. Save everything and test!

 

<script>
// from TechTrainingNotes.blogspot.com

// find all tables
var x = document.getElementsByTagName("table");
for (var i=0;i<x.length;i++)
{
  // find the table with this class
  if (x[i].className=="ms-menutoolbar")
  {
    // change the widths of all of the cells to 0
    for (var j=0; j<x[i].rows[0].cells.length;j++)
    {
      x[i].rows[0].cells[j].style.width="0"
    }
    // change the width of the last column
    x[i].rows[0].cells[j-1].style.width="100%"
  }
}

</script>

I tried to solve this little problem by using CSS instead of JavaScript. I got close, but ended up with an empty cell at the end of the row. So, let me know if you find a CSS solution.

<style>

.ms-listheaderlabel
{
  width:100%
}
.ms-menutoolbar
{
  width:0;
}
</style>

 

.