Use CheckBoxes to implement Mentor/Mentee Dropdown

[YoshithaRathnayake]

Purpose

The purpose of this PR is to fix #1576

Goals

Adding CheckBoxes to implement Mentor/Mentee Dropdown

Approach

I added CheckBoxes to implement Mentor/Mentee Dropdown

Screenshots

Mentors

Mentees

Preview Link

https://pr-1579-sef-site.surge.sh/scholarx/archive

Checklist

• [x] I have read and understood the development best practices guidelines
• [x] I have performed a self-review of my own code
• [x] I have commented my code, particularly in hard-to-understand areas

Related PRs

## Learning

[janithlahirukariyawasam]

@YoshithaRathnayake

1. we have to show the university filter on the mentee's side and the industry filter on the mentors' page.

2. think that you have already selected the mentor's checkbox, when you select the mentee's checkbox again we should uncheck the mentor's checkbox. every time there needs to be just only one selection from these two checkboxes. (you can't select both two checkboxes at the same time)

3. Also we need to use the same checkboxes theme that we used to other checkboxes.

[YoshithaRathnayake]

@janithlahirukariyawasam I change the checkbox but I can't click it can you tell me what is that error please?

[janithlahirukariyawasam]

@janithlahirukariyawasam I change the checkbox but I can't click it can you tell me what is that error please?

It is little bit hard to understand because you have used the prettier. But I think this is a conflict that occurs as a result of a id issue. Can you check the unique ids you gave to the checkboxes with relevant js code.

[YoshithaRathnayake]

@janithlahirukariyawasam I change the checkbox but I can't click it can you tell me what is that error please?

It is little bit hard to understand because you have used the prettier. But I think this is a conflict that occurs as a result of a id issue. Can you check the unique ids you gave to the checkboxes with relevant js code.

Sure and I found the method to that problem (you can't select both two checkboxes at the same time)

[YoshithaRathnayake]

Now it's ok right? no problems? @janithlahirukariyawasam

[janithlahirukariyawasam]

You have fixed a lot of issues @YoshithaRathnayake but when we load this page for the first time both mentor & mentee pages will appear. So you have to fix it.

[YoshithaRathnayake]

You have fixed a lot of issues @YoshithaRathnayake but when we load this page for the first time both mentor & mentee pages will appear. So you have to fix it.

Ah yes so which one I should show when loading for the first time mentors or mentees? mentors right? @janithlahirukariyawasam

[janithlahirukariyawasam]

@YoshithaRathnayake It needs to be mentors

You can run a code that checks the mentor checkbox when you load this page every time.

[YoshithaRathnayake]

@YoshithaRathnayake It needs to be mentors

You can run a code that checks the mentor checkbox when you load this page every time.

It has already given a display none to the mentee page but its not hiding why is that?

[janithlahirukariyawasam]

@YoshithaRathnayake almost finished! there is a function called loadData(), You have to write a code line to check the mentor checkbox

[YoshithaRathnayake]

@YoshithaRathnayake almost finished! there is a function called loadData(), You have to write a code line to check the mentor checkbox

I did now its checked when loading the page Check now but mentee page still there @janithlahirukariyawasam

[janithlahirukariyawasam]

@YoshithaRathnayake almost finished! there is a function called loadData(), You have to write a code line to check the mentor checkbox

I did now its checked when loading the page Check now

let put this code after underlined code. document.getElementById('mentorsCheckbox').checked = true;

[YoshithaRathnayake]

Sure but that mentee page is still visible when loading @janithlahirukariyawasam Is there a solution for that @janithlahirukariyawasam

[janithlahirukariyawasam]

Sure but that mentee page is still visible when loading @janithlahirukariyawasam

$("#showMentees").hide() can you put this to loadData() function also. @YoshithaRathnayake

[YoshithaRathnayake]

There is a display: block; in the html code but I can't find it on the real code. If I can remove that the problem will solve definitely @janithlahirukariyawasam

[YoshithaRathnayake]

Sure but that mentee page is still visible when loading @janithlahirukariyawasam

$("#showMentees").hide() can you put this to loadData() function also. @YoshithaRathnayake

Yes I added it after the document.getElementById('mentorsCheckbox').checked = true; but it didn't work @janithlahirukariyawasam

[janithlahirukariyawasam]

Sure but that mentee page is still visible when loading @janithlahirukariyawasam

$("#showMentees").hide() can you put this to loadData() function also. @YoshithaRathnayake

Yes I added it after the document.getElementById('mentorsCheckbox').checked = true; but it didn't work @janithlahirukariyawasam In CSS file can you add !important like this and check it again @YoshithaRathnayake Check what happen after you select Mentees Checkbox also?

[YoshithaRathnayake]

Sure but that mentee page is still visible when loading @janithlahirukariyawasam

$("#showMentees").hide() can you put this to loadData() function also. @YoshithaRathnayake

Yes I added it after the document.getElementById('mentorsCheckbox').checked = true; but it didn't work @janithlahirukariyawasam In CSS file can you add !important like this and check it again @YoshithaRathnayake Check what happen after you select Mentees Checkbox also?

Output when doing like that I think we have to remove it from the js @janithlahirukariyawasam

[janithlahirukariyawasam]

@YoshithaRathnayake Yes

[janithlahirukariyawasam]

@YoshithaRathnayake like this, there are lot of places we have to do the changes in function.js. That will solve this issue

[YoshithaRathnayake]

@YoshithaRathnayake like this, there are lot of places we have to do the changes in function.js. That will solve this issue

so I should put hide to every $("#showMentees") codes in the functions.js file? @janithlahirukariyawasam

[janithlahirukariyawasam]

[janithlahirukariyawasam]

@YoshithaRathnayake there is function call renderProfiles() in that you have to do a change.

[YoshithaRathnayake]

Now it's ok right? @janithlahirukariyawasam

[janithlahirukariyawasam]

Now it's ok right? @janithlahirukariyawasam

Good Job @YoshithaRathnayake ! Now it is fine.

[YoshithaRathnayake]

Now it's ok right? @janithlahirukariyawasam

Good Job @YoshithaRathnayake ! Now it is fine.

Thanks @janithlahirukariyawasam for helping me