Modal

less than 1 minute read

References

TypeScript

import { Components } from "gd-sprest-bs";

// Create the button
Components.Button({
    el: document.querySelector("#modalDemo"),
    target: "#bsModalDemo",
    text: "Show Modal",
    toggle: "modal"
});
 * 
// Create the modal
let el = document.querySelector("#modalDemo");
let modal = Components.Modal({
    el: el,
    id: "bsModalDemo",
    title: "Modal Demo",
    body: "This is the body of the modal."
});

React

import * as React from "react";
import { Button, Components, Modal } from "gd-sprest-bsx";

export class IDemo extends React.Component {
    // Render the component
    render() {
        return (
            <div>
                <Button
                    target="#bsModalDemo"
                    text="Show Modal"
                    toggle="modal"
                />
                <Modal
                    id="bsModalDemo"
                    title="Modal Demo"
                    body={<p>This is the body of the modal</p>}
                />
            </div>
        );
    }
}

VueJS

<template>
    <div>
        <Button target="#bsModalDemo" text="Show Modal" toggle="modal" />
        <Modal id="bsModalDemo" title="Modal Demo" body="<p>This is the body of the modal</p>" />
    </div>
</template>

<script>
import { Alert } from "gd-sprest-bs-vue";
export default {
    components: { Alert }
}
</script>

Code Playground