Show Current Date Time in field in alpaca automatically - alpacajs

I am using alpaca framework. I have date time type, when I click on it only I can able to select the DateTime, I want this to be filled automatically with current date time when it gets focus or when page loaded.
Any suggestions please.

You can use the "data" object in alpaca config to set the date field default value to current date:
"data": { "myDateField": new Date() // or you can use moment } }
You can also set the date in the postRender function like this:
"postRender": function(control) {
var date = control.childrenByPropertyId["date"];
var currentDateTime = moment().format("MM/DD/YYYY HH:mm:ss")
date.setValue(currentDateTime);
}
Here's a working fiddle for that.

Related

Nativescript-vue: how to initialize DatePicker

Goal: I need to init a datepicker to be set to a max date of today - 18 years (birthDateMax), and to save its value into birthDate
In template I have
<DatePicker class="date_not_choosen"
v-if="! birthDateSet"
maxDate="birthDateMax"
v-model="birthDate"
/>
In script (note that I am using momentJs library.
data() {
return {
birthDateMax: moment().subtract(18, 'years').format('Y-MM-DD'),
birthDate: this.birthDateMax,
}
}
The problem: when app starts, the date picker is set a 1970-01-01
Replace maxDate="birthDateMax" with :maxDate="birthDateMax".
The : is the shorthand to Vue's v-bind:, which is required to make the attribute maxDate reactive.

Angular 5 Validators.pattern('(0\d{1}|1[0-2])\\/([0-2]\d{1}|3[0-1])\\/(19|20)\d{2}') Not working

the input field always showing error, could some one help me.
var dateRegEx = /^(0\d{1}|1[0-2])\/([0-2]\d{1}|3[0-1])\/(19|20)\d{2}$/;
hiredate: new FormControl({value:null}, Validators.compose([Validators.required,Validators.pattern(dateRegEx)])),
This is also not working.
Update: I used the control with mat-datepicker, which setting the control value automatically to javascript date if we input default mm dd yyyy format otherwise it is setting null.
<mat-form-field>
<input matInput id="hiredate" name="hiredate" required [matDatepicker]="picker1" placeholder="Hire Date" formControlName="hiredate">
<mat-datepicker-toggle matSuffix [for]="picker1"></mat-datepicker-toggle>
<mat-datepicker #picker1></mat-datepicker>
<mat-error *ngIf="isFieldInvalid('hiredate')">
Please provide Hire Date
</mat-error>
</mat-form-field>
Please check my answer.
After debugging I found that, the underlaying mat-datepicker automatically setting the input value to Date value, and it accepts the default format as mm[-/. ]dd[-/. ]]yyyy if the user inputs in this format, it sets control value as Date value, which is not validated with date pattern. if the user provides in different pattern input, it sets control value as NULL.
import {Injectable} from "#angular/core";
import {FormControl} from "#angular/forms";
#Injectable()
export class DateValidator {
constructor() {
}
static date(c: FormControl) {
//const dateRegEx = new RegExp(/^(0\d|1[0-2])\/([0-2]\d|3[0-1])\/(19|20)\d{2}$/);
//console.log('Date Value is:',c.value);
return c.value!=null ? null : {
dateValidator: {
valid: false
}
};
}
}
and the control defined with validator as
hiredate: new FormControl({value:null}, Validators.compose([Validators.required,DateValidator.date])),
and now the validator working fine with mat-datepicker

How to make Date Editable while using Glass mapper

Today i am facing one issue which has following requirement.
Date should be Editable.
Date should be in particular format.
My Code is like below which is not working.
foreach(var item in Model)
{
<div>#Editable(item, x => x.Start_Date.ToString("MMMM dd,yyyy"))</div>
}
I have tried following approach but throwing "DateParameters" namespace error.
#Editable(item, x=> x.Start_Date, new DateParameters { Format = "MMMM dd,yyyy"})
Also i have learner following thing but how can i achieve this ?
To make a field editable takes two parameters, this has been used to make the Date field editable. The first parameter instructs Glass.Mapper which field to make editable, the second parameter then specifies what the output should be when the page is not in page editing mode. This allows you to control the output of the field when in the two different modes.
Can anybody help me ?
For Experience editor mode, this works for me in razor view:
#Editable(model => model.SomeDateField, new { Format = "dd-MM-yyyy" })
Sitecore 8.2 though, with Glass 4.4.
What you want to do is to provide the default format but keep things the same for the main glass stuff. Like so:
foreach(var item in Model)
{
<div>#Editable(item, x => x.Start_Date, x=>x.Start_Date.ToString("MMMM dd,yyyy"))</div>
}
This will make the date a normal date when editing, but allow you to format it for the final page.
Usually in this case i use different code for "Normal View" and "Experience Editor", so for normal view you need only to display the date with format without making it editable, and on experience editor you need only to edit the date field the author will not care about the date format with experience editor, so your code will be like this :
foreach(var item in Model)
{
{
#if (Sitecore.Context.PageMode.IsExperienceEditorEditing)
{
<div>#Editable(item, x => x.Start_Date)</div>
}
else
{
<div>#item.Start_Date.ToString("MMMM dd,yyyy")</div>
}
}
}
I have tried that as well but it is throwing an error like below
**Value cannot be null. Parameter name: objectToSwitchTo
at Sitecore.Diagnostics.Assert.ArgumentNotNull(Object argument, String argumentName)
at Sitecore.Common.Switcher2.Enter(TValue objectToSwitchTo)
at Glass.Mapper.Sc.GlassHtml.MakeEditable[T](Expression1 field, Expression1 standardOutput, T model, Object parameters, Context context, Database database, TextWriter writer)**
Any help on this ?

ember pick-a-date how to pull value?

There is a pick-a-date add-on for Ember found here.
{{pick-a-date date=(readonly date) on-selected=(action (mut date)) placeholder="Pick a date" options=(readonly extraPickadateOptions)}}
How would I pass a saved date value to the tag? The below (value=date) does not seem to work?
{{pick-a-date value=date date=(readonly date) on-selected=(action (mut date)) placeholder="Pick a date" options=(readonly extraPickadateOptions)}}
Or what if I wanted to change the value from 'date' to something different... for example dob... so it would 'mimic' this
{{input value=dob}}
I have also tried using this addon and faced same issue. I need date in timestamp format and I implemented like following. You can check this,
{{pikaday-input
value=inputDateValue
onSelection=(action 'setSelectedDate') }}
For getting the value and binding that to object, I added following code in action handler,
actions : {
setSelectedDate : function (date) {
//To get the timestamp in seconds
let timestamp = Math.floor(date.getTime() / 1000);
this.set("inputDateValue", date);
// Used timestamp for setting value to object
record.set("dateTime", timestamp);
}
}
For setting the value I used folowing code,
if(record.get("dateTime") {
let date = record.get("dateTime") * 1000;
let dateValue = new Date(date);
this.set("inputDateValue", dateValue);
}

CouchDB filter timestamps in a reduce function - some sort of Date.now?

Can a Date.now type function be used in either map or reduce functions? Can it be used anywhere at all?
More specifically, the view must not cache the Date.now value.
Here is what I tested that only worked for the first run after a change to any view function:
function (doc){
var n = new Date();
if(doc.TimeStamp > n.getTime() - 30000){
emit(doc._id, doc);
}
}
The view rows will be refreshed only when the particular doc gets updated. But you can request the view for that result: emit the doc.TimeStamp as key and request the view with ?startkey=timestamp where timestamp is the value of now.getTime() - 30000.
Yes. var now = new Date() should work.
The condition must result in false. You can test it with the view:
function (doc) {
var now = new Date()
var timestamp = now.getTime()
emit(timestamp,null)
}
It will respond something like
{
"total_rows":1,
"offset":0,
"rows" :[{
"id":"ecd99521eeda9a79320dd8a6954ecc2c",
"key":1429904419591, // timestamp as key
"value":null
}]
}
Make sure that doc.TimeStamp is a number (maybe you have to execute parseInt(doc.TimeStamp)) and greater then timestamp - 30000
Two words about your line of code emit(doc._id, doc);:
To emit doc._id as key means maybe you doesn't need the view. Simply request the doc by GET /databasename/:id. Also to include doc._id in multipart keys or the value of the view row is mostly not necessary because its included in every row automatically as additional property. One valid reason would be when you want to sort the view over the doc ids.
To emit the doc as value is not recommended for performance reasons of the view. Simply add ?include_docs=true when you request the view and every row will have an additional property doc with whole doc in it.