Category: 3DW DevTools

Black out certain days in from the Jquery Calendar Picker

The JQuery Calendar picker is a very handy element that is used in many places on the web. The default functionality is great, but what if you need a custom date range, or to black out specific dates?  The picker has an event handler called “beforeShowDay” that will let you hook into and modify what dates are available to pick from the element.

For example, to allow users to sign up for campus visits on Tuesday and Thursday, I needed to  “black out” the rest of the days from the ui. I also needed to black out a couple of days that will be unavailable due to special events. I can write a function to specify these days, then call the function on the “beforeShowDay” event handler.

[code]

var unavailableDates = [“19-5-2016”, “16-6-2016”];
function unavailable(date) {
dmy = date.getDate() + “-” + (date.getMonth()+1) + “-” +date.getFullYear();
if ($.inArray(dmy, unavailableDates) < 0) {
return [true,””,””];
} else {
return [false,””,”This day is unavailable.”];

}
var day = date.getDay();
return [(day == 2 || day==4)];
}
$( “#mydatefield” ).datepicker({
minDate: ‘+7d’, changeMonth: true,   changeYear: true, yearRange:”c-80:c”,  beforeShowDay: unavailable});

[/code]

Change an elements class with JavaScript

To change all classes for an element:

To replace all existing classes with one or more new classes, set the className attribute:

document.getElementById("MyElement").className = "MyClass";

(You can use a space-delimited list to apply multiple classes.)

To add an additional class to an element:

To add a class to an element, without removing/affecting existing values, append a space and the new classname, like so:

document.getElementById("MyElement").className += " MyClass";

To remove a class from an element:

To remove a single class to an element, without affecting other potential classes, a simple regex replace is required:

document.getElementById("MyElement").className =
   document.getElementById("MyElement").className.replace
      ( /(?:^|\s)MyClass(?!\S)/g , '' )
/* code wrapped for readability - above is all one statement */

An explanation of this regex is as follows:

(?:^|\s) # match the start of the string, or any single whitespace character

MyClass  # the literal text for the classname to remove

(?!\S)   # negative lookahead to verify the above is the whole classname
         # ensures there is no non-space character following
         # (i.e. must be end of string or a space)

The g flag tells the replace to repeat as required, in case the class name has been added multiple times.

To check if a class is already applied to an element:

The same regex used above for removing a class can also be used as a check as to whether a particular class exists:

if ( document.getElementById("MyElement").className.match(/(?:^|\s)MyClass(?!\S)/) )

Loop through form post vars in C#

It’s helpful to be able to loop through the form object collection so you know what vars are being posted.
Here is an example from the MSDN docs.

This will display the form vars in a label object…
System.Text.StringBuilder displayValues =
new System.Text.StringBuilder();
System.Collections.Specialized.NameValueCollection
postedValues = Request.Form;
String nextKey;
for(int i = 0; i < postedValues.AllKeys.Length; i++)
{
nextKey = postedValues.AllKeys[i];
if(nextKey.Substring(0, 2) != “__”)
{
displayValues.Append(”
“);
displayValues.Append(nextKey);
displayValues.Append(” = “);
displayValues.Append(postedValues[i]);
}
}
Label1.Text = displayValues.ToString();

Temporary disable HTML5 “required” attribute

Sometimes when developing, I need to turn off the html5 required so that I my test and implement server side validation. I don’t want to have to remove the attribute from each input element manually, and then have to put them back on. So I use jquery to select the inputs and remove the required attribute.  Then I just delete this line of code when I’m finished testing/developing and wish to turn back on html5 client side required.

// temp for dev
$(“:input”).each(function(){$( this ).removeAttr(“required”);});

Set variables on a master page from content pages C#

studentID = System.Convert.ToInt32(Session[“sid”]);
studentFname = Session[“studentFname”].ToString();
studentMname = Session[“studentMname”].ToString();
studentLname = Session[“studentLname”].ToString();
char[] m = studentMname.ToCharArray();
studentMiddleInitial = m[0].ToString();

Label1.Text = studentID.ToString();
Label mpLogin = (Label)Master.FindControl(“usernamedisplay1″);
mpLogin.Text = studentFname + ” ” + studentMiddleInitial + ” ” + studentLname;

Make first letter of a string upper case in C#

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;

namespace FirstLetterUpperCaseString
{
    class FirstLetterUpperCase
    {
        static void Main(string[] args)
        {
            string a = "akshay upadhyay";
            Console.WriteLine("Before operation : " + a);

            //Converting string to character array
            char[] s = a.ToCharArray();

            //Convert the first char to upper case
            s[0] = char.ToUpper(s[0]);

            //Reconverting array to string
            a = new string(s);
            Console.WriteLine("After operation : " + a);

            Console.Read();
        }
    }
}

Get ID of last record inserted – VBScript – SQL Server

Here is the technique to get the ID number of the last record inserted (right as you insert it)

Dim db,rcs,new_identity

‘Create a database connection
Set db = Server.CreateObject(“adodb.connection”)
db.Open “DSN=MyDSN”

‘Execute the INSERT statement and the SELECT @@IDENTITY
Set rcs = db.execute(“insert into tablename (fields,..) ” & _
“values (values,…);” & _
“select @@identity”).nextrecordset

‘Retrieve the @@IDENTITY value
new_identity = rcs(0)

CSS3 Glowing Inputs

input[type=text], textarea {
-webkit-transition: all 0.30s ease-in-out;
-moz-transition: all 0.30s ease-in-out;
-ms-transition: all 0.30s ease-in-out;
-o-transition: all 0.30s ease-in-out;
outline: none;
padding: 3px 0px 3px 3px;
margin: 5px 1px 3px 0px;
border: 1px solid #ddd;
}

input[type=text]:focus, textarea:focus {
box-shadow: 0 0 5px rgba(81, 203, 238, 1);
padding: 3px 0px 3px 3px;
margin: 5px 1px 3px 0px;
border: 1px solid rgba(81, 203, 238, 1);
}