Hi,
I want to list my Icons TV in a custom Listbox, similar to Listbox (Single-Select), with a slight difference that the list-items get a css style "display:inline-block;".
So I made a copy of files listbox.class.php and listbox-single.tpl, and started to do the changes.
In listbox-icons.class.php I gave the class a different name and point it to my own template file. No other differences, and it does the job:
class modTemplateVarInputRenderIconsListbox extends modTemplateVarInputRender {
public function getTemplate() {
return $this->modx->getOption('core_path').'components/icontv/tv/input/tpl/listbox-icons.tpl';
}
public function process($value,array $params = array()) {
$options = $this->getInputOptions();
$items = array();
foreach ($options as $option) {
$opt = explode("==",$option);
if (!isset($opt[1])) $opt[1] = $opt[0];
$items[] = array(
'text' => htmlspecialchars($opt[0],ENT_COMPAT,'UTF-8'),
'value' => htmlspecialchars($opt[1],ENT_COMPAT,'UTF-8'),
'selected' => strcmp($opt[1],$value) == 0,
);
}
$this->setPlaceholder('opts',$items);
}
}
return 'modTemplateVarInputRenderIconsListbox';
In listbox-icons.tpl I only add a line with my own template code:
<select id="tv{$tv->id}" name="tv{$tv->id}">
{foreach from=$opts item=item}
<option value="{$item.value}" {if $item.selected} selected="selected"{/if}>{$item.text}</option>
{/foreach}
</select>
<script type="text/javascript">
// <![CDATA[
{literal}
Ext.onReady(function() {
var fld = MODx.load({
{/literal}
xtype: 'combo'
,transform: 'tv{$tv->id}'
,id: 'tv{$tv->id}'
,triggerAction: 'all'
,width: 400
,allowBlank: {if $params.allowBlank == 1 || $params.allowBlank == 'true'}true{else}false{/if}
,tpl: new Ext.XTemplate(
'<tpl for="."><div class="x-combo-list-item" style="display:inline-block;">'
,'{text}'
,'</div></tpl>')
{if $params.title},title: '{$params.title}'{/if}
{if $params.listWidth},listWidth: {$params.listWidth}{/if}
,maxHeight: {if $params.maxHeight}{$params.maxHeight}{else}300{/if}
{if $params.typeAhead}
,typeAhead: true
,typeAheadDelay: {if $params.typeAheadDelay && $params.typeAheadDelay != ''}{$params.typeAheadDelay}{else}250{/if}
{else}
,editable: false
,typeAhead: false
{/if}
{if $params.listEmptyText}
,listEmptyText: '{$params.listEmptyText}'
{/if}
,forceSelection: {if $params.forceSelection && $params.forceSelection != 'false'}true{else}false{/if}
,msgTarget: 'under'
{literal}
,listeners: { 'select': { fn:MODx.fireResourceFormChange, scope:this}}
});
Ext.getCmp('modx-panel-resource').getForm().add(fld);
});
{/literal}
// ]]>
</script>
Now the Error Message is this:
Fatal error: Uncaught exception 'SmartyCompilerException' with message 'Syntax Error in template "****/public_html/core/components/icontv/tv/input/tpl/listbox-icons.tpl" on line 21 " ,'{text}'" unknown tag "text"'
My debugging experience is that, without {text} tag, the <select><option> html tags are populated and the dropdown list is swoing with the right amount of empty lines.
I think I just miss something to tell Smarty the {text} tag.
Any suggestions please?
