cancel
Showing results for 
Search instead for 
Did you mean: 
Reply
PortalNewbie
Helper II
Helper II

Need help with Complex Cascading Dropdowns

Hi

I have a complex scenario and I was wondering if someone can point me in the right direction on how to proceed on this.

 

I have a dropdown field called "Criteria". This lists about 7 different criteria.

I have a lookup field (rendered as dropdown) called criteria questions. This is a lookup to a table called 'Criteria Questions' which has a list of questions for all criteria. Assume 10 questions for each criteria, so this table has approx 70 records.

 

I have another lookup field (again rendered as dropdown) called responses. This is a lookup to a table called 'Criteria Responses' which has list of respones for each possible question. Assume 4 responses for each question, so this table has around 280 rows.

 

This is what I want to achieve:

When a criteria is chosen, I want to reset the Criteria questions dropdown to show only the questions pertaining to that criteria. Responses dropdown should be blank.

Once a criteria question is chosen, the responses should filter to show only the 4 responses for the criteria question.

 

I followed this article:
https://www.dancingwithcrm.com/custom-lookup-filtering-powerapps-portal/

and was able to filter the criteria questions dropdown to show only the questions relevant to the chosen criteria. Till this point everything is fine. 

My issue is this:
When I am loading an existing record with the criteria, criteria questions and responses already filled out, because I am recreating the dropdowns (lookup rendered as dropdown), the existing value on the record gets wiped out. If I do not clear out the dropdowns, they show all 70 and 280 records, which is incorrect.

 

Is there any way to load the record, apply the filter at the backend and show the already chosen respones?


I tried copying existing values from the field and applying them back again, but here I got stuck in another issue. For some reason I am not able to repopulate the option set. This is my code:


CODE TO STORE CURRENT VALUE IN THE LOOKUP (RENDERED AS DROPDOWN) - NOT WORKING AS INTENDED
var currentGUID = $("#new_criteriaquestion").val();  -- this returns the guid correctly
var currentText = $("#new_criteriaquestion_name").val();   --- this returns "undefined"
var currentEntity = $("#new_criteriaquestion_entityname").val(); -- this returns the entity name correctly.


CODE TO FILTER CRITERIA QUESTIONS BASED ON CRITERIA AND RECREATE FILTERED DROPDOWN - WORKING
$.getJSON("/getCriteriaQuestions/?criteria=" + criteria, function (data)
{
if (data.results.length > 0)
{
let option = document.createElement("option");
option.value = "";
option.innerText = "";
$("#new_criteriaquestion").append(option);

//create option for each returned entity
data.results.forEach(element => {
let option = document.createElement("option");
option.value = element.GUID;
option.innerText = element.Name;
$("#new_criteriaquestion").append(option);
});
}
});

CODE TO REPOPULATE CURRENT VALUE IN THE LOOKUP (RENDERED AS DROPDOWN) - NOT WORKING AS INTENDED

$("#new_criteriaquestion_name").attr("value",currentText);
$("#new_criteriaquestion").attr("value",currentGUID);
$("#new_criteriaquestion_entityname").attr("value",currentEntity);

 

The code executes without any errors (except the part where new_criteriaquestion_name returns "undefined"), but I do not see the old value as the selected option on the dropdown.

What am I doing wrong, and is there a more elegant way of doing this ?

1 ACCEPTED SOLUTION

Accepted Solutions


@PortalNewbie wrote:

@hugobernier - I have fixed the field names in the original question. Thanks for pointing that out. However, my original problem still remains. How do I :
1. Get value (GUID) and label (Name) of a lookup field rendered as a dropdown using jquery/javascript

2. Set value of a lookup field rendered as a dropdown using jquery/javascript


selected-option-guid = $("#fieldname").val();
selected-option-text = $("#fieldname option:selected").text();

//set an option as selected
$("#fieldname ").find('option[value="guid goes here"]').attr('selected','selected')

View solution in original post

4 REPLIES 4
hugobernier
Administrator
Administrator

Hey @PortalNewbie thanks for posting the question.

 

Can you confirm that the field called "new_categoryquestion" is pointing to your Criteria field? Because your question talks about a Criteria, but your code uses Category.

 

Can you confirm that the fields your code is referring to actually exist on the page, by viewing your page source and looking for:
new_categoryquestion
new_categoryquestion_name

new_categoryquestion_entityname

 

If so, make sure that all fields you refer to are text inputs. If they are a select input, for example, you may want to use something like .children("option:selected").val()or something similar which is best suited for getting values from those types of inputs.

 

I hope this helps?

PortalNewbie
Helper II
Helper II

@hugobernier - I have fixed the field names in the original question. Thanks for pointing that out. However, my original problem still remains. How do I :
1. Get value (GUID) and label (Name) of a lookup field rendered as a dropdown using jquery/javascript

2. Set value of a lookup field rendered as a dropdown using jquery/javascript


@PortalNewbie wrote:

@hugobernier - I have fixed the field names in the original question. Thanks for pointing that out. However, my original problem still remains. How do I :
1. Get value (GUID) and label (Name) of a lookup field rendered as a dropdown using jquery/javascript

2. Set value of a lookup field rendered as a dropdown using jquery/javascript


selected-option-guid = $("#fieldname").val();
selected-option-text = $("#fieldname option:selected").text();

//set an option as selected
$("#fieldname ").find('option[value="guid goes here"]').attr('selected','selected')
PortalNewbie
Helper II
Helper II

@Fubar - Thank you . This worked perfectly.

Helpful resources

Announcements
Microsoft 365 Conference – December 6-8, 2022

Microsoft 365 Conference – December 6-8, 2022

Join us in Las Vegas to experience community, incredible learning opportunities, and connections that will help grow skills, know-how, and more.

Difinity Conference 2022

Difinity Conference 2022

Register today for two amazing days of learning, featuring intensive learning sessions across multiple tracks, led by engaging and dynamic experts.

European SharePoint Conference

European SharePoint Conference

The European SharePoint Conference returns live and in-person November 28-December 1 with 4 Microsoft Keynotes, 9 Tutorials, and 120 Sessions.

Users online (1,951)