SIA Web Design Library

Article feedback form: Submitted

No notes defined.

<div data-uuid='article-feedback-789' class='c-article-feedback-form
                    js-article-feedback-form--async
                ' data-ajax-url='#' data-article-id='123' data-thank-you-message='Thank you for your contribution!'>
    <div id='article-feedback-789-article-feedback-form-response'>
        <div class='c-notice c-notice--success'>Thank you for your contribution!</div>
    </div>
</div>
 
<div data-uuid='{{ uuid }}' class='{{ get_component_class( 'article-feedback-form', display ) }}
        {% if async %}
            js-article-feedback-form--async
        {% endif %}
        ' data-ajax-url='{{ ajaxUrl }}' data-article-id='{{ articleId }}' data-thank-you-message='{{ thankYouMessage|default( 'Thank you for your contribution!'|t ) }}'>
    <div id='{{ uuid }}-article-feedback-form-response'>
        {% if submitted %}
            <div class='c-notice c-notice--success'>{{ thankYouMessage|default( 'Thank you for your contribution!'|t ) }}</div>
        {% endif %}
    </div>
    {% if not submitted %}
        <form id='{{ uuid }}-article-feedback-form' class='c-article-feedback-form__form'
                {% if formAction %}
                    action='{{ formAction }}'
                {% endif %}
                {% if formMethod %}
                    method='{{ formMethod }}'
                {% endif %}
                >
            <div id='{{ uuid }}-article-feedback-form-detail' class='c-article-feedback-form__detail form-group'>
                <label for='{{ uuid }}-article-feedback-form-detail-input'>
                    <span class='form-field__label'>{{ detailLabel|default( 'Your suggestions'|t ) }}</span>
                    <textarea id='{{ uuid }}-article-feedback-form-detail-input' name='detail' class='form-input form-input--textarea' rows='5'></textarea>
                </label>
                <div class='form-actions'>
                    <button type='submit' name='helpful' value='no' class='c-button c-article-feedback-form__submit js-no-js-hide'>{{ buttonLabel|default( 'Submit'|t ) }}</button>
                </div>
            </div>
            <div class='c-article-feedback-form__actions form-group form-actions'>
                <button type='submit' name='helpful' value='yes' class='c-button c-article-feedback-form__action c-article-feedback-form__action--yes'>{{ yesLabel|default( '👍 Yes'|t ) }}</button>
                <button type='submit' name='helpful' value='no' class='c-button c-article-feedback-form__action c-article-feedback-form__action--no'>{{ noLabel|default( '👎 No'|t ) }}</button>
            </div>
        </form>
    {% endif %}
</div>
 
{
  "uuid": "article-feedback-789",
  "articleId": 123,
  "ajaxUrl": "#",
  "async": true,
  "submitted": true
}