Is it possible to write a custom html helper that has some content it it's body, similar to BeginForm?
I want to write a helper that displays a section only if the user has a particular role.
Something like:
#Html.DisplayForRoles("User, manager")
{
<div>You're admin or manager</div>
<div>Other stuff</div>
}
Yes, yes it is.
What you want is to create an HTML helper extension, there's several good guides out there which I won't reproduce here, such as
http://www.asp.net/mvc/tutorials/older-versions/views/creating-custom-html-helpers-cs
or
http://www.codeproject.com/Tips/720515/Custom-HTML-Helper-for-MVC-Application
Or were you after more specific help?
Related
Razor pages have a mechanism where you can reference named sections in your layout, and then specify them in your pages that use that layout. For example, if your Layout (_Layout.cshtml) looks like this:
#using...
...
<!DOCTYPE html>
...
<body>
...
#RenderSection("modals", required: false)
...
and then in your dashboard page, for example, you'd have:
<div>
...
</div>
...
...
#section modals
{
<div class="modal-container>...</div>
<div class="modal-container>...</div>
}
that would inject the contents of #section modals... into the place in the layout where #RenderSection("modals") is.
How can this be done in Blazor?
Unfortunately, no such feature is currently supported in Blazor. Blazor team and the community have been discussing the necessity of this feature over a year now, but for no avail. Read here about Sections in Blazor.
However, if you're looking for a 'temporary solution', you may read a comment by SteveAndeson about how to pass parameter values from a Blazor component page to its layout. I know that you're looking for a way to render the #Body plus #EndBody, but the principal remain the same: You have to create a layout component instead of the default layout
Hope this helps...
I have created a component to get something similar to sections:
https://github.com/inspgadget/BlazorSections
I create html components with Thymeleaf. Components are declared in separate file:
Declaration of basic button in buttons.html
<div th:fragment="btn-basic" class="btn btn-basic" th:text="${text}" th:classappend="${class}">
Button
</div>
The idea is to provide some type of tool-set for components. Code for using this component will be:
<div th:replace="~{buttons :: btn-basic (text='Button Text', class='button-class')}"></div>
It's working well, but I think about case when button need to have attributes like: onclick="..." or data-customAttr="..." or any other attribute. And here goes the problem:
How to pass attributes to button?
One way is to pass it as parameter of fragment, but it's too ugly.
Is there any way to get attributes of placeholder in fragment? (see example below)
This how I want to call fragment:
<div th:replace="~{buttons :: btn-basic (text='Button Text', class='button-class')}" onclick="..." data-customAttr="..."></div>
and in btn-basic fragment want to get these attributes and attach to it. Something like this:
<div th:fragment="btn-basic" class="btn btn-basic" th:text="${text}" th:classappend="${class}" onclick="..." data-customAttr="...">
Button
</div>
Any ideas?
I had a similar idea, but the question is, if the customizing of a component is as complex as the result, what is the benefit?
Btw. with the Thymeleaf Layout Dialect you can do something like this: https://ultraq.github.io/thymeleaf-layout-dialect/Examples.html#reusable-templates, I favor that, instead of the everything-as-parameter approach.
I want to override the Login module. I have created the override in the html folder, but I can't seem to find the upmost div with class="login" that is visible when viewing the original Login module with Firebug. I have searched all files in mod_login.
I want to place the following above the module:
<div class="item-page">
<div class="page-header">
<h2 itemprop="name">Login</h2>
</div>
</div>
Thanks in advance
EDIT: I'm using Joomla 3.4.6. Login_Module is in it's original state.
Based off the limited information provided...
You should only have to place the default.php file from /modules/mod_login/tmpl/ into /templates/[template_name]/html/mod_login/ to override the frontend module.
To modify the module for the administrator side, you would copy /administrator/modules/mod_loing/tmpl/default.php to /administrator/templates/[template_name]/html/mod_login/default.php
If the code you're trying to edit isn't in that file, then you may want to try looking at the com_users component which has the file: /components/com_users/views/login/tmpl/default_login.php and see if that's what you're looking for.
Is there a way to allow data bind with html rendering in polymer?
For example in AngularJS there is the "ng-html-bind" directive that does the job. I am searching something similar.
Here it follows an example of where I am willing to use it.
<core-tooltip>
<core-icon icon="info-outline" size="30"></core-icon>
<div tip>
{{box.description}}
</div>
</core-tooltip>
Otherwise any suggestion on how to do it differently?
I am loading this data from a json file and I am searching for a general way to allow "safe" html rendering (against XSS).
This has been answered a couple of times:
How to inject HTML into a template with polymer
How to display html inside template?
As suggested in the accepted answer, I associated an id to my tooltip div:
<div id="tipContent" tip>
{{box.description}}
</div>
Then made my element listen to the box changes:
Polymer("nautes-box",{
boxChanged: function(){
this.$.tipContent.innerHTML = this.box.description.chunk(40).join("<br /><br />");
}
});
I hope this answer will eventually be useful :)
Is there a way to allow data bind with html rendering in polymer?
For example in AngularJS there is the "ng-html-bind" directive that does the job. I am searching something similar.
Here it follows an example of where I am willing to use it.
<core-tooltip>
<core-icon icon="info-outline" size="30"></core-icon>
<div tip>
{{box.description}}
</div>
</core-tooltip>
Otherwise any suggestion on how to do it differently?
I am loading this data from a json file and I am searching for a general way to allow "safe" html rendering (against XSS).
This has been answered a couple of times:
How to inject HTML into a template with polymer
How to display html inside template?
As suggested in the accepted answer, I associated an id to my tooltip div:
<div id="tipContent" tip>
{{box.description}}
</div>
Then made my element listen to the box changes:
Polymer("nautes-box",{
boxChanged: function(){
this.$.tipContent.innerHTML = this.box.description.chunk(40).join("<br /><br />");
}
});
I hope this answer will eventually be useful :)