Hello, I'm working with a form and I try to execute some JS when form submission is a success. By looking the doc, I can read :

specifies JavaScript code to execute after the request is successfully completed. Inside the JavaScript code you can access the following variables: this (the page element triggered the request), the context object, the data object received from the server, the textStatus text string, and the jqXHR object.

Here is my code :

<form class="default" data-request="form::onFormSubmit" data-request-success="formSubmit();">

And my JS :

function formSubmit() {
  console.log(this);
  console.log(context);
  console.log(data);
  console.log(textStatus);
  console.log(jqXHR);
}

only "this" return something, for contect, I get the following error :

Uncaught ReferenceError: context is not defined

If somebody can help me to access all variables that should be accessible in that function.

Thanks

Last updated 6 years ago

That is because it doesn't know what 'context' is. Where is it defined, where are you taking it from? Also, it is probably the same thing for the other variables besides this.

I finally could correct this.

First, I forgot to add argument when I call my function, you should do like this :

<form class="default" data-request="form::onFormSubmit" data-request-success="formSuccess(this, context, data, textStatus, jqXHR)">

Then, in your javascript function :

function formSubmit(form, contect, data, textStatus, jqXHR) {
  console.log(form);
  console.log(context);
  console.log(data);
  console.log(textStatus);
  console.log(jqXHR);
}

all object become available.

NB : The first argument is "this" in the october documentation, but don't use "this" as first argument or you will have javascript error (that's why I replaced it by "form"))