Console Apps for SharePoint Lists

I recently had a requirement to update a SharePoint list based on a Date and Time field. The list contained two important fields: the Date and Time field called ‘Hire Date’ and a field called ‘Active’. The goal was to update the list item when the ‘Hire Date’ field was equal to today’s date and change the ‘Active’ field to false.

This is simple in a workflow, however, the item was NOT getting updated when ‘Hire Date’ was equal to today so there was no way to trigger the workflow. A simple alternative is a .NET console app that runs every day using Windows Task Scheduler.

The app itself is simple, it uses CSOM to get the values of the item and updates the Active column when appropriate.

There are several advantages to using a console app and  running it on a schedule:

  • It’s easy to parse the values of a list and preform an update
  • I don’t need to do something as unnecessary as pause a workflow on Item Creation to the ‘Hire Date’ and leave it paused for potentially weeks
  • And most importantly, I’m not using a Custom Timer Job. SharePoint Timer Jobs, particularly custom ones, can be resource intensive strains on your SharePoint server. If your SharePoint server is already strained for resources, like ours, console apps are a quick and efficient way to check for and make updates to SharePoint Lists.

There are no lists to show in this view

Recently I stumbled on an interesting problem: I needed to open and modify a list in SharePoint designer. So, I opened the list and found that designer gave a generic “There are no lists to show in this view” message. However, this particular site had over fifty lists that I could clearly see in the UI. The solution, which I found here, was a list that had been deleted was showing up.

As the blog suggest you can use a REST call to your site http:// [sharepoint] / [site] / _vti_bin/listdata.svc which should give you some XML, append a list name to this http:// [sharepoint] / [site] / _vti_bin/listdata.svc/ [list name] and with a little hunting you should be able to find your broken list. I was able to find it by trying to open the list through the browser and see a “This page does not exist” error. From here, the list can be deleted.

Finally, close designer and clear your webcache, reopen designer and you should now be able to open your list in designer.

I believe this may have occurred in our migration from 2010 to 2013. The site in question had several outdated and unused lists that needed to be cleaned up and/or deleted. The link to the list seems to have persisted even though it no longer existed and this prevented designer from open the site correctly.

$(#SharePoint).jQuery(); pt. 2

Pt. 1 Fixing Multi-Choice Column
Pt. 2 Changing Grouped By Views

Pt. 2 Changing Grouped By Views

Another frequent UI correction is to remove the column title in Grouped By views. By default, the Grouped By view will group items together that share a field value. If you have several items, each with a field called Category and a field value of Category 1, those items will be grouped together.

The below items have two fields: Title and Category and are Grouped By Category. So all items with Category 1 are grouped together, all items with Category 2 are grouped together, etc. The goal here is to remove the word “Category” in each grouped section of the Grouped By View, leaving only “Category 1”, instead of “Category: Category 1”.

groupedBy_no_category

Before

groupedBy_category

After

 

 

 

 

 

 

 

 

 

 

 

Like last time, jQuery makes this very simple:

removeGroupedByText

The above function accepts a string to remove and iterates through the each grouped section and removes the text in textToRemove. This text should match the text you want to remove exactly, in the above example textToRemove should be set to “Category” to remove the text Category from the Before screenshot above and produce the After screenshot.

It’s also worth noting that list views allow two levels of grouped sections.

groupedBy_second

Before

groupedBy_second_removed

After

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

 

removedGroupedByTextSecondLevel

Like the first function this can remove the SecondCategory text. Notice the difference in selectors. Again the text should match exactly the text that you want to remove, in the above Before screenshot the text should be “SecondCategory” to produce the After screenshot.

Credit goes to this thread on stack exchange where I was given the answer.

$(#SharePoint).jQuery(); pt. 1

Pt. 1 Fixing Multi-Choice Column
Pt. 2 Changing Grouped By Views

Pt. 1 Fixing Multi-Choice Column

We use jQuery across SharePoint to make a lot of UI and UX corrections. One of our most common UI corrections is for displaying choice column values in lists views that are multi-select. If you have list with a choice column and allow users to multi-select more than one option it will get displayed in the list view as: [choice1],[choice2]:

before

This is great for parsing data but our end users hate it and I agree that from an end user standpoint you’re expecting to see choice1 and choice 2 horizontally displayed without the “,” delimiter.

There is a simple solution for this:

As I mention this is easy to parse, so knowing the column number of the list view and the delimiter for display, we can iterate through the list view and replace the html with the choices delimited by a <br> tag. This will display the choices horizontally as our users expect and can be abstracted into a global javascript function that can be called across your site collection.

jQuery_delim

Here, we need to know the column number and in the above the choice is the fourth cell in each row of the table or the fourth column. (The check and ellipsis are cells or columns of their own). The delimiter in this case is a “,” , so we want to find all instances of the “,” in the html. If you include a string “,” here it will only match the first instance. The regular expression /,/g will find all matches. Finally we want to replace with a <br> tag and push each choice to the next line. Knowing that we iterate through each tr and find the column number and get the html. Then we replace all instances of the delimiter with the <br> tag and finally set the html to our new variable to get the below:

after

This is best abstracted and called as a global function whenever you need it. Also note that other columns types will delimit by other delimiters like “;”.

SharePoint 2013 drag and drop feature

One of the most useful features of SharePoint 2013 is the ability to drag and drop documents or entire directories into Document lists.
drag_and_drop_library

I’d noticed that this wasn’t working consistently for all of our users and after some looking, there is a plethora of blog posts and explanations for this–so, I’ll add one more to it.

The drag and drop feature requires an IE version 10 or greater OR Office 2013. Our current standards for our users were IE9 and Office 2010, so of course they weren’t seeing it. I’m running IE10 and have both Office 2010 and Office 2013 installed for development purposes, which satisfies the requirements for it’s use. Importantly, this doesn’t mean that it’s impossible for users with IE9 or lower or Office 2010 to use it.

The simple solution is to install SharePoint Designer 2013 and choose Custom Installation. Deselect everything (including SharePoint Designer) except Office Tools. This will install the correct Active-X control and allow the drag and drop functionality to work.

installation

Useful SharePoint dlls

SharePoint has some great features like exporting list views to Excel or connecting Calendar events to your Outlook calendar. However, this might not always be easy for end users or users might not be willing to use the Ribbon menu to access these features (as in my case). Thankfully using REST, a little JavaScript can put this functionality directly onto a regular page as links to export to Excel or add an event to your Outlook calendar.

Exporting to Excel
In my first example, we had users who were rolling up list data onto a reporting page. From this page they wanted to export a different view of the list that we had set up for them. That, however, required them to navigate to the list and use the export to Excel button in the Ribbon menu:

export

On the reporting page, I added an Excel button with with a class Caption. With a line of JavaScript this can be set to the correct url:

var href = “http:// [sharepoint] / [site] /_vti_bin/owssvr.dll?CS=109&Using=_layouts/query.iqy&List=[List Guid]&View=[View Guid]&CacheControl=1”
$(“.Caption a”).prop(“href”, href);

This will give you a button to export whatever view of the list you would like to Excel:

export_button

As much as, I’d like to take credit for this discovery, check this link below for the thread and this link to another blog with that solution.

Add to Outlook Calendar
In my second example. we created a SharePoint calendar for users to manage events. A workflow sends them an email with the link to the event when they change the category of an event indicating that this is an event they will be attending.

Like the first example. this is also pretty simple. We created a calculated column with the value of the link below:
http:// [sharepoint] / [site] / [list] /_vti_bin/owssvr.dll?CS=109&Cmd=Display&List=[List Guid]&CacheControl=1&ID=&Using=event.ics

Notice the event.ics at the end which give us an ics file to create an Outlook calender event. This can then be included in the workflow email and will give them a link like the below:
outlook_calendar

Add new Item prompt in SharePoint List

In a SharePoint list after clicking on the “Add new item” button, users will be taken to a form, fill out information and click save. At this point the form closes and the user can see the new item in their list. But what about when users want to add several items at once without clicking “Add new item” each time?

Luckily, there is the PreSaveAction() function that can be used to perform certain actions before the item is saved to the list:

preSaveAction

Thanks to a little hunting and this stack overflow post, I was able to learn that PreSaveAction() allows the user to override the default save button click behavior. In my example, I wanted to prompt the user to create another item or close the form. This can be accomplished with a simple javascript alert, as seen above in my defined PreSaveAction() function. What I’m doing is getting the current form url and saving it to a variable called current URL.

First, CurrentURL will look something like this: http:// [SharePoint ]/ [site] / [list] /newForm.aspx.

Secondly, I am saving the source parameter (where I want to redirect to — this form to add another item), in a variable called redirect. redirect will look something like this: ?Source=http://[SharePoint]/[site]/[list]/newForm.aspx. Keep in mind that appending the ?Source parameter to a SharePoint URL will control where the user is redirect after saving an item. In my case I can redirect them back to the newForm after saving an item.

Third, on the save button click, I call my PreSaveAction() function, which prompts the user to create another item, if they say no, the item is saved and the window is closed. If they say yes, window.location.search is set to the redirect variable. window.location.search returns the querystring which is exactly the part I want to set. This will then save the item and then redirect the user to the newForm where they can submit another item.

Format Date

One of the things I find myself looking up frequently is Date Values for SharePoint. When creating custom display forms, you typically end up with date and time values that look something like this: 2013-07-24T21:00:00Z. This isn’t really a useful value (to an end user). To change it to something more readable open designer and the disp form:

Find the date field:

My Start Time field looks like this in the form:
date_field
The corresponding code in designer:
date_field_code
The xsl:value of tag contains the information to modify. The select attribute is equal to the EventDate value, which is the Start Time. To make a more readable value, it can be changed to:
date_field_code_changed
The ddwrt namespace must be included to use a function like FormatDate. FormatDate, like the name implies, will change the formatting shown above to something useful or readable to an end user. Explanation of the parameters taken from the msdn page:
“The parameter szDate is converted to a DateTime. Based on the formatFlag parameter, which can have a value 0–15, a new DateTime string is constructed in the given locale lcid. Table 5 shows the results returned from this function.”
The above code will result in the below; a nicely formatted date for end users:
date_field_changed
Check the msdn article for a list of formats.