I have made a multiple-choice and kind of checkbox card types. They don't work in Ankidroid.

1,892 views
Skip to first unread message

sh88....@gmail.com

unread,
Nov 20, 2017, 6:05:27 AM11/20/17
to AnkiDroid
First of all, I'm thankful for your extremely useful app and all the hard work you have done for it. I needed multiple-choice and checkbox questions. So I contacted Anki support and they provided the initial card type for multiple-choice cards. I modified it, made it better and created a checkbox card type by slightly modifying the multiple-choice card type. I can use both multiple-choice and checkbox cards in Anki but they are not shown properly in Ankidroid. I have attached a deck containing one card for each card type and I would be grateful If you can kindly check it and say whether the problem can be solved.

Thank you in advance and with the best wishes,
Arman
Sample.apkg

sh88....@gmail.com

unread,
Nov 22, 2017, 2:38:52 PM11/22/17
to AnkiDroid
I forgot to mention that these cards work without the need for any add-on or anything else. So, basically, they should work in Ankidroid. Shouldn't they?

sh88....@gmail.com

unread,
Nov 25, 2017, 5:23:36 AM11/25/17
to AnkiDroid
Is there anywhere else I could report this issue and they help me?


On Monday, November 20, 2017 at 2:35:27 PM UTC+3:30, Arman Sh wrote:

Timothy Rae

unread,
Nov 26, 2017, 11:52:03 PM11/26/17
to AnkiDroid
If you post your template code it might be easier for someone to quickly check for errors so we don't have to import your apkg.

sh88....@gmail.com

unread,
Nov 27, 2017, 2:41:54 AM11/27/17
to AnkiDroid
I thought seeing templates in a deck would be easier than seeing it on a web page. In responce to your request, I have put the code in this message. The questions and randomly positioned choices are shown correctly in Ankidroid but whenever I press "show answer", all the choices vanish. I got the initial code from Damien Elmes through Anki support.

Front Template:

{{Question}}


<center><div id=questions style="text-align:left;"></div></center>

<script>

function shuffle(array) {

var currentIndex = array.length, temporaryValue, randomIndex ;


// While there remain elements to shuffle...

while (0 !== currentIndex) {


// Pick a remaining element...

randomIndex = Math.floor(Math.random() * currentIndex);

currentIndex -= 1;


// And swap it with the current element.

temporaryValue = array[currentIndex];

array[currentIndex] = array[randomIndex];

array[randomIndex] = temporaryValue;

}


return array;

}


var right = "{{CorrectAnswer}}";

var all = [right, "{{WrongAnswer1}}", "{{WrongAnswer2}}", "{{WrongAnswer3}}"];

var buf = "<ol type=a>";

shuffle(all);

for (var i=0; i<4; i++) {

buf += "<li>"+all[i];

}

buf += "<ol type=a>";


document.getElementById("questions").innerHTML = buf;

</script>




Styling:

.card {

font-family: arial;

font-size: 20px;

text-align: left;

color: black;

background-color: white;

margin-left:auto; margin-right:auto; width:80%

}

img { margin-bottom: 2em; }


.field_set_col{

margin-bottom: 1em;

border: 2px solid #007868;

border-right: 2px solid #007868;

border-bottom: 2px solid #007868;

}



li{

margin: 20px 0;

}




Back template:

{{Question}}




<div id=ansArea></div>


<script>

var buf = "<ol type=a>";

var ans;

for (var i=0; i<4; i++) {

ans = all[i];

if (ans == right) {

ans = "<font color='#007868'><b>"+ans+"</font></b>";

}

buf += "<li>"+ans;

}

buf += "<ol type=a>";

document.getElementById("ansArea").innerHTML = buf;

</script>


<hr id=answer>


{{Extra}}





Chechkbox questions contain very similar code:


Front template:


{{Question}}


<center><div id=questions style="text-align:left;"></div></center>

<script>

function shuffle(array) {

var currentIndex = array.length, temporaryValue, randomIndex ;


// While there remain elements to shuffle...

while (0 !== currentIndex) {


// Pick a remaining element...

randomIndex = Math.floor(Math.random() * currentIndex);

currentIndex -= 1;


// And swap it with the current element.

temporaryValue = array[currentIndex];

array[currentIndex] = array[randomIndex];

array[randomIndex] = temporaryValue;

}


return array;

}


var right1 = "{{CorrectAnswer1}}";

var right2 = "{{CorrectAnswer2}}";

var all = [right1, right2, "{{WrongAnswer1}}", "{{WrongAnswer2}}", "{{WrongAnswer3}}"];

var buf = "<ol type=a>";

shuffle(all);

for (var i=0; i<5; i++) {

buf += "<li>"+all[i];

}

buf += "<ol type=a>";


document.getElementById("questions").innerHTML = buf;

</script>




Styling:


.card {

font-family: arial;

font-size: 20px;

text-align: left;

color: black;

background-color: white;

margin-left:auto; margin-right:auto; width:80%

}

img { margin-bottom: 1em; }



li{

margin: 20px 0;

}




Back template:


{{Question}}




<div id=ansArea></div>


<script>

var buf = "<ol type=a>";

var ans;

for (var i=0; i<5; i++) {

ans = all[i];

if (ans == right1 | ans == right2) {

ans = "<font color='#007868'><b>"+ans+"</font></b>";

}

buf += "<li>"+ans;

}

buf += "<ol type=a>";

document.getElementById("ansArea").innerHTML = buf;

</script>


<hr id=answer>


{{Extra}}



Tim

unread,
Nov 27, 2017, 7:20:43 PM11/27/17
to AnkiDroid
> The questions and randomly positioned choices are shown correctly in Ankidroid but whenever I press "show answer", all the choices vanish.

It sounds like the issue is due to the difference between how we display the answer on AnkiDroid compared to Anki Desktop. I have very little experience working with javascript, so I'm afraid I can't be of anymore assistance than that.

If you want to dig through the code, here is where we show the answer. If you compile the code with the variable SAVE_CARD_CONTENT set to true, AnkiDroid will dump the actual html page for the cards it's displaying in the AnkiDroid directory, which you can then open with an ordinary web browser to debug your javascript. You might also contact Damien again and see if he has any ideas.

sh88....@gmail.com

unread,
Nov 28, 2017, 5:19:36 AM11/28/17
to AnkiDroid
There is something else that I don't know whether it helps or not. You might understand something from it. The current Anki desktop version is 2.0.48. It shows multi-choice questions correctly, but when I open the Anki browser and click preview button, the exact thing I described for Ankidroid happens over there too (choices vanish upon seeing the answer). I have already discussed this matter with Anki support and they responded Anki 2.1 beta shows no such problem and I can confirm what they said. Maybe Ankidroid uses a similar approach with the preview button?

sh88....@gmail.com

unread,
Apr 17, 2018, 2:09:16 AM4/17/18
to AnkiDroid
Hi, I finally asked the question from Anki support site and this is the answer:


1 Posted by Damien Elmes on Apr 17, 2018 @ 10:02 AM

Damien Elmes's Avatar

I'm afraid it appears AnkiDroid is reloading the web view when revealing the answer, which means there is no way to carry state from the question side over to the answer side.


Do you think there is any way to fix this?

Best regards, 
Arman


On Tuesday, November 28, 2017 at 3:50:43 AM UTC+3:30, Tim wrote:

Timothy Rae

unread,
Apr 19, 2018, 9:38:23 PM4/19/18
to AnkiDroid
Please create a new issue on github, hopefully someone will pick the issue up.

Tim

unread,
May 31, 2018, 8:45:15 AM5/31/18
to AnkiDroid
Maybe you can use cookies to keep the state though?

sh88....@gmail.com

unread,
May 31, 2018, 9:11:47 AM5/31/18
to AnkiDroid
Thank you for your response. Unfortunately, I'm not familiar with JavaScript. I could barely make some minor changes to the code that was written by Damien Elmes. But let me transfer your idea to Anki forum.

sh88....@gmail.com

unread,
Jun 2, 2018, 5:25:51 AM6/2/18
to AnkiDroid

Support Staff 4 Posted by Damien Elmes on Jun 01, 2018 @ 06:40 AM

Damien Elmes's Avatar

It's not something I've personally tried I'm afraid. Perhaps you could ask on the community forum to see if anyone can help you with it.



On Thursday, May 31, 2018 at 5:15:15 PM UTC+4:30, Tim wrote:

sh88....@gmail.com

unread,
Jun 20, 2018, 2:59:43 PM6/20/18
to AnkiDroid
Looks like the topic I created in GitHub is closed. It is claimed that the topic is somehow addressed in another topic. I don't know whether the other topic can provide any help. It's about whiteboard.

Mike Hardy

unread,
Jun 20, 2018, 4:34:36 PM6/20/18
to anki-a...@googlegroups.com

Hi Arman!

No, you’re topic is still open and it may still be possible to address it

I was simply cross-linking it with a different topic (embeddable whiteboards) because that issue had a potential solution involving maintaining WebView state when the card is “flipped” from front to back. If that solution had been implemented, it would have solved your issue at the same time so I wanted those issues linked at least a little bit so I/we wouldn’t forget

It looks like the embeddable whiteboard topic was solved with a different solution (HTML5 sessionStorage) and is working now: https://github.com/pigoz/anki-canvas

So the link I made between the issues may be useful still - if you look at how @pigoz solved his whiteboard you might be able to do the same thing with your multiple-choice state: store the state in HTML session storage and try to read it from there. I seem to recall from the topic (please forgive me if I’m wrong) that you weren’t super comfortable with programming javascript and I understand that, but maybe if you followed the link over to the one that @pigoz started and asked him if he thinks the solution could be applied to your problem, you might find @pigoz is willing to help you out?

Hope clears it up / is helpful -
-Mike

On Jun 20, 2018, at 1:59 PM, sh88....@gmail.com wrote:

Looks like the topic I created in GitHub is closed. It is claimed that the topic is somehow addressed in another topic. I don't know whether the other topic can provide any help. It's about whiteboard.


--
You received this message because you are subscribed to the Google Groups "AnkiDroid" group.
To unsubscribe from this group and stop receiving emails from it, send an email to anki-android...@googlegroups.com.
To post to this group, send email to anki-a...@googlegroups.com.
To view this discussion on the web visit https://groups.google.com/d/msgid/anki-android/ea0d2516-8301-4e04-b934-fd75b81f332a%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

sh88....@gmail.com

unread,
Jun 20, 2018, 4:56:50 PM6/20/18
to AnkiDroid
Hi Mike,

I really appreciate your kind help. I'm also thankful for warmly explaining why I misunderstood it. I really hope it can help the problem. I'll transfer your suggestion to Anki forum.


Wish you all the best,

Arman

Tues

unread,
Oct 18, 2018, 12:12:54 PM10/18/18
to AnkiDroid
Hi Arman,

I saw your follow-up post (https://anki.tenderapp.com/discussions/ankidesktop/27780-issue-with-multi-choice-cards) and sample cards which I attached.

Do you know of a way to hide empty fields from being displayed in your shuffled list? For example, if I only fill in two out of four {{WrongAnswer}} fields, I would like the list to be populated only by the two fields with text in them. Currently a list of four items gets generated with two of the list items appearing blank.

I have a feeling I need to insert {{#WrongAnswer}}{{WrongAnswer}}{{/WrongAnswer}} for each field since that is how Anki hides empty fields but I don't know how to do it as part of your script.

Thanks!
Sample.apkg

sh88....@gmail.com

unread,
Oct 18, 2018, 12:39:29 PM10/18/18
to AnkiDroid
Hi Tues,


I had to create alternative versions of the primary code in order to make it work for every scenario. But there is an easier way.

During communication with Anki support, they suggested the following add-on:


It only works on Anki 2.1. But it also works on the current version of Ankidroid.

Unless you have code in your choices, it works just fine.


I wish it could help.

Mike Hardy

unread,
Oct 18, 2018, 12:47:05 PM10/18/18
to anki-a...@googlegroups.com

This is fascinating, I was totally unaware of this project but it does
show the power of web standards as they've slowly become more capable
since AnkiDroid was first released.

Multiple choice cards is a frequent request and I'm not aware of any
coherent documentation in the Anki ecosystem explaining that it's
possible now cross-platform (with this add-on).

Would anyone be willing to add some information to the AnkiDroid wiki
pointing to to this project and maybe deep-linking to
https://github.com/qwiglydee/anki-interactive/wiki/uc-choices

?

-Mike


On 10/18/18 11:39 AM, sh88....@gmail.com wrote:
> Hi Tues,
>
>
> I had to create alternative versions of the primary code in order to
> make it work for every scenario. But there is an easier way.
>
> During communication with Anki support, they suggested the following add-on:
>
> https://ankiweb.net/shared/info/1819109876
>
> It only works on Anki 2.1. But it also works on the current version of
> Ankidroid.
>
> Unless you have code in your choices, it works just fine.
>
>
> I wish it could help.
>
>
> On Thursday, October 18, 2018 at 7:42:54 PM UTC+3:30, Tues wrote:
>
> Hi Arman,
>
> I saw your follow-up post
> (https://anki.tenderapp.com/discussions/ankidesktop/27780-issue-with-multi-choice-cards
> <https://anki.tenderapp.com/discussions/ankidesktop/27780-issue-with-multi-choice-cards>)
> <https://www.google.com/url?q=https%3A%2F%2Fgithub.com%2Fpigoz%2Fanki-canvas&sa=D&sntz=1&usg=AFQjCNGEMJqK9L0rVdbP6AULYXATRkwhXw>
>> <https://groups.google.com/d/msgid/anki-android/ea0d2516-8301-4e04-b934-fd75b81f332a%40googlegroups.com?utm_medium=email&utm_source=footer>.
>> For more options, visit https://groups.google.com/d/optout
>> <https://groups.google.com/d/optout>.
>
> --
> You received this message because you are subscribed to the Google
> Groups "AnkiDroid" group.
> To unsubscribe from this group and stop receiving emails from it, send
> an email to anki-android...@googlegroups.com
> <mailto:anki-android...@googlegroups.com>.
> To post to this group, send email to anki-a...@googlegroups.com
> <mailto:anki-a...@googlegroups.com>.
> To view this discussion on the web visit
> https://groups.google.com/d/msgid/anki-android/2e7a94ce-0a25-4785-ae07-1dc1580699c0%40googlegroups.com
> <https://groups.google.com/d/msgid/anki-android/2e7a94ce-0a25-4785-ae07-1dc1580699c0%40googlegroups.com?utm_medium=email&utm_source=footer>.

Tues

unread,
Oct 18, 2018, 1:20:12 PM10/18/18
to AnkiDroid
Thanks Arman, the add-on looks great (I updated to 2.1 a couple weeks ago).
Reply all
Reply to author
Forward
0 new messages