Back to Top

here's what's happening

DNN Details 004: Using the New Dnn-Elements in a 2sxc View?

3/3/2022 BlogDNN Details
DNN Details 004: Using the New Dnn-Elements in a 2sxc View?

I am really enthusiastic about theDnn-Elements projectthat will soon find its way into Dnn as an available, built-in set of very useful components.Imagine the simplicity of putting a highly functional color picker on your page with just some HTML like this:

If you just toss them on the page as-is, with no additional styling,the available Dnn-Elements currently look like this.Look again at that HTML above for the color-picker, then look at the fully function UI element it turns into in the browser.That is pretty incredible, no?

Important note:this article is not going to go very deep on using Dnn-Elements.It's mostly just a good example. The headline should have been (and the real reason for the article is) :

From a 2sxc Razor View, how can I get my JavaScript assets on the page in Dnn using modern attributes like type="module" and async in my

Tip: it is important to note that this style of getting your assets in place is not limited to 2sxc Views.Though there is no specific example like it on the DNN Docs page, this code works almost anywhere server-side: .cs or .cshtml files you put in /App_Code, RazorHost, .aspx/.ascx code-behind, etc.So if you need detailed control not offered by one of the other methods, this is a good option.

After that block of code, the rest is just plain HTML with 3 sample Dnn-Elements being used, two dnn-buttons, and the dnn-color-picker.

In closing, you should probably know that using Dnn-Elements this way is not a likely scenario for many projects.It is a front-end technology most useful via JavaScript in the browser.These types of HTML elements are more likely to be used in a Node development environment like any other node module (in React, Angular, VueJS, etc).For example, in Dnn v10 you will start to see PersonaBar modules, and the Resource Manager (the newer one that will probably get a better name) use Dnn Elements.

And finally, keep in mind that Dnn-Elements is stable and has many useful elements already, but it is still an in-development project that is best characterized as, "alpha heading towards beta very quickly" (Mar, 2022).

PS, Dnn Platform, 2sxc, and Dnn-Elements are all open source projects by developers who contribute their time without getting paid.These developers need to be supported for their efforts.If you benefit from open source and love these projects, I recommend you find out who the active developers are on the projects you use and love, and consider Sponsoring them.GitHub has made this simple and you canread more here.The 4 gentlemen that I thanked below are all open source developers that work directly on the products mentioned in this article.I linked directly to their GitHub Sponsor pages if available.


Thanks:Daniel Valadas,David Poindexter,Brian Dukes, andDaniel Mettler

Read more DNN Details posts...More about Accuraty...

‹ Back to List

I look forward to working again soon with the Accuraty team andhighly recommendthem to whomever is looking for web design and web development.

Baidu
map