Developer forum

Forum » Development » Extend existing screen in DW10

Extend existing screen in DW10

Imar Spaanjaars Dynamicweb Employee
Imar Spaanjaars
Reply

Is it possible to extend an existing screen (PriceEdit for ecom prices in my concrete case) by adding a new (read-only) field? I need to extend the price matrix with a Ship-To ID (imported from the ERP) and I would like to show that field when editing a price. 

The docs and chat bot didn't help much yet.

Thanks!

Imar


Replies

 
Nicolai Pedersen Dynamicweb Employee
Nicolai Pedersen
Reply

Hi Imar

Some code that should get you started. You cannot add properties and editors to a price that we provide.

If you add a custom column to the ecomprices table, you can find that information using SQL or whatever and inject it on the priceedit screen using some of the things below:

Example: Add group to PriceEditScreen

using System.Collections.Generic;
using Dynamicweb.CoreUI.Actions;
using Dynamicweb.CoreUI.Editors;
using Dynamicweb.CoreUI.Editors.Inputs;
using Dynamicweb.CoreUI.Screens;
using Dynamicweb.Products.UI.Models.Prices;
using Dynamicweb.Products.UI.Screens.Prices;

public sealed class PriceEditScreenInjector : EditScreenInjector<PriceEditScreen, PriceDataModel>
{
    // 1. Add groups to an existing tab, or pass a new tab name to create one.
    //
    //    EditorFor() binds to a model property and resolves an editor via the screen's own GetEditor().
    //    To display data that does not exist on the model, construct an editor manually and set its
    //    Label and Value directly — then add it alongside the model-bound editors.
    public override void OnBuildEditScreen(EditScreenBase<PriceDataModel>.EditScreenBuilder builder)
    {
        // Model-bound fields:
        builder.AddComponents("General", "Pricing", new[]
        {
            builder.EditorFor(m => m.Priority),
            builder.EditorFor(m => m.IsInformative),
        });

        // External data — not on the model, fetched from elsewhere:
        var productId = Screen?.Model?.ProductId;
        var externalInfo = productId is not null
            ? MyService.GetSomeInfo(productId)
            : null;

        builder.AddComponents("General", "External info", new[]
        {
            new Text { Label = "Some info", Value = externalInfo?.Name, Readonly = true },
            new Text { Label = "Status",    Value = externalInfo?.Status, Readonly = true },
        });
    }

    // 2. Supply a custom editor for a model-bound property.
    //    Return null to fall back to the screen's own editor resolution.
    public override EditorBase? GetEditor(string propertyName, PriceDataModel? model) => propertyName switch
    {
        nameof(PriceDataModel.Priority) => new Number { Min = 0, Max = 100 },
        _ => null,
    };

    // 3. Add toolbar buttons to the screen.
    public override IEnumerable<ActionGroup>? GetScreenActions() =>
    [
        new() { Nodes = [ new MyCustomAction() ] }
    ];
}

Key points:

  • Inherit EditScreenInjector<TScreen, TModel> — TScreen = PriceEditScreen, TModel = PriceDataModel
  • AddComponents(tabName, groupName, editors[]) — adds group under existing or new tab
  • Auto-discovered via AddInManager — no DI registration needed, just drop the class in an assembly that gets loaded
  • builder.EditorFor(m => m.Field) resolves the editor the same way the screen does (calls GetEditor internally)
  • Override GetEditor(string propertyName, TModel? model) on the injector if you need a custom editor for a property

To add to a new tab instead of "General", just use a tab name that doesn't exist yet — it'll be created.

 

 
Imar Spaanjaars Dynamicweb Employee
Imar Spaanjaars
Reply

Nice, that's working really well, thanks!

I have a few more questions though.

- If I wanted to make my controls editable. is there a way to run code along with the original save request (like After Save or so) or would I have to provide my own command and UI for that?

- How do you know which model to use for other areas of the backend? The screen is part of the URL but how could I have found out the model was a PriceDataModel?

Imar

 
Nicolai Pedersen Dynamicweb Employee
Nicolai Pedersen
Reply

Good questions!

You cannot add custom attritbutes and save them with the price. You can display the value - and on the priceedit screen you can inject an action that pops an offcanvas where you value can be edited in its own edit screen with your own model and savecommand. Clunky, but workable.

The best way to currently find the model is looking at the queries - i have just added one where you can list datamodels and the screens they belong to.

 

You must be logged in to post in the forum