Forum

Thread tagged as: Problem, Api, Add-on-development

Creating an app, using Form API for admin UI - textarea problem

I am playing around with developing an app - using the sample app as a starting point.

I'm using static fields for the admin UI, but a textarea field I've configured isn't showing the markitup editor.

My edit.post.php contains:

echo $Form->textarea_field('notes', 'Notes', $details['notes'], 'textile s autowidth', true);

Checking the source for the page correctly gives:

<div class="field ">
<label for="notes" class="">Notes</label>
<textarea id="notes" name="notes"  class="text textile s autowidth large markitup textile" rows="6" cols="40"></textarea>
</div>

But the markitup editor does not display on the admin page. Neither does the textile help link next to the textarea.

Looking at the source for the Pages area in the admin, it appears that the following javascript and css files are missing from my admin page:

        <script type="text/javascript" src="/new-gaffer/addons/plugins/editors/markitup/jquery.markitup.js"></script>
        <script type="text/javascript" src="/new-gaffer/addons/plugins/editors/markitup/settings.js"></script>
        <script type="text/javascript" src="/new-gaffer/addons/plugins/editors/markitup/image_upload/image_upload.js"></script>
        <script type="text/javascript" src="/new-gaffer/core/assets/js/jquery.form.min.js"></script>
        <script type="text/javascript" src="/new-gaffer/addons/plugins/editors/markitup/config.js"></script>
        <link rel="stylesheet" href="/new-gaffer/addons/plugins/editors/markitup/skin.css" type="text/css" />
        <link rel="stylesheet" href="/new-gaffer/addons/plugins/editors/markitup/style.css" type="text/css" />
        <link rel="stylesheet" href="/new-gaffer/addons/plugins/editors/markitup/image_upload/image_upload.css" type="text/css" />

Any advice on how to configure the admin page correctly?
Duncan Revell

Duncan Revell 78 points

  • 7 years ago
Drew McLellan

Drew McLellan 2638 points
Perch Support

7 years ago

Are you using any field types, or is it just hard coded fields?
Duncan Revell

Duncan Revell 78 points
Registered Developer

7 years ago

Just hard-coded fields - text_fields and the one textarea_field.
Drew McLellan

Drew McLellan 2638 points
Perch Support

7 years ago

The editor script/CSS gets included by the field types - the textarea_field is the underlying primitive. I would seriously recommend using a template if you want features like editors and textile or markdown - the field types will then make all that magic happen for you.

In your pre file:

    $Form = $API->get('Form');

    $Template   = $API->get('Template');
    $Template->set('my_app/my_template.html', 'my_app');

    $Form->set_required_fields_from_template($Template);

    if ($Form->submitted()) {        
        $data = $Form->receive_from_template_fields($Template);
    }

In your post file:

$details = array('your fields from DB for editing');
echo $Form->fields_from_template($Template, $details);
Duncan Revell

Duncan Revell 78 points
Registered Developer

7 years ago

Hi Drew,

configured as recommended - the admin form displays fine, with full markitup editor. However, the textarea_field is failing on save - an array is being passed to the database instead of a string. The array contains the text from the form, as 'raw' and 'prcoessed'. So I'm guessing it needs some json encoding before being passed to the database?

In the sample app, you do this for thingDynamicFields - I'll see if I can hack around with that and get it working with my current table...
Drew McLellan

Drew McLellan 2638 points
Perch Support

7 years ago

Yes, you'll want to store the full structure.
Duncan Revell

Duncan Revell 78 points
Registered Developer

7 years ago

Drew, just to let you know this is all working now as expected.

The sample app threw me a little bit - the reference to "dynamicFields" made me think I had to use static fields (because I have one column in my database for one field). As it is, I'm using a "dynamicField" to just store one entry. Now I've got my head round that, it will make things a lot easier in the future!

Cheers.