Feature: "fill in the blank"

In educational environments, it is common to present students with a partially filled answer with some portions missing that they need to fill in:

This “fill in the blank” feature would allow the creation of a mathfield in “readonly” mode, that is the mathfield would behave as if it was a static element, except for some areas inside it that would be editable. Those areas would be indicated by a specific latex command, such as \placeholder.

Furthermore, it should be possible to read (or modify) the content of these areas programmatically and be notified when these areas are modified. To facilitate this, an identifier could get associated with each placeholder.

Example of what this could look like:

    <div id='mf'>\frac{8}{\placeholder[answer]{}}=2</div>

    MathLive.makeMathField('mf', {
        readOnly: true,
        onPlaceholderDidChange: (mf, id) => {
            console.log('The answer is ', mf.$getPlaceholderContent(id));
        }
    });

[dangcuuson]

Just want to share my current “workaround” for this feature:

1. Render static math (with \placeholder)
2. Find all span with .ML__placeholder class
3. Call makeMathField on each of those spans

It works great. Only drawback is the layout won’t look correct if I type another fraction in those boxes (obviously because it’s not aware that it’s already in another fraction). But it’s fine to me since my use cases don’t need to deal with nested fractions.

[caleb-flores]

@arnog I am interested to work on this and submit the PR.