By design we provide startEditTriggers option which specifies how end-users are able to start edit mode. Possible values are: "click", "dbclick", "F2", "enter" and their combinations separated by comma array. The keyboard triggers have effect only if the grid cells can receive focus or Selection is enabled. 

In regards to when the calendar will be closed this depends on your custom implementation and how you are handling the events of the you custom editor provider.

Having validator for your custom editor provider can be achieved by creating one when creating the editor provider. This can happen in the definition for validation public method. There you could set the text for the error message via the errorMessage option of the igValidator. In order to bind the validator with your editor you should set its selector option to the id of the editor`s element.

    // validate the editor
    validator: function () {
		if (!$("#customValidator").data("igValidator")) {
			$("#customValidator").igValidator({
				fields: [{
					notificationOptions: {
						direction: "right",
						showIcon: "true",
						mode:"popover",
						messages: {
							error: "This field is required!"
						}
					},
					required: true,
					selector: "#customEditor",
					valueRange: [2],
					onblur: true,
					errorMessage: "Should contain only numbers",
					custom: function (value, fieldOptions) {
						var myRegEx = /^[0-9]+$/;
						var isValid = myRegEx.test(value);
						return isValid;
					}
				}]
			});
		}
        return $("#customValidator").data("igValidator");
    },

Please keep in mind that the element used for your validator should be wrapped in a container. For example, in my sample I am using <input> element for the custom editor provided and I have wrapped it in a div element to act as a container.

$.ig.MyEditorProviderNumber = $.ig.EditorProviderNumber || $.ig.EditorProvider.extend({
    // initialize the editor
    createEditor: function (callbacks, key, editorOptions, tabIndex, format, element) {
        element = element || $('<div id="editorContainer"><input id="customEditor"  /></div>');
        // call parent createEditor
        this._super(callbacks, key, editorOptions, tabIndex, format, element);
 
        element.find("#customEditor").on("keydown", $.proxy(this.keyDown, this));
        element.find("#customEditor").on("change", $.proxy(this.change, this));
 
        this.editor = {};
        this.editor.element = element;
            return element;
    },

Attached you will find my sample for your reference. For the "Age" column I am checking whether only digits are entered and I am setting a custom error message if there are anything else entered and the user tries to exit edit mode.

Please test it on your side and let me knw if you have any additional questions afterwards.

8507.igGridCustomEPCustomValidator.zip

What I can suggest is creating a custom editor provider for your column. Editors of the Updating feature are implemented by an editor provider abstraction which provides common editing communication interface with the Updating feature. Since the default behavior is not working for your scenario a custom editor can be created for that particular column. You can implement a custom date picker editor for your string column and handle its events as per your requirement. 
Here we have a topic that will guide you through the process of implementing a custom editor provider that extends igEditorProvider class. I believe you will find it very helpful. In addition we have a working sample illustrating how such an editor can be achieved.

Please have a look at the provided resources and let me know if I can be of any further assistance.

Hello Kashinath,

Thank you for posting in our community.

By design editor providers are assigned to columns based on their dataType property. Please keep in mind that even if the date is coming as string if it is in the correct format the corresponding column in igGrid can be set as date type so that all editors are assigned correctly. For example, if the underlying data looks like the following:

var employees = [
    {
        "EmployeeID": "56250fa57ab1535722e564a6",
        "FirstName": "Downs",
        "LastName": "Holcomb",
        "Country": "Italy",
        "Age": 35,
        "RegistererDate": "07/25/2015",
        "RegistererTime": "07/25/2015 8:00",
        "IsActive": false
    },
	.
	.
	.
]

"RegisterDate" and "RegisterTime" column can be defined with dateType: date. For example:

{ headerText: "Register Date", key: "RegistererDate", dataType: "date" },

Attached you will find a small sample for your reference.

Additionally, more about date handling in igGrid can be found here.

Please let me know if you need any further assistance with this matter.

3438.igGridDatePicker.zip