Help needed on silly story generator exercise

MDN Learn
,
1

In accord with the given instructions, i have actually complete the exercise and to an extent, it functions well enough; but i observed a little difficulty directing the switch selection between the two check boxes for “UK” and “US”. I wanted to write a JS code to ensure the selection of one deselects the other box in the document, which is the main help I need in this case plus any other comments you can chip in to for better understanding.

the Codepen link to the exercise is : https://codepen.io/LILPHEMY/pen/wvgXKxO
while the link to the actual exercise is :
https://developer.mozilla.org/en-US/docs/Learn/JavaScript/First_steps/Silly_story_generator

2

Hi @lilphemy

Nice work with the code.

You can add the same name attribute to the radio buttons HTML and this will group the radio buttons together. This means that only one button can be chosen at a time. Refer to the section on Radio Button on Basic Form Controls.

In the case of your code I added name=“checkboxnew” to the shared radio buttons.

        <div class="cityoption">
            <label for="">UK</label> <input type="radio" id="uk" class="radiocheck" name="checkboxnew">
            <label for="">US</label> <input type="radio" id="us" class="radiocheck" name="checkboxnew">
        </div>

HTML generally carries some useful functionality so no need to look at creating separate JS for these things. I havent had a chance to review your code but will do so over the weekend.

Keep on learning :muscle: :sunglasses:

1 Like
3

Hey @Ran
Damn felt amazing having to realize what i needed to do was quite a little HTML trick to make the code work accordingly, thanks so much for your help Ran and i really appreciate your effort.
Please do review my code whenever you are chanced, and I would love to hear from you once again.

4

Hi @lilphemy
I got caught up on some personal stuff on the weekend hence my late reply.
I looked at your code today once I did the task again myself.

I think it looks perfect. One thing they suggest is to use regular expressions for the :insertX: which appears twice in the text. They give an example

For instance, let text = 'I am the biggest lover, I love my love'; text.replace(/love/g,'like'); will replace all instances of ‘love’ to ‘like’.

You could also have used a loop like I did initially which was a for in loop. However generally less code is better so the regular expression would be the best.

Try out the regular expression yourself. Let me know if you have any questions. I will get back to you sooner this time.

Good luck and enjoy your studies.

5

Thanks man, I did try your suggestion for the regular expression and it worked well. I hope to look into the FOR…IN loop expression later. cheers