Ticket T598069
Visible to All Users

Web - the progress bar implemented using the T246223 example does not look right in ListView

created 7 years ago

[DevExpress Support Team: CLONED FROM T246223: How can I implement a progress bar in the ListView grid column and DetailView editor for both Windows and Web?]
Hi
My progress bar look like that, i implemented like you. How can i fix it. If i change "WebEditorCell" css width from chrome(100%) its look like normal

Show previous comments (3)

    Hi

    I mean WebProgressPropertyEditor.cs file same with old example. Which file i have to focus?

    Anatol (DevExpress) 7 years ago

      It appears that you misunderstood our initial answer. Please accept our apologies for being unclear. We did not reproduce any issue with the old example and attached a sample project only to demonstrate that this approach works correctly with the current version on our side. Please provide the information we requested in this ticket so that we can continue researching the issue you have encountered.

        Hi,

        I have attached my solution file as "Solution1.rar". You can check this project which has same error.

        Thank you.

        Answers approved by DevExpress Support

        created 7 years ago (modified 7 years ago)

        Hello Murat,

        Thank you for the sample project. I can see that these project behaviors are different, because they have a different doctypeMode value in Web.config - our sample has the Xhtml value, while yours - Html5. Currently, the latter value is used by default for new projects. With the Html5 mode, control alignment is specified through CSS classes, and the following CSS class is added to the grid control's progress bar cell:

        CSS
        .dx-ar > * { float: right; }

        This happens, because the grid control uses the right alignment for numeric types by default. To change this behavior, you can specify the required alignment in the corresponding grid column explicitly:

        C#
        using DevExpress.ExpressApp; using DevExpress.ExpressApp.Model; using DevExpress.ExpressApp.Editors; using DevExpress.ExpressApp.Web.Editors.ASPx; using Solution1.Module.Web.Editors; namespace Solution1.Module.Web { public class GridColumnAlignController : ViewController<ListView> { protected override void OnViewControlsCreated() { base.OnViewControlsCreated(); ASPxGridListEditor gridListEditor = View.Editor as ASPxGridListEditor; if (gridListEditor != null) { foreach (ColumnWrapper wrapper in gridListEditor.Columns) { IModelColumn columnModel = View.Model.Columns[wrapper.PropertyName]; if (columnModel != null && columnModel.PropertyEditorType == typeof(WebProgressPropertyEditor)) { ((ASPxGridViewColumnWrapper)wrapper).Column.CellStyle.HorizontalAlign = System.Web.UI.WebControls.HorizontalAlign.Center; } } } } } }

        Please check this solution and let me know if you encounter any issues.

          Comments (2)

            Ok, i see. Align controller for WebProgressPropertyEditor types just works fine. (docTypeMode is also works when i changed it to Xhtml but i want to use Html5 so…)
            Thanks for your help.

            Anatol (DevExpress) 7 years ago

              You are welcome!

              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.