Buy Now
Sign in

FAQ search

Connectivity edit with Chronoforms

Published: Saturday, 01 February 2014 14:15
In this tutorial we will create an edit form with ChronoForms v5 to be called directly from an Edit link in a ChronoConnectivity listing.

Build the form

First we will start a new ChronoForm and enter the form's name content-edit.
Next we will add the form elements we need, including a 'Hidden field' element which will hold the value of the primary key from the table, usually id or cf_id, to make sure we update the same record.
All of the input names should be array names using the Model ID, e.g. Article[title] as explained in the previous tutorial. If you add IDs they need to be unique but should not include the [] characters - using e.g. title should work OK.
Once the Design is complete go to the Setup tab. Here we need to an 'HTML (render form)' action to the 'On Load' event to display the form HTML. And, in the On Submit event drag a 'Connection Action' action from the External Apps actions group section. This action will returned the form data to the ChronoConnectivity listing and trigger the Save action there.
Open the action settings and enter the name of our ChronoConnectivity listing e.g. content and the action we want to execute when the form submits which is save.
Complete this part by saving the form.

Linking the form to ChronoConnectivity

Now go back to the ChronoConnectivity listing and, under Frontend list > Actions > Edit, enter the information about our new ChronoForms.
We need to enter the form name and the event we want to call separated by a colon e.g. content-edit:load.
There are two ways main ways to add an 'Edit' link to the listing. The simplest is to add an edit entry to the Columns list box e.g. _EDIT_:Edit; or we can make an exsiting column entry editable by adding it to the Edit linkable list box e.g. Article.title:Article
We had the permissions setup so we are ready, let's save and check our edit page on the front list.
As expected, the connection works to open the form in CFv5 and, when we submit, the edited data is all saved.
Using ChronoForms for editing allows us to use any of the ChronoForms features for example Captcha, or multi page action, etc.