run a JS script from a ggb button

Demaria Philippe shared this question 3 years ago
Answered

Hi,

I want to send a variable value from a GGB file in a JS script on the web.

I create my button and this is its action :

AnalyserNombre[Sol1, trep ]
SoitValeur[ok,true]
Si[test,SoitValeur[grade,grade+1]]
I want to run a JS script to get the value of grade. I have no idea.

The name of my JS script is : store_score.js

Regards.

Best Answer
photo

Sorry, but want to know if it's possible : From a ggb button, I want to trigger an Ajax script.

Is it possible ? if yes, how ?

MANY MANY thanks !!!

Comments (7)

photo
1

ggbApplet.getValue("grade")
You can test it in the browser's console

photo
1

With your code, I get the value of grade but I want to launch the file store_score.js when I click th GGB button inside the GGB file.

In fact, I want to run an Ajax process from the GGB Button into the GGB file.

Exemple :

From HTML :

<form action="#" methode="POST">
<a class="launcher" href="#" data-file_id="1"> launch</a>
</form>
I run this code :

$(".launcher").on('click', function(){

something to do

})
So I want to run this JQuery code from a GGB Button.

273d3c089650f61808fb0231aa26cd57

I don't know if it's possible and what I can I do.

photo
1

With your code, I get the value of grade but I want to launch the file store_score.js when I click th GGB button inside the GGB file.

In fact, I want to run an Ajax process from the GGB Button inside the GGB file.

Example to run a JS code :

From HTML :

<form action="#" methode="POST">
<a class="launcher" href="#" data-file_id="1"> launch</a>
</form>
I run this code :
$(".launcher").on('click', function(){

something to do

}) 
So I want to run this JQuery code from a GGB Button.I don't know if it's possible and what I can I do.

photo
1

I want to launch the file store_score.js when I click th GGB button
Why? It's more usual to make sure the script is loaded first then just call a method from the button

photo
1

Yes, I know that the method is loaded.

But I want to save the grade in my database each time the GGB button is clicked.

For that, I use Ajax in my store_score.js.

Now, I save the score at the end of the exercise. But I need to click on a submit button in my HTML code.

I want to do this directly from GGB Button, after every question.

This is my store_score.js


        $('#submit_button').on('click', function (event) {
          var grade = ggb_applet_container.getValue("grade");
          var numexo = ggb_applet_container.getValue("numexo");
          score = grade/(numexo-1) ;
            let start_time = $(this).attr("data-start_time");
            let exercise_id = $(this).attr("data-exercice_id"); 

            let csrf_token = $("input[name='csrfmiddlewaretoken']").val();
            $.ajax(
                {
                    type: "POST",
                    dataType: "json",
                    data: {
                        'score': score,
                        'numexo': numexo-1,
                        'exercise_id':exercise_id,
                        'start_time':start_time,
                        csrfmiddlewaretoken: csrf_token
                    },
                    url: "../../store_the_score_ajax/",
                    success: function () {

                        alert("Le score de cet exercice est enregistré.") ; 
 
                      
                        }
                }
            );
        }); 
It works fine but I need to call it from HTLM button ! I want to call it from GGB Button.

photo
1

Sorry, but want to know if it's possible : From a ggb button, I want to trigger an Ajax script.

Is it possible ? if yes, how ?

MANY MANY thanks !!!

photo
1

I read that I can do something with applet.registerObjectUpdateListener("numexo", "mafonction");  

the variable called numexo is inside my ggb file. My fonction is in the html, JS script :

What is wrong ?

<script>
var parameters = {"appname":"classic",
"id":"ggb_applet_container",
"prerelease":false,
"width":....,
"height":....,
"showToolBar":....,
"showfullscreenbutton":true,
"borderColor":"#f5f8fd",
"showMenuBar":....,
"showAlgebraInput":....,
"showResetIcon":....,
"enableLabelDrags":false,
"enableShiftDragZoom":....,
"enableRightClick":false,
"capturingThreshold":null,
"showToolBarHelp":false,
"errorDialogsActive":false,
"useBrowserForJS":false,
"langage":"en",
"filename":....,
"appletOnLoad" : function(applet) {
applet.setValue("situation",{{ relation.situation }});
applet.registerObjectUpdateListener("numexo", "mafonction");
}

mafonction(){
alert(numexo);
}
</script>

© 2023 International GeoGebra Institute