merkle-open / NitroNetSitecore

NitroNet for Sitecore extends NitroNet with the support for the WCMS Sitecore. It handles all possible presentation scenarios to integrate a handlebars frontend into Sitecore without functional loss.
MIT License
24 stars 9 forks source link

Rendered components are not editable from exp ditor #22

Closed ssatpa closed 7 years ago

ssatpa commented 7 years ago

I'm able to render my component in sitecore, but I'm unable to edit the component in field level.

I am trying to use Edit Frame as mentioned in the provided document, but somehow it is not much clear to me.

image

Currently Whole component can be selected. but I want to edit individual fields in exp editor.

daniiiol commented 7 years ago

Hi @ssatpa

Thank you for the question.

A main idea of NitroNet is to have very clean view-presentations without to much logic. As a sample: we had a lot discussions internally to support edit frames or not. But finally, we came to the conclusion to support this special feature of Sitecore in NitroNet.Sitecore.

To edit Fields directly in the EE with NitroNet, I would beg you to create this logic in your Rendering Controller with the Sitecore FieldRenderer (Sitecore.Web.UI.WebControls.FieldRenderer.Render(...)).

Below an example of my dummy-component "Richtext":

public class RichtextController : Controller
    {
        // GET: Richtext
        public ActionResult Index()
        {
            var contentField = FieldRenderer.Render(Sitecore.Context.Item, "Content");
            var model = new Richtext {Content = contentField};
            return View("frontend/patterns/molecules/richtext/richtext", model);
        }
    }

and in your HBS File if you don't want Handlebars to escape a value, use the "triple-stash", {{{:

<div class="m-richtext data-t-name="Richtext">
    {{{content}}}
</div>

I hope having assisted you with this information.

ssatpa commented 7 years ago

Hi @daniiiol , Thanks for your help. Just one question, does it work for miltilist/treelist or datetime or droplink or anchor field type, as in my case it is not working

datefield, droplink, anchor is not editable

image

ssatpa commented 7 years ago

More over, does NitronetSitecore supports glassmapper or any other ORM ??

daniiiol commented 7 years ago

Hi @ssatpa

GlassMapper Yes, NitronetSitecore supports glassmapper and any other ORM as well. You are completely free in your controller. The ViewModel needs only the same properties as defined in your frontend code.

FieldTypes Yes. Sitecore itself doesn't support these FieldTypes in the Experience Editor. See Stackexchange Link for more informations. If you would like to give your authors a good toolset in the EE, add some Edit Frames (EF) or Customer Experience Buttons (CEB) around your components (CEB) or component parts (EF).

ssatpa commented 7 years ago

Hi @daniiiol ,

Correct me if I'm wrong, If I use Glassmapper then my fields will not be editable in exp editor.

public ActionResult GetEmployeeDetails() { var context = new SitecoreContext(); var employee = context.GetCurrentItem<IEmployee>(); employee.Profile = employee.Profile; employee.Title = FieldRenderer.Render(Sitecore.Context.Item, "Title"); return View("employee", employee); }

Here both the fields Profile and Title are RichText editor fields, but only title is editable and profile is not as for "Title" I'm using "FieldRenderer", but for "Profile" I'm getting the value from glassmapper.

daniiiol commented 7 years ago

In your sample, you have 2 properties.

That's the point why you could edit the title only.

I recommend you to add some new properties with a "Render" suffix like "ProfileRender" to your GlassClass and add additionally this line of code: employee.ProfileRender = FieldRenderer.Render(Sitecore.Context.Item, "Profile"); and you could edit the Profile-Field as well.

Hint: Please read also the GlassMapper documentation. In GlassMapper you could use GlassHtml instead of FieldRenderer:

var glassHtml = new GlassHtml(new SitecoreContext());
employee.ProfileRender = glassHtml.Editable(employee, x => x.Profile)

You can find here a good explanation about the usage of GlassMapper in controller renderings without heavy presentation stuff in your views.