BuyLog In
Ticket T526272
Visible to All Users

How to enable card or layout view mode instead of a regular data grid in ListView

created 8 years ago (modified 8 years ago)

Hi dear support,

I followed the article:

How to: Implement an ASP.NET Web List Editor Using a Custom Control
https://documentation.devexpress.com/#eXpressAppFramework/CustomDocument113126

…to implement a ListEditor displaying objects as cards.

The corresponding solution is attached in the zip file.

I have three problems:

  1. How to design this ListEditor and a corresponding ObjectViewController so that an action is automatically executed when a user clicks a card?
    For example an ObjectViewController WindowPopupShowAction?

  2. In the listView toolbar, the "Edit" and "Delete" actions are always disabled.
    I would like the "Edit" and "Delete" actions to be enabled when a card is selected.

  3. In the attached solution, WebCardListViewEditor.cs, when the user clicks on a card, the Control_SelectionChanged event calls OnProcessSelectedItem(), which produces a NullReferenceException in DevExpress.Data.DataController.SaveRowState(Stream stream).
    If I comment the line "OnProcessSelectedItem()", the error doesn't happen.
    Is this a good solution?

Thanks for your help,
Marc

Comments (1)
Dennis Garavsky (DevExpress) 8 years ago

    Hello Marc,

    Thanks for your report. We need some additional time to research your sample. Please bear with us.
    It seems that it is required to implement the internal and undocumented ICustomRenderUpdatePanel and ISupportCallbackStartupScriptRegistering interfaces by your ListEditor to be able to update a page content on the ASPxCardView's callbacks.

    =============
    The error occurred:

    Type:       NullReferenceException
    Message:    La référence d'objet n'est pas définie à une instance d'un objet.
    Data:       0 entries
    Stack trace:

    à DevExpress.Data.DataController.SaveRowState(Stream stream)
       à DevExpress.Web.Data.WebDataControllerProvider.SaveRowState(Stream stream)
       à DevExpress.Web.Data.WebDataProxy.SaveRowState(TypedBinaryWriter writer)
       à DevExpress.Web.Data.WebDataProxy.SaveDataState(TypedBinaryWriter writer)
       à DevExpress.Web.ASPxGridBase.SaveGridControlStateCore(TypedBinaryWriter writer)
       à DevExpress.Web.ASPxGridBase.SaveGridControlState()
       à DevExpress.Web.ASPxGridBase.SyncCallbackState()
       à DevExpress.Web.ASPxGridBase.GetCallbackStateValueForRender()
       à DevExpress.Web.ASPxGridBase.GetClientObjectState()
       à DevExpress.Web.ASPxGridBase.GetCallbackResult()
       à DevExpress.Web.ASPxWebControl.System.Web.UI.ICallbackEventHandler.GetCallbackResult()
    InnerException is null

    Sign in to comment on this post

    Answers approved by DevExpress Support

    created 8 years ago (modified 4 years ago)

    Hello,

    Common

    GridListEditor and ASPxGridListEditor support table and band layouts. Card or layout view modes are unsupported and require you to implement custom-tailored solutions for both platforms. This is not something we are planning to introduce out-of-the-box in the near term, because user interest for this is low. Please keep in mind that we primarily prioritize our activities based on available resources, feedback from roadmap surveys and suggestions from the DevExpress Support Center.

    XAF is very flexible and customizable and you can integrate custom controls unavailable by default on your own: Concepts > UI Construction > Using a Custom Control that is not Integrated by Default.
    For instance, the following help articles illustrate a solution for the simplest scenario that does the job quite nicely:
        How to: Show a Custom Data-Bound Control in an XAF View (ASP.NET)
        How to: Show a Custom Data-Bound Control in an XAF View (WinForms)
    Choose this route only if you do not need all the standard XAF functionality such as the New, Link, Unlink Actions, Validation, Security, ConditionalAppearance, etc. and just want to present read-only or editable data within the DetailView.

    As an alternative, you can consider the following approaches:
        How to: Implement a Custom WinForms List Editor
        How to: Implement an ASP.NET Web List Editor Using a Custom Control
    A proper implementation with support for all standard XAF features for several platforms can be costly. This is quite an advanced task that requires a good knowledge of the DevExpress ASPxGridView or GridControl, general ASP.NET or WinForms development skills and also XAF knowledge. To see how much code is required to support all standard XAF functionality, check out the built-in Grid List Editors source: …\DevExpress.ExpressApp.Web\Editors\ASPx\GridListEditor\ or …\DevExpress.ExpressApp.Win\Editors\Grid.

    Below, you can find links to working examples of custom List Editors for WinForms and ASP.NET WebForms. Hopefully, this will help you get started if you choose this route. Of course, you can fine-tune this further according to your needs using the corresponding DevExpress control documentation and support knowledge base.

    WinForms
    Find an example of a LayoutView-based custom List Editor in our XVideoRental demo: *c:\Users\Public\Documents\DevExpress Demos XX.X\Components\eXpressApp Framework\XVideoRental\CS\Common.Win\LayoutView* (look for the WinColumnsListEditor and LayoutView descendants). For more information on this implementation, research the source code of the standard GridListEditor class. You can also find more recent versions in the eXpand's repository on GitHub.

    ASP.NET WebForms
    Attached is a Web project based on the How to: Implement an ASP.NET Web List Editor Using a Custom Control  approach and ASPxCardView (T719532_v18.2_CS.zip). The "Edit" and "Delete" Actions are updated based on the selected objects by implementing the internal and undocumented ICustomRenderUpdatePanel and ISupportCallbackStartupScriptRegistering interfaces. The  IXafCallbackHandler interface and the ASPxClientCardView.CardClick event are used to show a detail view for the selected object instead of calling OnProcessSelectedItem() method. For more information on this implementation, research the source code of the standard ASPxGridListEditor class.


    You can also find third-party ListEditors, for instance, ASPx Card List Editor from XAFARI by Galaktikasoft.

    Search keywords
    convert table grid mode, card view, cardview, card layout view, ListView, LayoutView, ASPxCardView, GridControl, WinForms, Web, ASP.NET WebForms, ASPx, ASPxGridListEditor, GridListEditor, GridView

      Sign in to comment on this post

      Disclaimer: The information provided on DevExpress.com and affiliated web properties (including the DevExpress Support Center) is provided "as is" without warranty of any kind. Developer Express Inc disclaims all warranties, either express or implied, including the warranties of merchantability and fitness for a particular purpose. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.

      Confidential Information: Developer Express Inc does not wish to receive, will not act to procure, nor will it solicit, confidential or proprietary materials and information from you through the DevExpress Support Center or its web properties. Any and all materials or information divulged during chats, email communications, online discussions, Support Center tickets, or made available to Developer Express Inc in any manner will be deemed NOT to be confidential by Developer Express Inc. Please refer to the DevExpress.com Website Terms of Use for more information in this regard.