ADXStudio Lookup Filtering - Filter DropDownList in ADXStudio

As we all know that ADXStudio has one of the intresting Out Of Box feature to Convert CRM Lookup into DropDownList on ADXPortal Entity Form, but the major limitation of this feature is, it stop filtering data if you have applied Lookup Filtering on CRM Lookups in CRM.

So if I want to Filter my two lookup fields on ADXStudio Portal Entity Form, It doesn't work if we will convert them into DropDownList using Entity Form Metadata. i tried to figure out so many alternatives ,Also asked on ADXStudio Community Forum, And I found its the Limitation of converting Lookup into DropDownList in ADXStudio. Hope will get the solution in next ADX release

So only solution that i came into my mind is to use DropDownList Filtering using JQuery in Entity Form to achieve the same.

Here what i was doing...

I had two Lookups on my CRM Case Entity Form (State and City) and I converted them into DropDownList using Entity Form Metadata.  And below is the code through which i filtered my City DropDownList based on State DropDownList:

We can write this JQuery in "Custom JavaScript" section of AdxStudio Entity Form in CRM.

<script type="text/javascript">
    $(function ()
    {
        
        var $state = $('#state');
        var $city = $('#city');

        var $cityList = $city.find('option').clone();

        var stateandcity =
        {
            MP: ["Gwalior", "Indore", "Bhopal", "Other"],
            UP: ["Noida", "Agra", "Lukhnow", "Other"],
            Mahrashtra: ["Nagpur", "Pune", "Mumbai", "Other"]
        }

        $state.change(function ()
        {
            var $selectedState = $(this).find('option:selected').text();
            $city.html($cityList.filter(function () {
                return $.inArray($(this).text(), stateandcity[$selectedState]) >= 0;
            }));
        });
    });
</script>

Here is the Output of the above Code: