vendredi 31 mai 2019

Checkbox required

I have this code for a newsletter block in my site, a specific CMS:

<!-- newsletter block -->

{if $tpl_settings.type == 'responsive_42'}{strip}
        <div class="subscribe{if $block.Side != 'left' && $block.Side != 'right'} light-inputs{/if}">
                <div id="nl_subscribe">
                        <input placeholder="{$lang.massmailer_newsletter_your_name}" type="text" id="newsletter_name" maxlength="50" />
                        <input placeholder="{$lang.massmailer_newsletter_your_e_mail}" type="text" id="newsletter_email" maxlength="100" />

                        <br />
                        <label><input type="checkbox" id="newsletter_privacy" /></label> <a href="#">Privacy Policy</a>.
                        <br />
                        <br />

                        <input class="low" onclick="xajax_subscribe('subscribe', $('#newsletter_name').val(), $('#newsletter_email').val());$(this).val('{$lang.loading}');" type="button" value="{$lang.massmailer_newsletter_subscribe}"/>

                        <div class="nav-link"><span id="unsubscribe_link" class="link">{$lang.massmailer_newsletter_unsubscribe}</span></div>
                </div>
                <div id="nl_unsubscribe" class="hide">
                        <input placeholder="{$lang.massmailer_newsletter_your_e_mail}" type="text" id="un_newsletter_email" maxlength="50" />
                        <input class="low" onclick="xajax_subscribe('unsubscribe', '', $('#un_newsletter_email').val());$(this).val('{$lang.loading}');" type="button" value="{$lang.massmailer_newsletter_unsubscribe}"/>
                        <div class="nav-link"><span id="subscribe_link" class="link">{$lang.massmailer_newsletter_subscribe}</span></div>
                </div>
        </div>
{/strip}{else}
        <div id="nl_subscribe">
                {$lang.massmailer_newsletter_your_name}
                <div style="padding: 0 0 5px;"><input type="text" id="newsletter_name" maxlength="150" style="width: 80%;" /></div>
                
                {$lang.massmailer_newsletter_your_e_mail}
                <div><input type="text" id="newsletter_email" maxlength="100" style="width: 80%" /></div>
                
                <div style="padding: 10px 0 0;">
                        <input onclick="xajax_subscribe('subscribe', $('#newsletter_name').val(), $('#newsletter_email').val());$(this).val('{$lang.loading}');" type="button" value="{$lang.massmailer_newsletter_subscribe}"/>
                </div>
                <div style="padding: 5px 0">
                        <a id="unsubscribe_link" href="javascript:void(0);" class="static">{$lang.massmailer_newsletter_unsubscribe}</a>
                </div>
        </div>
        <div id="nl_unsubscribe" class="hide">
                {$lang.massmailer_newsletter_your_e_mail}
                <div><input type="text" id="un_newsletter_email" maxlength="150" style="width: 80%" /></div>
                <div style="padding: 10px 0 0;">
                        <input onclick="xajax_subscribe('unsubscribe', '', $('#un_newsletter_email').val());$(this).val('{$lang.loading}');" type="button" value="{$lang.massmailer_newsletter_unsubscribe}"/>
                </div>
                <div style="padding: 5px 0">
                        <a id="subscribe_link" href="javascript:void(0);" class="static">{$lang.massmailer_newsletter_subscribe}</a>
                </div>
        </div>
{/if}

<script type="text/javascript">
{literal}
$(document).ready(function(){
        $('#unsubscribe_link').click(function(){
                $('#nl_subscribe').slideUp('normal');
                $('#nl_unsubscribe').slideDown('slow');
        });
        $('#subscribe_link').click(function(){
                $('#nl_unsubscribe').slideUp('normal');
                $('#nl_subscribe').slideDown('slow');
        });
});
{/literal}
</script>

<!-- newsletter block end -->

I can't enforce the "required" checkbox via JavaScript/Ajax, can you please help me to change the code correctly?

I'm not managing to make it work because the "form" tag is missing like any normal form.

Thanks!




Aucun commentaire:

Enregistrer un commentaire