How To: Closure Template for generating HTML in which attribute value of an element contains curly braces

[Ismu]

How do I get following HTML created using closure template?

<input name="fullName" class="large" type="text" data-validate="{required:true, minlength: 5, maxlength:100, messages:{required:'Please provide your Full Name.', maxlength:'This field can contain maximum 100 characters.'}}"/>

Any help is appreciated.

Below is what I have tried till now.

{namespace myApp.test}
/**
 * Template for UI of Create User View 
 * @param userToEdit It is the object returned from GET on User Resource.
 */
{template .testUser autoescape="false"}
  {{msg desc="<input id=\"fullName\" name=\"fullName\" class=\"large\" type=\"text\" value=\"{$userToEdit.FullName}\" data-validate=\"{required:true, minlength: 5, maxlength:100, messages:{required:\'Please provide your Full Name.\', maxlength:\'This field can contain maximum 100 characters.\'} }\" />"}}
{/template}

Returns Malformed attributes in tag error.

---

{namespace myApp.test}
/**
 * Template for UI of Create User View 
 * @param userToEdit It is the object returned from GET on User Resource.
 */
{{template .testUser autoescape="false"}}
<input id="fullName" name="fullName" class="large" type="text" value="{{$userToEdit.FullName}}" data-validate="{required:true, minlength: 5, maxlength:100, messages:{required:'Please provide your Full Name.', maxlength:'This field can contain maximum 100 characters.'} }" />
{{/template}}

Return Tag 'template' not at start of line [line 6, column 1]. error.

---

{namespace myApp.test}
/**
 * Template for UI of Create User View 
 * @param userToEdit It is the object returned from GET on User Resource.
 */
{template .testUser autoescape="false"}
<input id="fullName" name="fullName" class="large" type="text" value="{$userToEdit.FullName}" data-validate="{required:true, minlength: 5, maxlength:100, messages:{required:'Please provide your Full Name.', maxlength:'This field can contain maximum 100 characters.'} }" />
{/template}

Returns template .testUser: Left brace '{' not allowed within a Soy tag delimited by single braces (consider using double braces to delimit the Soy tag) [line 7, column 164]. error.

---

{namespace myApp.test}
/**
 * Template for UI of Create User View 
 * @param userToEdit It is the object returned from GET on User Resource.
 */
{template .testUser autoescape="false"}
<input id="fullName" name="fullName" class="large" type="text" value="{$userToEdit.FullName}" data-validate="{{required:true, minlength: 5, maxlength:100, messages:{{required:'Please provide your Full Name.', maxlength:'This field can contain maximum 100 characters.'}} }}" />
{/template}

Returns template .testUser: Double left brace '{{' not allowed within a Soy tag delimited by double braces (consider inserting a space: '{ {') [line 7, column 165]. error.

---

{namespace myApp.test}
/**
 * Template for UI of Create User View 
 * @param userToEdit It is the object returned from GET on User Resource.
 */
{template .testUser autoescape="false"}
<input id="fullName" name="fullName" class="large" type="text" value="{$userToEdit.FullName}" data-validate="{{required:true, minlength: 5, maxlength:100, messages:{ {required:'Please provide your Full Name.', maxlength:'This field can contain maximum 100 characters.'} } }}" />
{/template}

Returns template myApp.test.testUser: Not all code is in Soy V2 syntax (found tag {{print required:true, minlength: 5, maxlength:100, messages:{ {required:'Please provide your Full Name.', maxlength:'This field can contain maximum 100 characters.'} } }} not in Soy V2 syntax). error.

[Jim Blomo]

Try wrapping the line with the `literal` command:

http://code.google.com/closure/templates/docs/commands.html#literal

Jim

[Ismu]

Using Literal Command worked like a charm. Thanks very much Jim!

{namespace myApp.test}
/**
 * Template for UI of Create User View 
 * @param userToEdit It is the object returned from GET on User Resource.
 */
{template .testUser autoescape="false"}
<input name="fullName" value="{$userToEdit.FullName}" class="large" type="text" {literal}data-validate="{required:true, minlength: 5, maxlength:100, messages:{required:'Please provide your Full Name.', maxlength:'This field can contain maximum 100 characters.'}}"{/literal}/>
{/template}

[Raul Rangel]

Just use {lb} {rb}

On Sep 15, 1:52 am, Ismu <ismailsidhp...@gmail.com> wrote:
> Using Literal Command<http://code.google.com/closure/templates/docs/commands.html#literal> worked
> like a charm. Thanks very much Jim<http://stackoverflow.com/questions/7427023/how-to-closure-template-fo...>
> !

[Ismu]

It was so easy @Raul. That's why documentation should be read carefully. I missed that.

[Raul Rangel]

No worries, I missed it too the first time.