[Modules] Remove "Next" button from last page of module.

[je9xj]

I'm not sure if there is already a way to do this but it would be nice if the last page of the module instead of saying "Next" and going to a new module it said "Home" and took you back to the home page. I know you can create prerequisites for modules but for our purposes it doesn't matter what order they do the modules in as long as they all get done. I don't want students to just go through 3 modules and not realize what they have completed. 

[DannonMcg734]

I was looking for the same thing.  Did you ever get a solution?

[tpavlic]

Bump. Any progress on this? My guess is that we're stuck with a "Next" on every single page, regardless of whether it is at the end of a module.

[bcarpenter]

We're having the same issue with teachers who want to build their agendas into modules for organization, but are not having students work through the modules. Any way to turn it off?

[cholling]

it's not ideal, and doesn't remove the next button, but using a text header to "close" each module at least creates a speed bump for students to know they have concluded a module.

[michael_casselm]

Another bump for you, we have found it would be nice to hide both the "Previous" and "Next" buttons as we gamify our courses.

[ThisGuyRic]

Yes, please! I want!

[Lauren_Zatto]

I am also in favor of Canvas removing the "next" button at the end of a module. I want my students to know when they complete a module. I am currently adding a "page" at the end of each module which reads "You have completed Module X". However, I would like to see a way for a module to have closure so that my students are not working through a module and then all of a sudden enter the next module. Thank you in advance for addressing this matter 🙂

[jerry_nguyen]

Yes, it's possible with custom Javascript as follow:

if (window.location.href.match('module_item_id')) {
var currentURL = window.location.href;
    console.log("I'm in a module page");

	var moduleID_Reg = /(?:^|module_item_id)=(\d*?)(?:\D|$)/g; //Get Module ID from URL
    var moduleID_Result = moduleID_Reg.exec(window.location.href); //Get Module ID from URL
	var module_id = moduleID_Result[1]; //Get Module ID from URL
	var courseID = currentURL.match(/\/courses\/(\d+)/g); //Get Course ID
	console.log(module_id);

$.get('/api/v1'+ courseID + '/module_item_sequence?asset_type=ModuleItem&asset_id=' + module_id, function (response) { //Run API to get module position
        
	console.log(response.items[0].current.module_id); //Get current item Module number
	console.log(response.items[0].next.module_id); //Get next module number
	
	if (response.items[0].current.module_id != response.items[0].next.module_id ) { //If next module number is different then ....
	console.log("Last item of module")

		waitForElm('.module-sequence-footer-button--next').then((elm) => {
    console.log('Next button is available');
	$("span[class='module-sequence-footer-button--next']").remove(); //remove next button
});
		
	}
	

});


}

function waitForElm(selector) {
    return new Promise(resolve => {
        if (document.querySelector(selector)) {
            return resolve(document.querySelector(selector));
        }

        const observer = new MutationObserver(mutations => {
            if (document.querySelector(selector)) {
                resolve(document.querySelector(selector));
                observer.disconnect();
            }
        });

        observer.observe(document.body, {
            childList: true,
            subtree: true
        });
    });
}

[jerry_nguyen]

@michael_casselm  you can simply use custom CSS

span.module-sequence-footer-button--previous, span.module-sequence-footer-button--next {
    display: none;
}

[sjjorstad]

There needs to be an easy way to remove the next button from the last page of a module.