This forum has moved to a new location and is in read-only mode. Please visit talk.octobercms.com to access the new location.

jarrett15904
jarrett15904

Hi all,

I'm new to OctoberCMS and web dev in general and I'm trying to build a very simple static site. I'm trying to implement a "contact us" form where the user can enter their email address.

I'm using the Semantic UI Boilerplate theme and as far as I can understand Semantic includes the scripts required to implement the form functionality seen here. However, when I include the example form code in a page, form.js is not loaded in the page. I've tried including form.js in my default.htm layout under scripts, but that has not changed the behaviour.

Thanks for any tips you can offer.

Harrison
Harrison

If its PHP script, it may be a little harder to implement (last time I attempted something similar, I had to make my own plugin, and even then I got stumped, and bought FormBuilder) but for just a script, heres what I do

The default path to the assets folder is: /themes/your-theme-name/assets/

Also make sure to include jQuery if its needed, as well as {% scripts %} , {% framework %} and {% framework extras % with your scripts

jarrett15904
jarrett15904

Thanks for the reply. I should probably just go for FormBuilder, but I'd like to use some of Semantic's formatting options that rely on scripts too.

At the moment I have

    <!-- SCRIPTS -->
    <script src="{{ [
        'assets/js/vendor/jquery-2.2.1.min.js',
        'assets/js/vendor/semantic.min.js',
        'assets/js/vendor/components/form.min.js',
        'assets/js/app.js'
    ]|theme }}"></script>
    {% framework extras %}
    {% framework %}
    {% scripts %}

But I'm not certain whether semantic.min.js should be calling form.min.js without me needing to explicitly add it. Either way, the form isn't behaving as expected.

Crazymodder
Crazymodder

You want to load form.min.js inside of semantic.min.js? If so you can try somethink like this

$.getScript( "form.min.js", function( data, textStatus, jqxhr ) {
    console.log( data ); // Data returned
    console.log( textStatus ); // Success
    console.log( jqxhr.status ); // 200
    console.log( "Load was performed." );
});

Last updated

1-4 of 4

You cannot edit posts or make replies: the forum has moved to talk.octobercms.com.