Change Text Input and Dropdown with a number value based on dropdown selection

Ask the community
,
1

It’s my very first question on this site and of course I am totally new to Wix.
I have set up a few things on my website but I could not achieve the result as I expected.

I have three dropdown and a text input.
When I change the value in dropdown1 the values of dropdown2 changes. When I change the value of dropdown2 the value of dropdown3 changes only when I fetch the value which is of type text but not when value of type number. What I want in my dropdown3 is numbers from my database, only for test purpose I used a text field.
Also when I change the value in dropdown2 I want the input field also get changed. which doesn’t happen at all, neither was there any errors.

Everything I did is based on the tips from various tutorial and hence I am not sure if this is how it should be done.

Following is my code.

Note:
I used input text instead of text view because I want this field to show data based on the dropdown selection as well as enable users change value if they want.

Thanks in advance.

import wixData from 'wix-data';

$w.onReady(function () {

    uniqueBroker();

});

function uniqueBroker() {

    wixData.query("BrokerCharges")

        .limit(1000)

        .find()

        .then(results => {

 const uniqueTitles = getUniqueTitles(results.items);

            $w("#dpdBr").options = buildOptions(uniqueTitles);

        });

 function getUniqueTitles(items) {

 const titlesOnly = items.map(item => item.brokerName);

 return [...new Set(titlesOnly)];

    }

 function buildOptions(uniqueList) {

 return uniqueList.map(curr => {

 return { label: curr, value: curr };

        });

    }

}

export function dpdBr_change(event, $w) {

    uniqueOrderType();

    $w("#dpdOrderType").enable();

}

function uniqueOrderType() {

    wixData.query("BrokerCharges")

        .contains("brokerName", $w("#dpdBr").value)

        .limit(1000)

        .find()

        .then(results => {

 const uniqueTitles = getUniqueTitles(results.items);

            $w("#dpdOrderType").options = buildOptions(uniqueTitles);

        });

 function getUniqueTitles(items) {

 const titlesOnly = items.map(item => item.orderType);

 return [...new Set(titlesOnly)];

    }

 function buildOptions(uniqueList) {

 return uniqueList.map(curr => {

 return { label: curr, value: curr };

        });

    }
}

export function dpdOrderType_change(event, $w) {

    uniqueCommission();
    uniqueCommission2();

    $w("#dpdCommission").enable();

}

function uniqueCommission() {

    wixData.query("BrokerCharges")

        .contains("orderType", $w("#dpdOrderType").value)

        .limit(1000)

        .find()

        .then(results => {

 const uniqueTitles = getUniqueTitles(results.items);

            $w("#dpdCommission").options = buildOptions(uniqueTitles);

        });

 function getUniqueTitles(items) {

 const titlesOnly = items.map(item => item.label);

 return [...new Set(titlesOnly)];

    }

 function buildOptions(uniqueList) {

 return uniqueList.map(curr => {

 return { label: curr, value: curr };

        });

    }

}

//export function tripSelection_change(event,$w) {
function uniqueCommission2() {
    $w("#iptCommission").enable();

    wixData.query("BrokerCharges")
        .eq("orderType", $w('#dpdOrderType').value)
        .find()
        .then((results) => {
 if (results.item.length > 0) {
 let firstItem = results.items[0];
                $w('#iptCommission').value = firstItem.one;
                console.log(results.items);
            } else {
                $w('#iptCommission').value = "0.00";
            }
        })
        .catch((err) => {
 let errorMsg = err;
        });
}
2

I fix it.
The issue I had was with uniqueCommission2() function, the very last function in my code. That was my only concern, other parts of the code was given to you so that you can see the how I set the whole things up.

How I fixed it is replacing the entire uniqueCommission2() with the following.

I had to remove the if… then… conditions to work this.
Also, I added following one line of code in the function as input text value will be based on two filters (dropdowns)

However, I still do not know what is the mistake in my previous function and why if… then… did not work. If somebody know the reason then please let me know.

.eq("brokerName", $w('#dpdBr').value)


function uniqueCommission2 () {
wixData.query("BrokerCharges")
.eq("orderType", $w('#dpdOrderType').value)
.eq("brokerName", $w('#dpdBr').value)
.find()
.then( (results) => {
$w('#iptCommission').value = results.items[0].intraday;
//console.log(results.items);
})
.catch( (err) => {
 let errorMsg = err;
});
}