Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Rendering DTL inside attribute results in the expression being left in the HTML #288

Closed
lhcopetti opened this issue Aug 7, 2018 · 0 comments
Closed

Rendering DTL inside attribute results in the expression being left in the HTML #288

lhcopetti opened this issue Aug 7, 2018 · 0 comments

Comments

@lhcopetti
Copy link
Contributor

Problem:

When the only text inside an attribute is a DTL expression (eg: value='{%if fruit %}{{fruit}}{% endif %}') and after rendering that expression results in an empty string, dojo keeps the DTL expression unmodified inside the attribute. This is troublesome especially for input tags where the value attribute is visible to the user.
Inserting any text inside the attribute so as the resulting attribute is no longer empty after the rendering resolution prevents the problem from happening (eg: value=' {%if fruit %}{{fruit}}{% endif %}', notice the space right after the opening quote).

Example:

index.html

<!DOCTYPE html>
<html>
 <head>
  <script>var dojoConfig={async:true,locale: \"en-US\"};</script>
  <script src=\"dojo-release-1.13.0-src/dojo/dojo.js\"></script>
    <script>
require([
	'dojo/modules/DtlWidget',
	'dojo/domReady!'
	], function(DtlWidget) {
		const demo = new DtlWidget();
		demo.placeAt('widgetTest');
	});
	</script>
</head>
<body>
<div id="widgetTest">
</body>
</html>

DTLWidget.js

define([
    "dojo/_base/declare",
    "dojox/dtl/_DomTemplated",
    "dojox/dtl/tag/logic",
    "dijit/_WidgetBase",
    "dijit/_WidgetsInTemplateMixin",
    "dijit/layout/ContentPane",
    "dojo/parser",
    "dojox/dtl/Context"
], function(declare, DomTemplated, logic, _WidgetBase, _WidgetsInTemplateMixin, ContentPane, parser, context) {
    
    return declare("DtlWidget", [_WidgetBase, DomTemplated, _WidgetsInTemplateMixin], {
        
        templateString: "<div><input value='{%if fruit %}{{fruit}}{% endif %}' type='text'></input></div>",
        
        postCreate : function() {
            // Uncomment these lines to have the template render correctly
            //this.fruit = "Apple";
            //this.render();
        }
    });
});

Result:

<body data-gr-c-s-loaded="true">
		<div id="widgetTest">
    
<input value="{%if fruit %}{{fruit}}{% endif %}" type="text" id="DtlWidget_0" widgetid="DtlWidget_0"></div></body>

For the more visually inclined:

image

Expected:

Expected the input tag to be empty after the rendering process because the variable that the template references does not exist in its context.
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees
No one assigned
Labels
None yet
Projects
None yet
Milestone
No milestone
Development

No branches or pull requests
1 participant
@lhcopetti