Skip to main content

Create a generic ticket submission form (legacy)

This page applies to:MindTouch Responsive

This article outlines steps for creating a ticket submission form in MindTouch that allows your users to send a support request via email to a specified endpoint.
 

How to create a generic ticket submission form


Step 1: Create your form

Perform the following steps to create a basic ticket submission form that captures a submitter's first name, last name, email (if the user is anonymous), subject and description.

  1. Navigate to your site.
  2. Create a New page (in this example, we created the form in yoursitename/$ContactSupportFormDirectory).
  3. Insert a new DekiScript block.
  4. Copy and paste the boilerplate below:
var args = __request.args;

<form class="mt-support-form">
    <fieldset>
        <div class="mt-field">
            <label for="firstname"> "First name" </>
            <input type="text" name="firstname" maxlength="100" />
        </div>
        <div class="mt-field">
            <label for="lastname"> "Last name" </>
            <input type="text" name="lastname" maxlength="100" />
        </div>

        if(user.anonymous) {
            <div class="mt-field mt-required-field">
                <label for="email"> "Email" </>
                <span class="mt-required"> "Required" </span>
                <input type="text" name="_email" maxlength="300" />
            </div>
        } else {
            <input type="hidden" name="_email" value=(user.email) />
        }

        <div class="mt-field mt-required-field">
            <label for="subject"> "Subject" </>
            <span class="mt-required"> "Required" </span>
            <input type="text" name="subject" maxlength="300" value=(#args['query'] ? args['query'] : '') />
        </div>
        <div class="mt-field">
            <label for="description"> "Description" </>
            <textarea class="mt-email-field" placeholder="Please describe your issue." name="description"></>
        </div>
        <input type="hidden" name="_search" value=(#args['query'] ? args['query'] : '') />
        <input type="hidden" name="_path" value=(#args['path'] ? args['path'] : '/') />

        template('MindTouch/Controls/WorkflowSubmitIssueButton', { button: 'Submit' });
    </fieldset>
</form>

last line in the form is the template call that accepts a button parameter where you can specify the text or markup to be displayed in a button that is generated for you.

  1. (Optional) Paste the following code into a CSS block to hide any nonessential controls.
    .modified, .tags, #related, .product-menu, .article-menu, .dw-hierarchy, .breadcrumbs, div.pageinfo, div.widget, .mt-content-container.widget, div.mt-search{ 
        display: none !important; 
    }
  2. Further customize the form by adding or removing fields that suit your needs.

   The boilerplate creates two required hidden fields that log data: _search and _path. Both are mapped to the correct values.

Step 2: Name your submission button

The following line calls the form builder template and adds the logic necessary for support requests. Change the name of the button by replacing FORMNAME with your text. 

template('MindTouch/Controls/WorkflowSubmitIssueButton', {button: 'FORMNAME'});