LittleCub Forms

Default theme is the basic theme that provides a full set of templates for all control types as well as a table layout template. It tries to inject only needed HTML tags, styles or attributes other than two extra data attributes, data-lctype for the control type and data-lcid for the unique control id.

Out of the box, LittleCub doesn't provide any stylesheet for the default themes. However you can create your own quite easily.

Examples

var form1 = LittleCub({
    "movie" : "Kung Fu Panda",
    "storyline" : "The story is set in the Valley of Peace, a fictional land in ancient China inhabited by anthropomorphic animals. Po, a panda, is a kung fu fanatic who idolizes the Furious Five?Tigress, Monkey, Mantis, Viper, and Crane?a quintet of kung fu masters trained by the red panda Master Shifu to protect the valley.",
    "cast" : {
        "Jack Black" : {
            "character" : "Po",
            "biography" : "Thomas Jacob \"Jack\" Black (born August 28, 1969)[1] is an American actor, producer, comedian, voice artist, writer, and musician. His acting career has been extensive, starring primarily as bumbling and cocky but internally self-conscious outsiders in comedy films, though he has played dramatic roles."
        }
    }
}, {
    "form" : {
        "attrs" : {
            "name" : "my-form",
            "endpoint" : "/post"
        },
        "buttons" :[
            {
                "type" : "submit",
                "name" : "submit",
                "value" : "Submit"
            },
            {
                "type" : "reset",
                "name" : "reset",
                "value" : "Reset"
            }
        ]
    }
}, {
    "type" : "object",
    "title" : "Bear Movies",
    "properties" : {
        "movie" : {
            "type" : "string",
            "title" : "Movie Title",
            "minLength" : 10
        },
        "storyline" : {
            "type" : "string",
            "title" : "Storyline"
        },
        "cast" : {
            "type" : "object",
            "title" : "Cast",
            "properties" : {
                "Jack Black" : {
                    "type" : "object",
                    "title" : "Jack Black",
                    "properties" : {
                        "character" : {
                            "type" : "string",
                            "title" : "Character"
                        },
                        "biography" : {
                            "type" : "string",
                            "title" : "Biography"
                        }
                    }
                }
            },
            "required" : ["character"]
        }
    }
}, document.getElementById('form-1'));