UI-O-Matic Docs

The official home of the documentation for the umbraco package UI-O-Matic

UI-O-Matic allows you to auto generate an integrated crud UI in Umbraco v7/v8/v9/v10 for a db table based on a petapoco / npoco (the default ORM in Umbraco) poco and more...

Please be aware of the License Model before using this package since additional charges might apply if you are an Umbraco Gold Partner.

How can I install it?

UI-O-Matic can be installed from the Nuget package repository, or build manually from the source-code

For Umbraco v10 use v5.latest of UI-O-Matic

For Umbraco v9 use v4.latest of UI-O-Matic

For Umbraco v8 use v3.latest of UI-O-Matic

For Umbraco v7 use v2.latest of UI-O-Matic

Getting Started

Of course make sure that UI-O-Matic is installed, your user has access to the new UI-O-Matic section and then create your poco

Example

If you have the following db table

CREATE TABLE [People] (
  [Id] int IDENTITY (1,1) NOT NULL
, [FirstName] nvarchar(255) NOT NULL
, [LastName] nvarchar(255) NOT NULL
, [Picture] nvarchar(255) NOT NULL
);

And the following petapoco/npoco poco

[TableName("People")]
public class Person
{

    [PrimaryKeyColumn(AutoIncrement = true)]
    public int Id { get; set; }

    public string FirstName { get; set; }

    public string LastName { get; set; }

    public string Picture { get; set; }

}

The next additions to the class (attributes)

[UIOMatic("people","People","Person", FolderIcon = "icon-users", ItemIcon = "icon-user")]
[TableName("People")]
public class Person
{
    [PrimaryKeyColumn(AutoIncrement = true)]
    public int Id { get; set; }

    [Required]
    [UIOMaticField(Name = "First name", Description = "Enter the persons first name")]
    public string FirstName { get; set; }

    [Required]    
    [UIOMaticField(Name = "Last name",Description = "Enter the persons last name")]
    public string LastName { get; set; }

    [UIOMaticField(Name = "Picture",Description = "Select a picture", View =  UIOMatic.Constants.FieldEditors.File)]
    public string Picture { get; set; }

    public override string ToString()
    {
        return FirstName + " " + LastName;
    }

}

will generate the following crud UI

v8

v7

Last updated