[migxdb] Call to on config attribute of form field snippet

Support Extras
2

Hi All,

Answering my own question:
What i am trying to do is not related with migx itself but with the options of the Input TV type date that is part of modx core.
But it is possible to do with a very small change that I will explain below:

On the modx folder /manager/templates/default/element/tv/renders/input/ you will find a file called date.tpl that contains all the backend template code that will render the input type date TV.

By opening the file, this is what we have:

<input id="tv{$tv->id}" type="hidden" class="datefield"
    value="{$tv->value}" name="tv{$tv->id}"
    onblur="MODx.fireResourceFormChange();"/>

<script type="text/javascript">
// <![CDATA[
{literal}
Ext.onReady(function() {
    var fld = MODx.load({
    {/literal}
        xtype: 'xdatetime'
        ,applyTo: 'tv{$tv->id}'
        ,name: 'tv{$tv->id}'
        ,dateFormat: MODx.config.manager_date_format
        ,timeFormat: MODx.config.manager_time_format
        {if $params.disabledDays|default},disabledDays: {$params.disabledDays|default}{/if}
        {if $params.minDateValue|default},minDateValue: '{$params.minDateValue|default}'{/if}
        {if $params.maxDateValue|default},maxDateValue: '{$params.maxDateValue|default}'{/if}
        {if $params.startDay|default},startDay: {$params.startDay|default}{/if}

        {if $params.minTimeValue|default},minTimeValue: '{$params.minTimeValue|default}'{/if}
        {if $params.maxTimeValue|default},maxTimeValue: '{$params.maxTimeValue|default}'{/if}
        {if $params.timeIncrement|default},timeIncrement: {$params.timeIncrement|default}{/if}
        {if $params.hideTime|default},hideTime: {$params.hideTime|default}{/if}

        ,dateWidth: 198
        ,timeWidth: 198
        ,allowBlank: {if $params.allowBlank == 1 || $params.allowBlank == 'true'}true{else}false{/if}
        ,value: '{$tv->value}'
        ,msgTarget: 'under'
    {literal}
        ,listeners: { 'change': { fn:MODx.fireResourceFormChange, scope:this}}
    });
    Ext.getCmp('modx-panel-resource').getForm().add(fld);
});
{/literal}
// ]]>
</script>

It is possible to see that all the attributes for the inputTVtype configuration are here and this is the TPL that is called by the rendering.
Everything is converted to javascript for the backend form generator like this:

<script type="text/javascript">
// <![CDATA[

Ext.onReady(function() {
    var fld = MODx.load({
    
        xtype: 'xdatetime'
        ,applyTo: 'tvinp_195_1_5'
        ,name: 'tvinp_195_1_5'
        ,dateFormat: MODx.config.manager_date_format
        ,timeFormat: MODx.config.manager_time_format
        ,maxDateValue: '2019-04-27'        
        ,hideTime: 1
        ,dateWidth: 198
        ,timeWidth: 198
        ,allowBlank: true
        ,value: ''
        ,msgTarget: 'under'
        ,listeners: { 'change': { fn:MODx.fireResourceFormChange, scope:this}}
    });
    Ext.getCmp('modx-panel-resource').getForm().add(fld);
});

// ]]>
</script>

If you change the date.tpl to this, you will be able to use smarty on the config settings of your migxdb config json file:

<input id="tv{$tv->id}" type="hidden" class="datefield"
    value="{$tv->value}" name="tv{$tv->id}"
    onblur="MODx.fireResourceFormChange();"/>

<script type="text/javascript">
// <![CDATA[
{literal}
Ext.onReady(function() {
    var fld = MODx.load({
    {/literal}
        xtype: 'xdatetime'
        ,applyTo: 'tv{$tv->id}'
        ,name: 'tv{$tv->id}'
        ,dateFormat: MODx.config.manager_date_format
        ,timeFormat: MODx.config.manager_time_format
        {if $params.disabledDays|default},disabledDays: {$params.disabledDays|default}{/if}
        {if $params.minDateValue|default},minDateValue: '{eval var=$params.minDateValue|default}'{/if}
        {if $params.maxDateValue|default},maxDateValue: '{eval var=$params.maxDateValue|default}'{/if}
        {if $params.startDay|default},startDay: {$params.startDay|default}{/if}

        {if $params.minTimeValue|default},minTimeValue: '{eval var=$params.minTimeValue|default}'{/if}
        {if $params.maxTimeValue|default},maxTimeValue: '{eval var=$params.maxTimeValue|default}'{/if}
        {if $params.timeIncrement|default},timeIncrement: {$params.timeIncrement|default}{/if}
        {if $params.hideTime|default},hideTime: {$params.hideTime|default}{/if}

        ,dateWidth: 198
        ,timeWidth: 198
        ,allowBlank: {if $params.allowBlank == 1 || $params.allowBlank == 'true'}true{else}false{/if}
        ,value: '{$tv->value}'
        ,msgTarget: 'under'
    {literal}
        ,listeners: { 'change': { fn:MODx.fireResourceFormChange, scope:this}}
    });
    Ext.getCmp('modx-panel-resource').getForm().add(fld);
});
{/literal}
// ]]>
</script>

Mind the fields minDateValue, maxDateValue, minTimeValue and maxTimeValue that now have a preffix:
eval var=

This is the way to allow smarty to read a variable content and parse it again if it is valid smarty code (smarty recursive parsing).

With this you will be able to use smarty in migxdb config attributes for inputTVtype date:

{
  "MIGX_id":5,
  "field":"id_issue_date",
  "caption":"ID Issued On",
  "description":"ID Issue date (format: 2000-01-01). You can only pick dates on the past ",
  "description_is_code":"0",
  "inputTV":"",
  "inputTVtype":"date",
  "validation":"",
  "configs":{
	"allowBlank":true,
	"disabledDates":"0000-00-00",
	"disabledDays":"",
	"minDateValue":"",
	"minTimeValue":"",
	"maxDateValue":"{$smarty.now|date_format:'%Y-%m-%d'}",
	"maxTimeValue":"",
	"startDay":"",
	"timeIncrement":"",
	"hideTime":true
  },
  "restrictive_condition":"",
  "display":"",
  "sourceFrom":"config",
  "sources":"",
  "inputOptionValues":"",
  "default":"",
  "useDefaultIfEmpty":"0",
  "pos":5
}

This is the result:

Untitled
Untitled197×233 3.87 KB

Now it will change the max date according to the present date.

Hope it helps other people seeking for the same solution.

Cheers all.
J.Nogueira