0
votes

We have a Sitecore project and the code/files are from an ASP.NET web application.

The HTML for the products section is as follows

<div class="products-section">
  <ul class="tabs">
    <li>Product 1</li>
    <li>Product 2</li>
  </ul>
  <div class="product">
     <h3>Product Name</h3>
     <img src="/images/img1.jpg" />
     <span>Description</span>
  </div>
</div>

This is how it works for an end user. EU will click on a Product tab (eg: Product 1), which will change the content inside <div class="product">, without postback.

For the author, this section must be editable from the Experience editor. Usually, I would use asp:Repeater with sc:Text,sc:Image to render it.

But, here the data has to be retrieved using ajax calls, which means no Repeater or Sitecore controls.

In such case, how can I make the content editable from Experience editor.

The only ideas I came up with:

  1. Get data of all the products in Page_Load, bind it using Repeater and then use jQuery to Show/Hide the respective divs. (doesn't seem a nice way though)

  2. Tell the content author, that this section can only be edited from Content editor and not from the experience editor :)

What are my options here.

2
Why close this? Isn't this a common scenario for sitecore devs. If there is something else that needs to be mentioned, please let me know.Qwerty

2 Answers

2
votes

One option could be to render your page differently when in the experience editor. Check the mode in your code and use a repeater when editing, otherwise use the jquery output. You can use Views to easily display/hide the output you want.

<asp:MultiView runat="server" ID="ProductsView">
  <asp:View runat="server" ID="StandardView">
    <div ...>
     ...
    </div>
  </asp:View>
  <asp:View runat="server" ID="EditorView">
    <asp:Repeater..>
       ...
    </asp:Repeater>
  </asp:View>
</asp:MultiView>

In your code behind:

ProductsView.SetActiveView((Sitecore.Context.PageMode.IsExperienceEditor || Sitecore.Context.PageMode.IsExperienceEditorEditing) ? EditorView : StandardView)

Based on the active view, you can decide to attach data to the repeater or not (don't do that when the StandardView is active, for performance)

0
votes

I'm not sure why would an end user interact with Experience Editor as Experience editor is used by Content Authors for authoring the site and updating the content on the Page itself.

But if this is a requirement for a Content Author you can use the sitecore services client api for updating the content using ajax call. Use this document to see how ssc works.

Let me know if you have a different ask.