I'm working on a Grails 2.4.4 project. I have the following code on my gsp page (not a template) that calls a sub template that calls another template: main gsp page > gsp template > yet another gsp template:
main.gsp
...
<g:render template="/details" model="[param_one:'param_one', param_two:'param_two']" />
...
_details.gsp
...
<p>On details: ${param_one}</p>
<g:render template="/segments/segment-one" model="[param_two:'${param_two}']" />
...
_segment-one.gsp
<p>Segment One: ${param_two}</p>
Now when it renders the whole page, it only shows something like this:
On details: param_one
Segment One: ${param_two}
Why does _segment-one.gsp fails to render the passed param_two? Is it not allowed to have template from another template rendering? Thanks guys.
First, you are allowed to have gsp pages call templates that call templates indefinitely. When you call a template, you are literally including the code of the template into the including page at runtime; in other words, a template is part of the caller and it would have access by default to all objects visible to the caller. All you have to do is to change your second inclusion to:
<g:render template="/segments/segment-one" />
Now, template segment-one will already have access to param_one and param_two. You only need to use your model tag again if you are passing something new created in the local template (or gsp) you are in.
I fixed the code in _segment-one.gsp by adding the params keyword:
<p>Segment One: ${params.param_two}</p>
^^^^^^
Related
I use expressjs and hbs(Handlebars) as the template engine.
One of the parameters that are passed to the template when loading the page contains HTML code.
When the page loads, instead of processing the parameter and displaying the elements, it is displayed as text.
How can I solve this?
//Server-side:
let parameter = "<h2 id="how-to-use">How To Use</h2>";
//HTML:
<div id="container">{{parameter}}</div>
//--------------------------------------
//result after page load
<h2 id="how-to-use">How To Use</h2>
//Instead of
How To Use
got it.
use the triple {{{ }}} brackets
I want to implement AngularJS's ng-include statement into my website to reduce code redundancy, but having trouble getting it to fully work. Currently, my index.html page is calling pageLayout.html My index.html is calling pageLayout.html successfully, but when adding a <h1> tag in index.html I cant put it on top of the pageLayout.html content that I call. Does anyone have any ideas?
Here is the link: http://plnkr.co/edit/uarelZgzmITJXg2pYXfg?p=preview
I have also tried using a directive like the following: http://plnkr.co/edit/VmAO47l7RMXTGYYFFgLB?p=preview but still having issues.
Thanks!
The transclusion strategy is set to element not to true so you can not insert extra content.
Moreover the content is wiped everytime the template value changes
And using transclusion with ngInclude does not make sense
I would rather use a directive with transclusion (or bind the title) if you want to avoid code duplication, something like
directive('pageContainer',function(){
return {
template:'<div class="divSize" ><h1>{{title}}</h1><div ng-transclude></div></div>',
scope:{
title:"#"
}
}
})
when I use Backbone toJSON method of the model like this:
this.$el.html(this.model.toJSON());
It doesn't render model into view root element ( more than one attribute ).
But when I get one property from the model, like this;
this.$el.html(this.model.get("city"));
It is rendered properly.
Also, when I use template in first case (toJSON) - it is rendered fine.
this.$el.html(this.template(this.model.toJSON());
Why is that ?
Thanks
this.$el.html(this.model.toJSON());
You're using the html method of jQuery, which expects a string (or a DOM element, or a jQuery element), to display a JSON object.
this.$el.html(this.template(this.model.toJSON());
Here you're using a template method which, I assume, is taking a JSON object to evaluate a template that will return you a string. The htmlmethod receives this string and displays it.
this.$el.html(JSON.stringify(this.model.toJSON()));
This would display the result of this.model.toJSON() (but won't do the same as using your template method).
So, basically this.template will be (in most of the cases) a compiled version of the html template which you have for the view.
It will have placeholders in it, and will take parameters with the same key as placeholders in the template. For example (Handlebars templates),
<section id="{{id}}">
<header>{{header_text}}</header>
</section>
Considering the above code as a template, when you compile and store it in this.template, it returns a function, which takes a json object as a parameter, so now this.template is a function.
You can call it like below,
var html_text = this.template({
id : "main_content",
header_text : "Hi Welcome !!"
});
this.$el.html(html_text);
After the execution, el's contents will be
<section id="main_content">
<header>Hi Welcome !!</header>
</section>
So when you do this.$el.html(this.template(this.model.toJSON());, it actually generates the required json parameter for the this.template method for you, hence works fine.
And as Loamhoof said, in this.$el.html(this.model.get("city")); you use the html method which will set the html content of the el based on the property value of the model.
I have a razor script in Umbraco that is quite complex and I want at some point of it to render a macro in it.
The macro which is called SuggestionBox is actually a user control (.ascx) and traditionally this is referenced on the template using
<umbraco:macro Alias="SuggestionBox" language="cshtml" runat="server"></umbraco:macro>
But now I need to call it from the razor script instead so I tried;
#Html.Raw(umbraco.library.RenderMacroContent("SuggestionBox", Model.Id))
as well as:
#RenderPage("SuggestionBox")
No luck so far as I'm sure I'm using these wrongly.
I read somewhere it might be infeasible if the page is wrapped in a masterpage.
It works if I add it to the Template like I traditionally would:
<umbraco:macro Alias="EventsRenderer" language="cshtml" runat="server"></umbraco:macro>
<div class="talkingPointPanel">
<h3><umbraco:Item field="talkingPoinstSuggestionText" runat="server"></umbraco:Item></h3>
<umbraco:macro Alias="SuggestionBox" language="cshtml" runat="server"></umbraco:macro>
</div>
Where EventsRenderer renders the page that should ideally contain the SuggestionBox.
using
#Html.Raw(umbraco.library.RenderMacroContent("<?UMBRACO_MACRO macroAlias=\"SuggestionBox\" />", Model.Id))
Gives me this error:
<!-- Error generating macroContent: 'System.Web.HttpException (0x80004005): HtmlForm cannot render without a reference to the Page instance. Make sure your form has been added to the control tree.
at System.Web.UI.HtmlControls.HtmlForm.Render(HtmlTextWriter output)
at System.Web.UI.Control.RenderControlInternal(HtmlTextWriter writer, ControlAdapter adapter)
at System.Web.UI.Control.RenderChildrenInternal(HtmlTextWriter writer, ICollection children)
at System.Web.UI.Control.RenderChildrenInternal(HtmlTextWriter writer, ICollection children)
at umbraco.presentation.templateControls.Macro.Render(HtmlTextWriter writer)
at System.Web.UI.Control.RenderChildrenInternal(HtmlTextWriter writer, ICollection children)
at umbraco.library.RenderMacroContent(String Text, Int32 PageId)' -->
Any ideas?
<umbraco:Macro runat="server" language="cshtml">#{
HtmlTextWriter writer = new HtmlTextWriter(this.Output);
var navigation = new umbraco.presentation.templateControls.Macro();
navigation.Alias = "Navigation";
navigation.MacroAttributes.Add("ulclass", "art-vmenu");
navigation.MacroAttributes.Add("level", 2);
navigation.RenderControl(writer); }</umbraco:Macro>
Try something like this. It works for me ... I have made a Navigation macro. Be Aware though your variables should be given in toLower, if caps are used, the parameters will not come through.
In Umbraco 4.10+ To call a macro inside Razor script, use:
#Umbraco.RenderMacro("macroNameHere", new { propertyName1 = CurrentPage.pageProperty }))
Try something like this:
#Html.Raw(umbraco.library.RenderMacroContent("<?UMBRACO_MACRO macroAlias=\"SuggestionBox\" />", Model.Id))
I'm using a taxonomy part in one of my custom content types, and using the shape tracer, I was able to create a custom view template for that control (Fields.Contrib.TaxonomyField.cshtml).
When I shape trace the element on the page, under template it indeed shows my custom template exactly as I have it on the external file:
#using Orchard.Utility.Extensions;
#using Orchard.ContentManagement;
#{
var terms = (IEnumerable<Contrib.Taxonomies.Models.TermPart>)Model.Terms;
string name = #Model.ContentField.Name;
}
#if (Model.Terms.Count > 0) {
#(new HtmlString( string.Join(", ", terms.Select(t => Html.ItemDisplayLink(Html.Encode(t.Name), t.ContentItem ).ToString()).ToArray()) ))
}
<div>TEST TEXT</div>
However, when I tab over to the actual outputted HTML, it is showing the standard, built in template, and isn't using my customizations.
<p class="taxonomy-field">
Coffee Shop
</p>
According to the shape tracer, it is using my custom template:
Shape Fields_Contrib_TaxonomyField
Active Template
~/Themes/Continuum/Views/Fields.Contrib.TaxonomyField.cshtml
Display Type Detail
this feels like a bug... everything looks like it's wired up correctly... is there something else I need to do to use my custom view template for taxonomy?
Many thanks!
I figured out the problem. Turns out there was another template created (likely by accident) which was url-specific:
Fields.Contrib.TaxonomyField-url-venues.cshtml
that's the url I was on, and this had the default template still in it. After deleting it, it finally used my custom template.
User error, sorry!!