Typing-in random field, with persistence for the correction

[Tavo]

Hello all!

I am new here. I discovered Anki just a few weeks ago and it’s helping me so much, I wish I had found it before.

I am using Anki to study Russian. I create the cards in AnkiDesktop, but I mainly study them in AnkiDroid.

I would like to use randomization for the following:

• Adjectives: I have notes with 5 fields, which are the four forms of a Russian adjective (masculine, feminine, neuter and plural) and the Spanish translation.
• Verb conjugations: notes with one field for the infinitive and one additional field for each person (I, you, (s)he, we, etc.).

I don’t one to create one card for each of the possibilities, because then I will have too many cards for a few adjectives and verbs, and less time to revise sustantives, adverbs, etc. Instead, I have managed to have one single card, where I am asked randomly one of the fields.

Let’s focus on the adjective case. On the front of the card, I am shown the Spanish word and I am asked randomly to type one of its forms (m, f, n or p) in Russian.

The problem is that, when I introduce the answer and flip the card, the back of the card always uses the masculine form for the correction. That is, even if I am asked for the feminine and I type it in correctly, it will appear as incorrect because the back of the card is comparing it with the masculine answer.

I have tried to use anki-persistence and localStorage, with no success so far (it still compares my answer with the masculine version). Here are the current codes, using (or trying to do so) localStorage:

FRONT

Adjetivo: {{Castellano}}

<br>
<div class="sentence" hidden>Masculino: {{type:Ruso (m)}}</div>
<div class="sentence" hidden>Femenino: {{type:Ruso (f)}}</div>
<div class="sentence" hidden>Neutro: {{type:Ruso (n)}}</div>
<div class="sentence" hidden>Plural: {{type:Ruso (p)}}</div>

<script>
  const fields = [...document.querySelectorAll(".sentence")];

  function randomInt(max) {
    return Math.floor(Math.random() * max);
  }

  var numalea = localStorage.getItem('numalea'); // Recover stored number

  if (numalea == null) { // If it doesn't exist,
    numalea = randomInt(fields.length); // generate a new one
    localStorage.setItem('numalea', numalea); // and store it in localStorage
  }

  fields[numalea].hidden = false;
</script>

BACK

{{FrontSide}}

<hr id=answer>

Thanks a lot to everyone!

[Tavo]

In case it helps, I post a few screenshots:

The note:

Front (I am asked a random field every time, which is great):

Back (I swear that my answer was correct!)

Thanks again!

[Tavo]

I don’t manage to get the type-in correction on the back to be consistent with the front side. But using cloze I did get a nice result. I upload here how it looks and the code, in case someone is interested.

By the way, does someone know whether it’s possible to extract what the user typed in? Because in that case, I could reproduce the correction (comparing on the back side the correct version with the text that the user introduced).

Currently:

FRONT SIDE

<br>Verbo: {{Verbo}}.
<br>({{Tiempo}}).

<hr>

<div class="campo" hidden>
{{Persona1}}
{{cloze:Forma1}}.
<br><br>{{type:cloze:Forma1}}
</div>

{{#Forma2}}
<div class="campo" hidden>
{{Persona2}}
{{cloze:Forma2}}.
<br><br>{{type:cloze:Forma2}}
</div>
{{/Forma2}}

{{#Forma3}}
<div class="campo" hidden>
{{Persona3}}
{{cloze:Forma3}}.
<br><br>{{type:cloze:Forma3}}
</div>
{{/Forma3}}

{{#Forma4}}
<div class="campo" hidden>
{{Persona4}}
{{cloze:Forma4}}.
<br><br>{{type:cloze:Forma4}}
</div>
{{/Forma4}}

{{#Forma5}}
<div class="campo" hidden>
{{Persona5}}
{{cloze:Forma5}}.
<br><br>{{type:cloze:Forma5}}
</div>
{{/Forma5}}

{{#Forma6}}
<div class="campo" hidden>
{{Persona6}}
{{cloze:Forma6}}.
<br><br>{{type:cloze:Forma6}}
</div>
{{/Forma6}}


<script>
{
		const campos = [...document.querySelectorAll(".campo")];
		let numalea;

		if (sessionStorage.getItem("numalea")) {
			numalea = JSON.parse(sessionStorage.getItem("numalea"));
		} else {
				numalea = Math.floor(Math.random() * campos.length);
				sessionStorage.setItem("numalea", JSON.stringify(numalea));
		}

		campos[numalea].hidden = false;
}
</script>

BACK SIDE

<br><br>

<div class="campo" hidden>
{{Persona1}}
{{cloze:Forma1}}.
</div>

{{#Forma2}}
<div class="campo" hidden>
{{Persona2}}
{{cloze:Forma2}}.
</div>
{{/Forma2}}

{{#Forma3}}
<div class="campo" hidden>
{{Persona3}}
{{cloze:Forma3}}.
</div>
{{/Forma3}}

{{#Forma4}}
<div class="campo" hidden>
{{Persona4}}
{{cloze:Forma4}}.
</div>
{{/Forma4}}

{{#Forma5}}
<div class="campo" hidden>
{{Persona5}}
{{cloze:Forma5}}.
</div>
{{/Forma5}}

{{#Forma6}}
<div class="campo" hidden>
{{Persona6}}
{{cloze:Forma6}}.
</div>
{{/Forma6}}

<script>
{
		const campos = [...document.querySelectorAll(".campo")];
		let numalea;
		numalea = JSON.parse(sessionStorage.getItem("numalea"));
		campos[numalea].hidden = false;
		sessionStorage.clear()
}
</script>

<br> <b style="color: lightblue">{{Verbo}}</b> ({{Castellano}})
<br> {{Aspecto}}

<br><br>
<table class="conjugación"> <u>{{Tiempo}}</u>
  <tr> <td colspan="2"> 
  <tr> <td>{{Persona1}}
			 <td id=conj1>{{Forma1}}
	{{#Forma2}}<tr> <td>{{Persona2}}
			 <td id=conj2>{{Forma2}}{{/Forma2}}
	{{#Forma3}}<tr> <td>{{Persona3}}
			 <td id=conj3>{{Forma3}}{{/Forma3}}
	{{#Forma4}}<tr> <td>{{Persona4}}
			 <td id=conj4>{{Forma4}}{{/Forma4}}
	{{#Forma5}}<tr> <td>{{Persona5}}
			 <td id=conj5>{{Forma5}}{{/Forma5}}
	{{#Forma6}}<tr> <td>{{Persona6}}
			 <td id=conj6>{{Forma6}}{{/Forma6}}
</table>

<script>
	var str1 = "{{Forma1}}";
	var str2 = "{{Forma2}}";
	var str3 = "{{Forma3}}";
	var str4 = "{{Forma4}}";
	var str5 = "{{Forma5}}";
	var str6 = "{{Forma6}}";

	var res1 = str1.split(':').pop().split('}')[0];
	var res2 = str2.split(':').pop().split('}')[0];
	var res3 = str3.split(':').pop().split('}')[0];
	var res4 = str4.split(':').pop().split('}')[0];
	var res5 = str5.split(':').pop().split('}')[0];
	var res6 = str6.split(':').pop().split('}')[0];

	document.getElementById("conj1").innerHTML = res1;
	document.getElementById("conj2").innerHTML = res2;
	document.getElementById("conj3").innerHTML = res3;
	document.getElementById("conj4").innerHTML = res4;
	document.getElementById("conj5").innerHTML = res5;
	document.getElementById("conj6").innerHTML = res6;
</script>

Have a great weekend all!