gustavo.goretkin
gustavo.goretkin
PostsComments
SSolidJS
Created by gustavo.goretkin on 10/15/2024 in #support
Migrating from `<input>` to contentEditable and handle selection
I'd like to migrate from using <input> to using <div contenteditable="true"> (to enable text selection across multiple elements) but I am not sure how to migrate some code, and whether I should use some SolidJS-specific way to handle selections. The specific code I am wondering about is here: https://github.com/ToposInstitute/CatColab/blob/43e054aa5efb57bf98fa4fabc2c9c21c9a0a9493/packages/frontend/src/model/object_cell_editor.tsx#L19-L26 
    let nameRef!: HTMLInputElement;

    createEffect(() => {
        if (props.isActive) {
            nameRef.focus();
            nameRef.selectionStart = nameRef.selectionEnd = nameRef.value.length;
        }
    });
    let nameRef!: HTMLInputElement;

    createEffect(() => {
        if (props.isActive) {
            nameRef.focus();
            nameRef.selectionStart = nameRef.selectionEnd = nameRef.value.length;
        }
    });
2 replies