Jump to main content Jump to doc navigation

In this Tutorial we will learn how to create a doodles-manager with help of MIGXdb.

First we will create a db-schema and its table(s). Then we will create and configure a MIGXdb Custom Manager Page (CMP) to manage our doodles (database records).

Requirements

This tutorial is for MODX 3.0.0-pl and above.

To begin with we will need to install MIGX using the Package Manager.

Create a new Package and schema-file

The Package

  • In the main MODX menu, click Extras
  • Click MIGX
  • Click the Package Manager tab
  • Add 'doodles' to the Package Name field.
  • Click Create Package

This should create a /doodles directory under your /core/components directory containing new /schema and /src folders, as well as a new file, bootstrap.php.

The Schema

  • Stay on the Package Manager tab
  • Ensure 'doodles' is still in the Package Name field
  • Click the Xml Schema tab
  • Add the following code:
<?xml version="1.0" encoding="UTF-8"?>
<model package="Doodles\Model\" baseClass="xPDO\Om\xPDOObject" platform="mysql" defaultEngine="InnoDB" version="3.0">
    <object class="Doodle" table="doodles" extends="xPDO\Om\xPDOSimpleObject">
        <field key="name" dbtype="varchar" precision="255" phptype="string" null="false" default=""/>
        <field key="description" dbtype="text" phptype="string" null="false" default=""/>
        <field key="createdon" dbtype="datetime" phptype="datetime" null="true"/>
        <field key="createdby" dbtype="int" precision="10" attributes="unsigned" phptype="integer" null="false" default="0" />
        <field key="editedon" dbtype="datetime" phptype="datetime" null="true"/>
        <field key="editedby" dbtype="int" precision="10" attributes="unsigned" phptype="integer" null="false" default="0" />
        <field key="deleted" dbtype="tinyint" precision="1" attributes="unsigned" phptype="integer" null="false" default="0" />
        <field key="published" dbtype="tinyint" precision="1" attributes="unsigned" phptype="integer" null="false" default="0" />
        <aggregate alias="CreatedBy" class="modUser" local="createdby" foreign="id" cardinality="one" owner="foreign"/>
        <aggregate alias="EditedBy" class="modUser" local="editedby" foreign="id" cardinality="one" owner="foreign"/>
    </object>
</model>
  • Click Save Schema

Your new schema file doodles.mysql.schema.xml should now be created in /core/components/doodles/schema. You can test it by clicking Load Schema in the Xml Schema tab (always ensure your package name 'doodles' is present in the MIGX Package Manager tab when working on your package).

Note that the fields 'published' and 'deleted' are required by the default getlist-processor of MIGXdb.

Of course you can create your own processors under your own processor-path.

Read more about creating schemas

Parse Schema

  • Click the Schema tab
  • Click Parse Schema

This will create xpdo-classes and maps from your new schema.

Create Table(s)

  • Click the Create Tables tab
  • Click Create Tables

This will create your new table(s) in your database from your new schema.

Create the Configuration

Now we want to create our configuration for the MIGXdb Custom Manager Page (CMP).

  • Go to the main-tab MIGX
  • There should be a grid with some buttons
  • Click the Add Item button
  • In the window that opens, we add the following:

Settings

  • Name: 'doodles'
    • this is the name of our configuration. Make sure to use unique configuration-names
  • "Add Item" Replacement: 'Add new Doodle'
    • this is the text for our Add Item button
  • unique MIGX ID: 'doodles'
    • Its a good idea to have a unique MIGX - id for all your MIGX-configs.

CMP-Settings

  • Main Caption: 'Doodles'
  • Tab Caption: 'Manage your Doodles'
  • Tab Description: 'Here you can Add / Remove and Edit your Doodles.'

MIGXdb-Settings

  • Classname: 'Doodles\Model\Doodle'

Saving your Progress

At this point, we need to save your 'doodles' configuration to allow MIGX to connect to your database table and access its fields.

  • Click Save and Close to save your MIGX configuration.
  • Staying on the MIGX tab - Right-click your 'doodles' configuration and click Edit to continue editing it.

Columns

  • Click the Select db-fields button
  • Select the following fields:
    • id
    • name
    • description
    • published
  • Click Save and Close
  • Right-click and Edit each field as follows:
    • id
      • Header: 'ID'
    • name
      • Header: 'Name'
    • description
      • Header: 'Description'
    • published
      • Header: 'Published'
      • Renderer: 'this.renderClickCrossTick'
      • on Click: 'switchOption'

Formtabs

  • Click Add Item to add a new formtab
  • Caption: 'Doodle'
  • Click Select db-fields
  • Select the following fields:
    • name
    • description
  • Click Save and Close
  • Right-click and Edit each field as follows:
    • name
      • Caption: 'Name'
    • description
      • Caption: 'Description'
      • Input TV type: 'textarea'

Db-Filters

  • Click Add item
  • filter Name: 'search'
  • Filter Type: 'textbox'
  • getlist-where:
{"name:LIKE":"%[[+search]]%","OR:description:LIKE":"%[[+search]]%"}

Contextmenues

  • check: update, duplicate, publish, unpublish and recall_remove_delete

Actionbuttons

  • check: addItem

Saving your Configuration

  • Click Save and Close on your configuration.

Create a menu item for your CMP

  • In the MODX menu, click the Tools (gear icon)
  • Click Menus
  • Click Create
  • Enter values:
    • Parent: choose where you want the menu item to appear
    • Lexicon-key: 'Doodles' (or what you'd like the menu item to be named if you're not using a Lexicon)
    • Action: 'index'
    • Parameters: &configs=doodles (note: 'doodles' here refers to the 'name' field of your MIGXdb config as opposed to the 'unique MIGX ID')
    • Namespace: 'migx'
  • Click Save button

Done

Refresh the manager page

Go to the area of the menu where you created your 'doodles' menu item and click it

There it is, your new 'doodles' manager!

Listing your Doodles on the Frontend

To list your Doodles on the Frontend, you can use the included snippet migxLoopCollection

An example:

[[!migxLoopCollection?
  &classname=`Doodles\Model\Doodle`
  &tpl=`@CODE:<h3>[[+name]]</h3><p>[[+description]]</p>`
  &sortConfig=`[{"sortby":"name","sortdir":"ASC"}]`
  &where=`{"published":"1"}`
]]

This will list all published Doodles in alphabetical order.

Support the team building MODX with a monthly donation.

The budget raised through OpenCollective is transparent, including payouts, and any contributor can apply to be paid for their work on MODX.

Backers

  • modmore
  • STERC
  • Digital Penguin
  • Jens Wittmann – Gestaltung & Entwicklung
  • Fabian Christen
  • Dannevang Digital
  • Sepia River Studios
  • CrewMark
  • Chris Fickling
  • deJaya
  • Murray Wood
  • Lefthandmedia
  • eydolan
  • A. Moreno
  • Following Sea
  • Anton Tarasov
  • Raffy
  • Stéphane Jäggi
  • Alex
  • JT Skaggs
  • Snow Creative
  • Nick Clark
  • Helen
  • krisznet
  • YJ
  • Richard
  • Yanni

Budget

$289 per month—let's make that $500!

Learn more