As we said in this lecture, we're going to give functionality to a clear result button, which actually
will delete the entire result list, the code that we will need to write is going to be almost similar
to the code which we have written for clearing the question list before we start programming this button.
Again, I'm going to give you it as a task so that the video and try to do it on your own.
All right, so the first thing that we are going to do is to set events to listen to a clear result
button.
But before we do that, let's select this element.
Take a look on index dot file.
So here we have an admin panel section button element.
It has the ID results clear and so let's copy it.
And in items object add new property is going to be placed in admin panel elements.
Let's call it clear results can.
That's selected, right, documents that gets elements by ID and hastier ID.
Then go to controller module and attach to this element event, listener writes, selected items, then
clear results, PTM.
That that event listener.
Use your click events and also place your anonymous function.
All right, so the next step as a guest is to create a new method, which is going to be part of UI
controller module.
So that's right.
Clear results list.
And assigned to its anonymous function.
This function will receive one parameter we need to have access on person, local authority, so let's
place your user data.
And then in controller module, I'm going to invoke this function, so let's write inside anonymous
function UI controller DOT Carlier result list.
As an argument, we need to use your personal authority, so let's right, Chris Controller.
That's got person local authority.
All right, let's go back to our function.
So deleting the entire result list is important and at the same time, dangerous thing for admin because
he or she may lose the entire data accidentally just by one click on button.
So as it was in case of clear question, this function, we need somehow to warn admin about it.
And for that we have to use confirm method, which will warn admin by pop up message.
You know, that control method gives us two options.
Either proceed clicking on OK button or reject clicking on kastle.
So let's create a new variable and call it called.
Then assigned to it.
Confirm method.
The text that should the admin will be the following.
Warning.
You will lose entire rooms at least.
All right, so confirm method returns, boolean value, if we click on OK, then it will return.
True.
And in case of clicking on Kastle we will get false.
So we want to remove the entire data when confirmed returns.
True.
Therefore, we need to write if statement.
And then as a condition, we have to place here the variable cost.
So if this condition is true, then we need to delete the data for that, let's use remove personal
data method.
So it's right use of data.
That remove personal data.
After the looting, there is at least we need to clear the entire result, at least the rapper.
So for that that's right.
You dump items that results with rapper.
Danus in GML.
Which equals two empty quotes.
All right, let's go to the browser and at first login as user, right, McDo.
And then answer the questions.
And after finishing the quiz.
Let's log in again, but as another user, the right merrett wrong.
Then do the quiz again.
And then in order to get on admin panel, let's login as admin, right, John Smith.
So here we have two results for Nick and Mary, let's click on Clear Button.
So we got a message which warns us that we will lose entire result, click on OK and see that result
least is a..
Let's go to application and check the local storage.
You say that personal data is deleted.
All right, let's look out and do decrease by user again.
So right now.
That answered the questions.
And finish the quiz.
Then again, log in as admin rights John Smith.
In this case, let's click on delete button.
So you see that the result is deleted.
Then again, click on clear results and regardless of that, we do not have any more results.
We still got confirmed message.
Actually, we don't need it.
And in order to fix that, we need another if statements in which as a condition, we will insert the
length of personal data to be greater than zero.
So right here, if and then the condition user data.
That gets personal data.
That length.
Is greater than zero.
All right, let's go to Browsr again and logging as user rights, Mary Brown.
Answer the questions.
Then go to Atzmon panel, so for that log-in as John Smith.
Deliver the results using delete button, then click on Clear Results button and you see that it works
because we didn't get again confirmed message.
All right, it seems that everything works properly and nicely, but we still have one little problem.
Let's login as McDo.
And then do the Chris.
Then did the same buy another user, writes Mary Brown.
Then after finishing it, go to admin panel.
So we have year two results, let's click on Clear Results Bottom so they are related, then again,
click on the same button and see that we got an error, which tells us that JavaScript engine cannot
read the links property of.
Now, this is no error for us.
We have got it several times.
So in order to fix that, we need to write another statement and also wrap the code with its curly braces.
Write it then as a condition.
Right, user data.
That gets personal data.
Not equals to No.
All right, let's finally test how this works in as a user, right, Mary Brown?
And answer the questions.
Then check admin panel, so that's right here, John Smith.
Click on Carlier Button.
So the result is deleted, then click again on Clear Button, and we do not have any errors.
Everything works fine.
And finally we can say that building our application is finished.
Congratulations, I want to say thank you for being with me till the end of this project, so you have
built this nice up, I can guarantee you that this is the app which you can use in real life.
You can feel free and show it to your friends or family members.
And the most important thing is that you got huge knowledge in JavaScript from building this advanced
project.
You're able to use this knowledge in the future to build similar or even more advanced projects.
Besides that, you can feel free and add some more features to this application and improve it.
For example, you can set a timer, defined the amount of time from admin panel and then the user should
do the squeeze.
During this time.
You can also place results by ascending or descending order and so on.
If you do it, do not forget to share it with us.
Will be glad and thankful.
All right, let's move on.