danielo515 / obsidian-modal-form

Define forms for filling data that you will be able to open from anywhere you can run JS
https://danielorodriguez.com/obsidian-modal-form/
MIT License
187 stars 14 forks source link

Request: ability to set default values for date fields #245

Closed johnwalk61 closed 3 months ago

johnwalk61 commented 4 months ago

For example, in QuickAdd's capture format i tried

```js quickadd
const t="{{DATE:YYYY-MM-DD}}";

const values1 = {
startdate: t,
duedate: "{{DATE:YYYY-MM-DD}}",
created: "{{DATE:YYYY-MM-DD}}",
taskname: "Test task"
};
const modalForm = app.plugins.plugins.modalforms.api;
const result = await modalForm.openForm('New task form', { values: values1 });
return  "#task " +  result.getV('taskname')+" ➕ " +  result.getV('created') +" 📅 " +  result.getV('duedate')+" 🛫 " +  result.getV('startdate');


Also tried many variations but it will not populate the date fields with a valid date (want to default to today's date)

Cheers
danielo515 commented 4 months ago

That is QuickAdd template syntax, it has nothing to do with values. Also, the format of a date input is dependent on your locale (language, country, etc). If you want the default todays date, that is very simple, you can do this:


const values1 = {
startdate: new Date(),
duedate: new Date(),
created: new Date(),
taskname: "Test task"
};
const modalForm = app.plugins.plugins.modalforms.api;
const result = await modalForm.openForm('New task form', { values: values1 });
return  "#task " +  result.getV('taskname')+" ➕ " +  result.getV('created') +" 📅 " +  result.getV('duedate')+" 🛫 " +  result.getV('startdate');

Also, thanks of one of the latest features you can simplify the last like like this:

return  "#task " +  result.taskname + " ➕ " +  result.created +" 📅 " +  result.duedate +" 🛫 " +  result.startdate;
johnwalk61 commented 3 months ago

Thanks Daniel for the great response. I tried this and the form comes up but the date fields are not populated with the default date. When the form is triggered, I get a warning: Invalid keys in form options... listing all the date fields

Any ideas?

Cheers

johnwalk61 commented 3 months ago

I figured it out:

```js quickadd

const defDate = moment().format('YYYY-MM-DD')
const values1 = {
    taskname: "Test task",
    created:  defDate,
    startdate:  defDate,
    duedate:  defDate
};
const modalForm = app.plugins.plugins.modalforms.api;
const result = await modalForm.openForm('New task form', { values: values1 });

return  "#task " +  result.taskname + " ➕ " +  result.created +" 📅 " +  result.duedate +" 🛫 " +  result.startdate;

Works great. Thanks for the help Daniel.

John

danielo515 commented 3 months ago

That is a bit unexpected, I will look into it, but I'm happy to see that you figured it out. One last "touch" that you can di is, instead of doing all those + on strings, you can use a single template string (this is plain javascript):

return `#task ${result.taskname} ➕ ${result.created} 📅 ${result.duedate} 🛫 ${result.startdate}`;

The outcome is the same, but it is a bit easier to read and reason about the format