Scripts not local (Moodle Formulas, deferred feedback, version 3.1.5)

Scripts not local (Moodle Formulas, deferred feedback, version 3.1.5)

by Ton Boerkoel -
Number of replies: 7

I just realized that a script I used in one question of a quiz, to reduce the box size, somehow leaked to other problems in that same quiz.  The quiz had 35 questions.  In some of them I had included the script, to reduce the numerical formulas boxes. All numerical formulas boxes in other problems also ended up reduced (I checked and those problems didn't have that script in it anywhere). I assumed that questions were independent units. Are scripts universal to all questions in a quiz? How can we make a script local?

Here is the script (borrowed from a previous forum post)

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

<script>

    $(document).ready(function() {

        /* FORMAT THE INPUT BOX */

        $(".formulas_numerical_formula").css("width", "45px");

        $(".formulas_numerical_formula").css("height", "25px");

        $(".formulas_numerical_formula").css("padding", "0");

        $(".formulas_numerical_formula").css("background-color", "#FFF");

        $(".formulas_numerical_formula").css("border", "1px solid #AAA");

        $(".formulas_numerical_formula").css("border-radius", "2px");

        $(".formulas_numerical_formula").css("outline", "none");

        $(".formulas_numerical_formula").css("text-align", "center");

    });

</script>


Average of ratings: -
In reply to Ton Boerkoel

Re: Scripts not local (Moodle Formulas, deferred feedback, version 3.1.5)

by Dominique Bauer -
Picture of Documentation writers Picture of Particularly helpful Moodlers Picture of Plugin developers
Hello Ton,

The script you are showing only affects the web page it is currently placed on. It does not affect any other page in any way.
Average of ratings: -
In reply to Dominique Bauer

Re: Scripts not local (Moodle Formulas, deferred feedback, version 3.1.5)

by Ton Boerkoel -
That's what I thought too, until the following happened today in my quiz:

Here is an example of a question where the reduction in box size was intended
(it had the script in the parts section)



And here is another question in the same quiz where the script was NOT included.
It was intended to be numerical formula size box (it is a numerical formula box as
you can see)


Here is that same question but not part of the same quiz {viewed in the question bank)
and is does have the correct  numerical formula size box


So why if the script is local to that one question are the numerical formula boxes
reduced in size in all other questions of that quiz? 

When you say the script "only affects the web page it is currently placed on"
do you mean the page that is visible on the screen, or do you mean the entire quiz as "the webpage".
The problems I copied above were not on the same page, yet somehow the box size was changed as
the script aims to do.

I am trying to understand why this happens and how it can be avoided. Thanks.

Average of ratings: -
In reply to Ton Boerkoel

Re: Scripts not local (Moodle Formulas, deferred feedback, version 3.1.5)

by Dominique Bauer -
Picture of Documentation writers Picture of Particularly helpful Moodlers Picture of Plugin developers
Ton,

A web page is whatever the brower loads and displays when you access a new URL through an hyperlink.

In simple terms, it is a single page. If you have a quiz with questions on different pages, these are different 'web pages'. Web pages are also called "documents". So when you invoque $(document).ready(function() {}, you can modify the Document Object Model (DOM), that is all HTML and CSS of the document, i.e. of the current web page. You cannot modify the DOM of other web pages.

Check again the HTML code of all the fields (question text, part text, feedback and so on) for JavaScript code that you may not have noticed.
Average of ratings: -
In reply to Dominique Bauer

Re: Scripts not local (Moodle Formulas, deferred feedback, version 3.1.5)

by Ton Boerkoel -
Well I looked in every part where a script could be hidden but it is just not there ... and yet the formula box is reduced (as you can see above). But if I open the problem individually it is fine, unreduced. (The fact that it is fine when I open it by itself proves that the script is not present in that problem). It must have to do with opening the problems all at once in "review attempt" mode. Maybe then scripts are shared as part of the same page, even though you cannot see all 35 questions at once, but you can seamlessly scroll through them. (?)

Do two questions displayed in a quiz on the same page share scripts? 
Average of ratings: -
In reply to Ton Boerkoel

Re: Scripts not local (Moodle Formulas, deferred feedback, version 3.1.5)

by Dominique Bauer -
Picture of Documentation writers Picture of Particularly helpful Moodlers Picture of Plugin developers
Hello Ton,

Maybe then scripts are shared as part of the same page,
Correct.

even though you cannot see all 35 questions at once, but you can seamlessly scroll through them. (?)
Correct. A page is not the same as a screen view. It includes everything from the top of the page to the bottom of it, which can be multiple scrolls below, until you can't scroll down anymore.

Do two questions displayed in a quiz on the same page share scripts?
Yes.
Average of ratings: -
In reply to Dominique Bauer

Re: Scripts not local (Moodle Formulas, deferred feedback, version 3.1.5)

by Ton Boerkoel -

Thanks Dominique, I understand now.

and thanks Jeffrey for the div tip, I'll incorporate that!

Average of ratings: -
In reply to Ton Boerkoel

Re: Scripts not local (Moodle Formulas, deferred feedback, version 3.1.5)

by Jeffrey Black -

The script you are using will change every instance of an element with a class name of "formulas_numerical_formula" on the entire page, not just the question.

If you only want to change it for a particular question I recommend adding in a div or the like into the question you want to change, something like:

<div class="resizebox" style="display:none;">&nbsp;</div>

Then you can update your script to only act on questions which have this:

<script>
    $(document).ready(function() {
        /* FORMAT THE INPUT BOX */
        $(".que:has(.resizebox) .formulas_numerical_formula").css("width", "45px");
        $(".que:has(.resizebox) .formulas_numerical_formula").css("height", "25px");
        $(".que:has(.resizebox) .formulas_numerical_formula").css("padding", "0");
        $(".que:has(.resizebox) .formulas_numerical_formula").css("background-color", "#FFF");
        $(".que:has(.resizebox) .formulas_numerical_formula").css("border", "1px solid #AAA");
        $(".que:has(.resizebox) .formulas_numerical_formula").css("border-radius", "2px");
        $(".que:has(.resizebox) .formulas_numerical_formula").css("outline", "none");
        $(".que:has(.resizebox) .formulas_numerical_formula").css("text-align", "center");
    });
</script>

This way instead of selecting all the elements with class "formulas_numerical_formula", it will only select those which are inside a question (which all have a class of "que" although it may be faster to use ".que.formulas" to only select the questions which are also formula type questions) which contain an element with a class of "resizebox". If you only want it to apply to parts of a question, change the ".que" to ".formulaspart", and put the div above into each part you want to have it resize.

Average of ratings: Useful (1)