MVC Widget with Single Item View Option
Hello:
I am looking for a little help in regards to creating custom MVC widgets for Sitefinity. For our project, we are planning on using a pure MVC approach which means that all of the built in widgets that are included for the Web Forms page template are not available.
One of the features of the built-in list widgets that we would like to replicate for our custom modules is the ability to select a specific page template to use when displaying a single detail item. For example, with the News widget, there is a Single Item Settings tab where you can choose to use an Auto-generated page or Select and existing page template to use when viewing an individual News Article. We would like the ability to use this feature to give our end users a little more control over page layout and not having to create all of our detail views in static markup pages.
We have tested creating a very basic MVC widget that returns a list of Events (wanted to test with a build in module first) and added a property to the widget for setting the DetailsPageID using a PageField control in our control designer. However, this does not appear to have any effect on the details page that it used for the Events module. Also, when editing an Event, hitting the Preview button loads a page that just says "no pages has been set to display content like this".
So, our question is whether or not something like this can be accomplished with using pure MVC Templates or does this only work with Web Forms or hybrid mode? Or is there a different or better route to go when using Pure MVC that will allow us to use the Sitefinity template builder for our detail pages?
Any help or suggestions are much appreciated. Thanks!
Hi Evan,
This can be done in quite a few ways, I believe. So if I understand you correctly, you would like to be able to have different templates for different content items. Correct me if I am wrong, but in your case you would even like to open the individual items in different pages.
So, I will start by saying that your initial approach makes perfect sense, meaning that if you want to have different detail page per item, it makes sense to store that in the content item level with a custom field. The same goes if you'd like to render each details page with different MVC View, meaning different mark-up template for each detail item's view.
In both cases you can apply a custom logic in the controller to return different ActionResult based on the properties of the items. You can also get those values from the designer, but the main point is that you can use it to return different views or event to redirect to different pages. Here is a dummy example to help me visualize the suggested approach:
if
(designer.selectedvalue)
return
View(
"this"
);
if
(designer.selected)
return
View(
"that"
);
Hi Peter:
Thanks for the response. I had previously come across the documentation that you mentioned and have played around with that type of implementation on our end already. We have done a decent amount of MVC development already so using some logic to determine which view we want to return from an ActionResult is something we are pretty familiar with.
With the video that you posted, when a user clicks on the link to view the details of the event, the same overall page template is used for the event details as was used for the events list, regardless of what the actual content for the view is returned (list of events vs. individual events details).
What we are looking to accomplish is functionality similar to what looks to be available for the built in News widget. When you click edit on that widget, you are able to go to the Single Item Settings tab and select an existing page to use when viewing the details of a selected news item (see the News_SingleItemsSettings image). To my understanding, this allows for an entirely different page with a different overall layout to be used when the details page is loaded, correct?
If possible, we would like to accomplish something similar using a Pure MVC approach within Sitefinity since we have several details pages that utilize an entirely different layout than their parent list page.
Thanks,
Evan
Hi Peter:
After looking around a little more this afternoon in Sitefinity, we may have come up with a possible solution for what we are trying to accomplish but it's still not quite working yet. The method that we are playing with right now is that we create a new page as a details container underneath our parent list page as shown in the attached image (Pages_Details). We created a widget for the list page (Events) that handles generating the list of content items and then created a second widget that is placed on the details page (Event Details) that we would use to pull in the detail information for the content item that was selected. By tweaking the link that is generated on the list page, we are able to have the details page load successfully.
The issue that we are facing now is that the widget on the details page does not get rendered at all. I think that this is due to the known issue of MVC widgets not rendering on details pages as is discussed in this post: www.sitefinity.com/.../how-to-display-mvc-widget-in-detail-views-of-content-items. However we haven't been able to find anything in regards to a workaround when working with a custom MVC Widget and Widget designer since the advanced tab of the designer is blank and doesn't offer a UrlKeyPrefix property to change. Is that something that is possible to do or is there another workaround for getting the widget to render on the details page?
Thanks,
Evan
Hi Evan,
That was my suggestion as well. Based on the a selected DetailsPageID (in my case per item, in yours per widget via its designer), you need to return an ActionResult to an MVC widget located on that details page.
Yes, you will definitely get this working as that is the correct way of doing things. Of course, I want to help you get this done ASAP.
Thus, could you please send me your code, so I can see how you parse the URL and whatsoever? Also, we have many MVC issues fixed with the upcoming Sitefinity 6.1 and I will try to run your code against it as well.
Cheers,
Hi Peter:
Thanks for the reply, glad to know it sounds like we're heading in the right direction. We haven't quite got to the point of parsing the URL on our details page since the controller is not being reached at all.
I can put together a quick demo project with what we're doing right now for you to look at. How would you like me to send that to you, it doesn't appear as though I can attach a .zip file in the forums?
Thanks,
Evan
Hi Evan,
I have created a logic in a custom HTML helper to help you resolve the details page Id based on a PageNode Id.
Please see how I use the custom HTML helper to build the anchor tags that will point to a Sitefinity page and then to a specified controller and its action:
@
using
SitefinityWebApp;
@model SitefinityWebApp.Mvc.Models.EventListModel
<h1 style=
"font-size: 24px; margin-bottom: 20px;"
>
@Html.Raw(Model.Message)
</h1>
<div>
<ul>
@
foreach
(var e
in
Model.Events)
<li>
<div>
@Html.SitefinityDetailsViewLink(e.Title,
"Index"
,
"/"
+ e.UrlName,
new
Guid(
"dfa3e71e-a7a7-63db-87ca-ff00009b8c9e"
))
</div>
</li>
</ul>
</div>