[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
Web - the progress bar implemented using the T246223 example does not look right in ListView
Answers approved by DevExpress Support
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.
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.
Hello,
Thank you for contacting us. I have checked the project from the How can I implement a progress bar in the ListView grid column and DetailView editor for both Windows and Web? ticket and all works as expected on my side (see the attached sample and screenshot). Please provide us with a sample so we can reproduce the behavior on our side. I am looking forward to hearing from you.
Thanks,
Ilya P
Hi
I cou ldnt find which class content changed. Did you upload right file?
I do not quite understand what you mean. If you launch the T246223.Web project from the T598069_Sample.zip file attached by Ilya, you will see that progress bars are displayed correctly in the ListView shown at startup. No additional steps are required. See the source code of the property editor used in this example in the T598069_Sample\T246223.Module.Web\Editors\WebProgressPropertyEditor.cs file from the T598069_Sample.zip archive. If the same property editor does not give correct results in your project, please provide a sample project and describe how to reproduce the issue in greater detail. If our project does not work correctly on your side, clarify your browser version.
Hi
I mean WebProgressPropertyEditor.cs file same with old example. Which file i have to focus?
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.