0

I am writing a block where I need to render a form inside the editor. This is how I tried it:

edit: function( props ) {
        return(
            <Form
                method="get"
                className="search-form"
                <PlainText
                    title="search box"
                    placeholder="Search"
                    className="search-field"
                    type="text"
                    name="s"
                    readonly="true"
                />
                <PlainText
                    type="hidden"
                    name="type"
                    value="media"
                />
                <Button
                    type="submit"
                    title="search site"
                    className="search-submit"
                    value="&rsaquo;"
                    disabled="disabled"
                />
            />
        );
    },

But the watcher is complaining with the following (screenshot attached)

enter image description here

what is the right way to do it?

2

When an element doesn't have children it can be self-closing:

<Something something="123" />

Otherwise it needs to behave like normal html tag with an opening part: <Something> and a closing one: </Something>

edit: function( props ) {
    return(
        <Form
            method="get"
            className="search-form"
        >
            <PlainText
                title="search box"
                placeholder="Search"
                className="search-field"
                type="text"
                name="s"
                readonly="true"
            />
            <PlainText
                type="hidden"
                name="type"
                value="media"
            />
            <Button
                type="submit"
                title="search site"
                className="search-submit"
                value="&rsaquo;"
                disabled="disabled"
            />
        </Form>
    );
},

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.