Why other ajax functions are being called on form ajax submit?

Question

I have drupal form with ajax submit. And I have quite another $.get function, that makes $.get every 2 minutes and inserts the response in html element. The form and this js-code are not connected, they have different tasks and work separately. But when the ajax form is submitted, I see in console that $.het function is being called again and again. I am not sure it is normal. How to prevent it?

My form:

function example_my_form($form, &$form_state)
{

    $form['text'] = array(
        '#title' => t('Text'),
        '#type' => 'textarea',
        '#rows' => 5,
        '#default_value' => '',
        '#attributes' => array(
            'class' => array('form-control'),
            'placeholder' => drupal_strtolower(t('text'))
        ),
    );


    $form['submit'] = array(
        '#type' => 'submit',
        '#value' => 'Send',
        '#ajax' => array(
            'callback' => 'example_my_callback',
            'wrapper' => 'example_my_form',
            'method' => 'replace',
        )
    );


    return $form;

}

function example_my_callback(&$form, &$form_state) {
    return $form;
}

function example_my_form_submit(&$form, &$form_state) {
    /**
     * do something
     */
}

My js function:

    (function ($) {
        Drupal.behaviors.NoteRemind = {
            attach: function (context, settings) {
                function myFunction() {

                    var uid = Drupal.settings.MyModule.owneruid[0];
                    var note = document.getElementsByClassName('notecontainer')[0];
                    $.get('/rest/api/notes/' + uid, function (response, status, http) {
                        processNote(response);
                    }, 'json');

                    function processNote(response) {
                        var parsedData = JSON.parse(response);
                        console.log(parsedData);
                        /**
                         * add parsed data to html element
                         */
                    }

                };


                myFunction();
                setInterval(function () {
                    myFunction();
                }, 120000);

            }
        };
    }(jQuery));

Answer 1

Drupal behaviors are called on page load and on every ajax responce.
This is by design.
The value of the context variable sent to your behavior function is either document on first load, or what was recieved by ajax when an ajax request has been made.
So if you only want to apply the setInterval once on the page, you can either check the context variable is document, or set your own variable to track if the setInterval has been applied.

eg. check context:

if (context === document) {
  myFunction();
  setInterval(function () {
    myFunction();
  }, 120000);
}

eg. set your own variable:

if (typeof document.setAdded === 'undefined' || !document.setAdded) {
  myFunction();
  setInterval(function () {
    myFunction();
  }, 120000);
  document.setAdded = TRUE;
}

I am not sure why you have the extra function, I am pretty sure you can just do..

setInterval(myFunction, 120000);