Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found
Not Found

Submitted

JS, CSS Y HTML

Matias 330

@mmc1999

Desktop design screenshot for the URL shortening API landing page coding challenge

This is a solution for...

  • HTML
  • CSS
  • JS
  • API
3intermediate
View challenge

Design comparison


SolutionDesign

Solution retrospective


I have only one problem in the js code, I don't know why I have to click twice on the "shorten it" button for the information to appear. PLEASE FEEDBACK!

Community feedback

GerLC 455

@GerLC

Posted

Hola, como estas!

The problem with that, I think it is because of this: On this part $form.addEventListener when you do

  • validarForm();

  • guardarLS();

    In validarForm() it might take a little time to fetch the data and push it in 'enlaces' in the guardarEnlace() function, so when guardarLS() fires you see that the first click on "shorten it" in the localStorage 'enlaces' is still empty [] so in mostrarDatos() when it try to get the data it wont get it at first. But after validarForm() finish it will push the link in 'enlaces', so if you click "shorten it" with nothing in the input a second time after the first one, it will load the information.

    So what it is really happening, its that every time you click the "shorten it", the information gets delayed.

    For solving this problem I would put guardarLS() inside validarForm() or in guardarEnlace() i think.

Marked as helpful

0
Matias 330

@mmc1999

Posted

Thank you! I had to put saveLS in saveLink! You saved me!

1

Please log in to post a comment

Log in with GitHub
Discord logo

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord