Hide Field w/Condition

[dharbitindy]

I'm looking for a way to use the Hide Field with a condition from a Radio Button(s) For example;
I have a field called use_purch with 2 options being Used and Purchased via Radio Button. Tiny Text is the data type.
Next, I have 2 fields below that and one is (no_of_used) and the other is (no_of_purch). Both of these are decimal type.

If Condition (Radio Button Selected = "Used")

new AppGiniField("no_of_purch").hide();

else Condition (Radio Button Selected = "Purchased")

new AppGiniField("no_of_used").hide();

Thank you,
David

[onoehring]

Hi Jan,

I would be interested in this as well, as it would be very useful for hiding dependent lookup fields if nothing has been selected in the first field.

Olaf

[jsetzer]

Hi,

for lookups this is not a problem using AGH JS library:
https://appgini.bizzworxx.de/appgini-he ... p-changes/

There is also an article about checkboxes:
https://appgini.bizzworxx.de/appgini-he ... box-click/

But David has asked for radio buttons. Radio buttons are different from HTML/JS point of view.

I have answered his PM to me and requested some more details about the specific field configuration before I can setup a testing project and write another article about radio buttons. Please see next post. I have written an article explaining how to react to radio button changes.

Best,
Jan

[jsetzer]

Hi,

after some research I can confirm that our onChange-handler should work for radio buttons, too.

I have written a short article about hiding/showing other fields depending on the selection of radio buttons (options lists):
https://appgini.bizzworxx.de/appgini-he ... selection/

yFS49aMFW6.gif (36.86 KiB) Viewed 7161 times

Best,
Jan

[onoehring]

Hi Jan,

thank you.
Olaf

[dharbitindy]

Hi Jan,

Thank you. The only issue now is that when I click Save Changes, both fields re-appear. This is code for my situation below;

new AppGiniDetailView().ready(onReady);

function onReady() {
new AppGiniField("use_purch").onChange(onUsePurchChanged);
}

function onUsePurchChanged(value) {
console.log("use_purch changed: " + value);
new AppGiniField("no_of_used").show(value=='Used');
new AppGiniField("no_of_purchased").show(value=='Purchased');
}

[dharbitindy]

Hi Jan,

Thank you. The only issue now is that when I click Save Changes, both fields re-appear. This is code for my situation below;

new AppGiniDetailView().ready(onReady);

function onReady() {
new AppGiniField("use_purch").onChange(onUsePurchChanged);
}

function onUsePurchChanged(value) {
console.log("use_purch changed: " + value);
new AppGiniField("no_of_used").show(value=='Used');
new AppGiniField("no_of_purch").show(value=='Purchased');
}

Nonetheless, this part works great! Thanks again Jan.

[jsetzer]

You will have to initially get the value and hide your fields on dv.ready.

Please study the three articles I have written and mentioned above. The necessary code has been explained there. Have a look at step 4 of the checkbox example.

Best,
Jan

[dharbitindy]

Will do. Thank you Jan.

David

[jangle]

Hello all,

So I have my four radio buttons - "None", "Airline", 'Rental Car", Personal Car"

I have several fields the hide or show based on the button selection based on the following in my JS file.

Code: Select all

new AppGiniDetailView().ready(onReady);

function onReady() {
    new AppGiniField("Travel_Means").onChange(onTravel_MeansChanged);   
}

function onTravel_MeansChanged(value) {
    console.log("Travel Means changed: "  + value);
    new AppGiniField("Airline").show(value=='Airline'); 
    new AppGiniField("Airport").show(value=='Airline');
    new AppGiniField("Flight_No").show(value=='Airline'); 
    new AppGiniField("Flight_Arrival_Time").show(value=='Airline');
    new AppGiniField("Rental_Car_Company").show(value=='Rental Car');

So as some of you have mentioned I would like it to work on the page load.

I have reviewed Jan's articles as suggested, but need a little kick start, as I did not understand some of what was in the articles.

Thanks!!

Jim

[jsetzer]

You are very close. Call onTravel_MeansChanged(value) in your onReady function.

[henryejune]

Hello all,

So I have my four radio buttons - "None", "Airline", 'Rental Car", Personal Car"

I have several fields the hide or show based on the button selection based on the following in my JS file.

Code: Select all

new AppGiniDetailView().ready(onReady);

function onReady() {
    new AppGiniField("Travel_Means").onChange(onTravel_MeansChanged);   
}

function onTravel_MeansChanged(value) {
    console.log("Travel Means changed: "  + value);
    new AppGiniField("Airline").show(value=='Airline'); 
    new AppGiniField("Airport").show(value=='Airline');
    new AppGiniField("Flight_No").show(value=='Airline'); 
    new AppGiniField("Flight_Arrival_Time").show(value=='Airline');
    new AppGiniField("Rental_Car_Company").show(value=='Rental Car');

So as some of you have mentioned I would like it to work on the page load.

I have reviewed Jan's articles as suggested, but need a little kick start, as I did not understand some of what was in the articles.

Thanks!!

Jim

Did you solve the problem when page load?

[henryejune]

I solved it with outside help!
var1: "work" (radio buttons: "yes" or "not")
var 2: "type"
Condition:
If "yes" in the button selection of "work" var then show "type" var else hide "type" var.

code:

new AppGiniFields(["type"]).hide();

function onReady() {
new AppGiniField("onworkChanged").onChange(onworkChanged(field));
new AppGiniField("work").onChange(onworkChanged);
new AppGiniField("onworkChanged").getValue("work");
var field = new AppGiniField('work').getValue();
onworkChanged(field)
};

function onworkChanged(value) {
if(value=='yes'){
new AppGiniField("type").show();
}
else{
new AppGiniField("type").hide();
}
};