Remove dashed line that appears around elements of an HTML image map

If you discover that you're being plagued by a dashed line that appears around the <area>  elements of your HTML image map whenever a user clicks on a given element of the image map, here is some jQuery code that you can use to remove those dashed lines...

$(document).ready(function() {

     $("area").focus(function() { $(this).blur(); });

}

To help explain matters, the dashed line is simply an indicator that the user placed the focus on the given element when he/she clicked on it.  The above code works by using the blur method to remove the focus from the selected item after it's been has been clicked.

Reading a value from the Web.config file of an ASP .NET Web Application using Javascript

To read a value from the web.config file of an ASP .NET Web Application using javascript, you can do the following:

1. In your web.config file, add a new <appSettings> with the key and value that you wish for the javascript code to obtain.  In this example, here is the new <appSettings> node, I'm going to reference:
   
   

   <appSettings>
        <add key="Environment" value="TEST" />
   </appSettings>

   
   
   
2. In the HTML code of my default.aspx page, I'm going to add the following javascript function that's going to reference the new <appSettings> node that I just added:
   
   

   function getEnvironment() { 
        var environment = '<%= ConfigurationManager.AppSettings["Environment"].ToString() %>';
        alert(environment);
   }

All you have to do is call this function at an appropriate location in your code and it will obtain the value of the respective <appSettings> node.  Naturally, you'll want to swap out the alert call with some valid code, but the idea of this example is to get you rolling.

Reseeding the Primary Key/ID column of a SQL Table

If you ever need to remove all the records from a SQL database table and then reseed/reset the value of the primary key/ID column, here are the Transact-SQL queries that you can use:

USE [DatabaseName]
TRUNCATE TABLE [TableName]
DBCC CHECKIDENT ("TableName", RESEED, 1);

Debugging a Web Application that was recently converted from Windows to Forms Authentication

If you recently converted a web application you set up to run under Windows Authentication to Forms Authentication (this would have taken place during the setup of your solution), you're likely to encounter an issue in which the debug operation is still running under Windows Authentication despite all of your changes to the web.config file to support Forms Authentication.  Anyway, the reason for this is that there are some setting in your project file that are overriding the web.config settings and they're tied to the IIS Express instance that hosts the site when you place your web application in debug mode.

To fix this problem, you can do the following:

1. Open your web application's solution in Visual Studio 2013
2. In Solution Explorer, click on your web application's project so that it's highlighted
3. Hit the F4 key to open the Project Properties menu
4. Modify your settings appropriately similar to what you did in IIS Manager when you deployed your web application to your Production environment (i.e. Windows Authentication -> Disabled and, perhaps, Anonymous Authentication -> Enabled)
5. Save your changes and hit the F5 key to place the application in debug mode again

At this point, running your web application in debug mode will now execute in similar fashion to what you configured on your production web server for your web application.

Bootstrap box-sizing: border-box Issue

While applying the Twitter Bootstrap to one of my existing web applications, I ran into a slight problem with a univeral CSS setting being applied by the bootstrap.min.css file that was resulting in a few controls appearing, for lack of a better word, "squashed".

The universal setting in the boostrap.min.css file that was causing the issue is presented as follows:

*, *:before, *:after {

     box-sizing: border box;

}

Two resolve the issue, I simply updated the CSS element associated with the controls that were being "squashed" as follows:

#mcc-search-bar * {

  box-sizing: content-box;

}

Once in place, the controls that were leveraging the mcc-search-bar class now appeared as expected.

How to obtain a list of documents from a SharePoint library that were created X days ago using CSOM

In case you ever need to generate a list of documents contained in a SharePoint library that were created, say, 30 days ago or earlier, here is one way that you might go about doing that using CSOM:

using (ClientContext context = new ClientContext(@"https://webApplicationName/siteName"))
{
    context.Credentials = System.Net.CredentialCache.DefaultCredentials;
                    
    List documentsLibrary = context.Web.Lists.GetByTitle("Documents");
                    
    CamlQuery query = new CamlQuery();
    query.ViewXml = "<View><Query><Where><Leq><FieldRef Name='Created'/><Value Type='DateTime'><Today OffsetDays='-30' /></Value></Leq></Where></Query></View>";
         
    //CamlQuery query = CamlQuery.CreateAllItemsQuery();
    ListItemCollection expiringDocs = approvedDocumentsLibrary.GetItems(query);
                   
    context.Load(expiringDocs);
    context.ExecuteQuery();

    foreach (ListItem document in expiringDocs)
    {
        Console.WriteLine(string.Format("{0}", document["Title"]));
    }
}

You'll notice that the crux of the filtering operation is dependent on the XML contents contained in my CamlQuery object as follows:

<View><Query><Where><Leq><FieldRef Name='Created'/><Value Type='DateTime'><Today OffsetDays='-30' /></Value></Leq></Where></Query></View>

with the <Today> element being the key to this in order to take the current date and offsetting it by 30 days in the past.

CAML Queries always take a bit of trial and error in order to get them right so I hope this helps save you some time!

Possible solution for resolving a 409 Conflict Error when uploading a file to a SharePoint 2013 site using CSOM

I was just attempting to upload a file to one of my SharePoint 2013 sites using CSOM when I ran into a 409 Conflict error.  A simplified version of the code I was using is as follows:

using Microsoft.SharePoint.Client;
using Microsoft.SharePoint.Client.Publishing;
using Microsoft.SharePoint.Client.Publishing.Navigation;
using Microsoft.SharePoint;
using System.IO;
...
using (ClientContext context = new ClientContext(@"https://webapplicationname/sitename"))
{
   context.Credentials = System.Net.CredentialCache.DefaultCredentials;
   using (FileStream fs = new FileStream(@"c:\docs\sample.doc", FileMode.Open))
   {
      Microsoft.SharePoint.Client.File.SaveBinaryDirect(context, @"/Documents/sample.doc", fs, true);
   }
}

One major thing I'd like to highlight in the code above is that I was trying to set the context to reference a subsite that is located under the root site collection.  After a bit of experimentation, I actually stumbled onto the solution which is as follows:

using (ClientContext context = new ClientContext(@"https://webapplicationname"))
{
   context.Credentials = System.Net.CredentialCache.DefaultCredentials;
   using (FileStream fs = new FileStream(@"c:\docs\sample.doc", FileMode.Open))
   {
      Microsoft.SharePoint.Client.File.SaveBinaryDirect(context, @"sitename/Documents/sample.doc", fs, true);
   }
}

In the code that worked, notice that I set the context to reference the root site collection and then used the second parameter in the SaveBinaryDirect method call to specify the relative path to the document library on the site in question.  At that point, the code worked perfectly and I was able to upload the document to the site's document library without any issues.

Hopefully, this may help solve your problem as well.

Using jQuery Datatables on an ASP .NET GridView control

Lately, I've been using jQuery DataTables within several custom SharePoint apps that I've created; however, I've recently resurrected an ASP .NET Web Forms application that I was working on many moons ago and wanted to leverage jQuery DataTables on a GridView control that I'm using in this application.

What I discovered is that the crux of the matter when attempting to layer jQuery DataTables over a GridView control is that you need to format the HTML of the GridView so that it's recognizable by the DataTables code.  Essentially, your GridView needs to be formatted like so in order for it to be recognized:

<table>
     <thead>
          <tr>
               <th></th>
          </tr>
     </thead>
     <tbody>
          <tr>
               <td></td>
          </tr>
     </tbody>
</table>

Here is what you can do at the very minimum to make this happen:

ASPX Page:

<script  type="text/javascript" language="javascript" src="Scripts/jquery-1.10.2.js"></script>
<script type="text/javascript" language="javascript" src="Scripts/jquery.datatables.min.js"></script>
<link type="text/css" href="Content/jquery.dataTables.min.css" rel="stylesheet" />

<div class="row">
     <div class="col-md-4">
   
          <asp:GridView ID="GridView1" runat="server" CssClass="gvdatatable" AutoGenerateColumns="true" OnPreRender="GridView1_PreRender">
          </asp:GridView>
     </div>
</div>

<script type="text/javascript">
     $(document).ready(function () {
           $('.gvdatatable').dataTable({});
     });
</script>

ASPX Page Code-Behind:

protected void Page_Load(object sender, EventArgs e)
{
}

protected void GridView1_PreRender(object sender, EventArgs e)
{
     GridView1.DataSource = GetData();  //GetData is your method that you will use to obtain the data you're populating the GridView with

     GridView1.DataBind();

     if (GridView1.Rows.Count > 0)
     {
           //Replace the <td> with <th> and adds the scope attribute
           GridView1.UseAccessibleHeader = true;

          //Adds the <thead> and <tbody> elements required for DataTables to work
          GridView1.HeaderRow.TableSection = TableRowSection.TableHeader;

           //Adds the <tfoot> element required for DataTables to work
           GridView1.FooterRow.TableSection = TableRowSection.TableFooter;
      }

}

This code has been simplified from my original work, but I wanted to provide you with the bare bones minimum code that's needed so that you can get an idea of how to bolt this onto your existing project.  Hope this helps!

How to filter multiple metadata fields when using the SharePoint REST API

To place a filter on multiple metadata fields when you're leveraging the SharePoint REST API to extract information from a SharePoint list or document library, you can utilize the $filter operator; however, you'll need to be careful with how you structure the query or you'll get an error when submitting the request.

To combine these filters, you will need to utilize parentheses to seperate each unique filter operator.  To demonstrate this technique, I'm going to place two filters in my query that will be used to filter on two different metadata fields:

http://SharePointWebApp/SharePointSite/_api/web/lists/getbytitle('Documents')/items?$select=Name,LinkFilename&$filter=((Field1%20eq%20'FilterValueOnField1')%20and%20(Field2%20eq%20'FilterValueOnField2'))&$orderby=Name%20asc

Essentially, the basics of the REST call is that it will obtain the the Name and LinkFilename fields from documents contained in the default Documents library and order the results alphabetically. These results will be filtered so that only documents that have a value in Field1 equal to the specified value of FilterValueOnField1 and a value in Field2 equal to the specified value of FilterValueOnField2.

Use jQuery to programmatically parse the text from an HTML element

If you ever run into a situation in which you need to programmatically remove the HTML tags from an HTML element in order to get the text contained within it, jQuery has a very nice option for this using the jQuery.text() method.  Here is a brutally simple example of how it works:

var htmlText = "<a href='#' target='_blank'>I need this text</a>";
var textINeed = $(htmlText).text();
alert(textINeed);

Naturally, real-life situations are going to be far more complex than this, but I thought this might get you pointed in the right direction.