AppGini Community Forums

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

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

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

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/



Best,
Jan

Hi Jan,

thank you.
Olaf

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 wrote: ↑

2020-03-15 17:04

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.

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

Will do. Thank you Jan.

David

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.
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

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

jangle wrote: ↑

2020-03-24 17:22

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?

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();
}
};