Modal window in wagtail page editing interface

I want to add a custom BlockFeature and for that i need a modal window for input. I don't understand how to make a modal input window so that the entred data will go straight to my custom blockfeature props.

The feature i'm working on is an ordered list that starts with a given number (). So yeah, basically, i need that modal window to enter the starting number

@hooks.register('register_rich_text_features')
def register_ol_custom_feature(features):
    feature_name = "ol-custom"
    type_ = "ol-custom"
    control = {
        "type": type_,
        "label": "ol+",
        "element": "ol",
        "description": "Set start",
    }

    features.register_editor_plugin(
        'draftail',
        feature_name,
        BlockFeature(
            control,
            js=["static/js/orderedListCustom.js"],
        ),
    )

    db_conversion = {
        "from_database_format": {
            "ol[start]": BlockElementHandler(type_)
        },
        "to_database_format": {
            'block_map': {
                type_: lambda props: DOM.create_element(
                    "ol",
                    {"start": props.get("start") if "start" in props else 1}
                )
            }
        },
    }

    features.register_converter_rule("contentstate", feature_name,  db_conversion)
    features.default_features.append(feature_name)

I tried several js codes that i found online or got from ai, none of them worked (my bad, i suck at js). Also came across one post on here, but it didn't help (: In the end, i'm not even sure what things i need to consider/add/alter, what's the workflow here. Can anyone help?

Вернуться на верх