Validation on form field (radio button)

(0) Share

Report

Posted on by Community Power Pla... Microsoft Employee

Hey,

I want to get a validation on a form field typ radio button. It is about the Terms of use (schema name: termsofuse).

I want that the form can only be submitted if the radio button is checked with yes (value: 1).

Could anyone assist my with this? I know there is a javascript validation for it, yet i am not sure how to implement it correctly/modify it.

Thanks!

Categories:

Power Apps portals

I have the same question (0)

All responses (5)

Answers (1)

Sort by

ragavanrajan 7,044 Most Valuable Professional on at

Like (0)

Report
Copy link

Link copied!

Hi @Anonymous

Try making it as required field. This will throw a validation error to user when they try to submit it.

Hope it helps.

------------

If you like this post, give it a Thumbs up. Where it solved your request, Mark it as a Solution to enable other users to find it.

Was this reply helpful? Yes No
Community Power Pla... Microsoft Employee on at

Like (0)

Report
Copy link

Link copied!

@ragavanrajan Hey but then I could submit the form if the radio button value "no" is selected or? and that the form only gets submitted when selecting yes

Was this reply helpful? Yes No
Verified answer

oliver.rodrigues 9,482 Most Valuable Professional on at

Like (0)

Report
Copy link

Link copied!

This article should help you to add a form validator: Add custom JavaScript - Power Apps | Microsoft Docs

if you can't get it working, please post your code here or on a new thread and we can see what might be missing

Was this reply helpful? Yes No
Community Power Pla... Microsoft Employee on at

Like (0)

Report
Copy link

Link copied!

Hi @OliverRodrigues

Hey that would be my code:

if (window.jQuery) {
(function ($) {
$(document).ready(function () {
if (typeof (Page_Validators) == 'undefined') return;
// Create new validator
var newValidator = document.createElement('span');
newValidator.style.display = "none";
newValidator.id = "termsofuseValidator";
newValidator.controltovalidate = "termsofuse";
newValidator.errormessage = "<a href='#termsofuse_label'>Terms of use needs to be selected with "Yes" </a>";
newValidator.validationGroup = ""; // Set this if you have set ValidationGroup on the form
newValidator.initialvalue = "";
newValidator.evaluationfunction = function () {
var termsofuse= $("#termsofuse").val();
if (termsofuse != 1) return true; // check if terms of use radio button is selected with No (value 0).

return false;
} else {
return true;
}
};
//Not sure what this is for
// Add the new validator to the page validators array:
Page_Validators.push(newValidator);
-
// Wire-up the click event handler of the validation summary link
$("a[href='#emailaddress1_label']").on("click", function () { scrollToAndFocus('emailaddress1_label','emailaddress1'); });
});
}(window.jQuery));

Basically I need that the form is only sendable if:
Yet I am not sure how to write or modify the javascript validation properly to achieve this

Was this reply helpful? Yes No
Community Power Pla... Microsoft Employee on at

Like (1)

Report
Copy link

Link copied!

Hi! Quick update! I did sove it. Did not use the right id´s

$(document).ready(function() {

    removeValidator("termsofuse_1");
    $("#termsofuse_1").parent().prev().removeClass('required');

    // Add event validator
    if (typeof(Page_Validators) == 'undefined') return;

        // Create new validator
        var newValidator = document.createElement('span');
        newValidator.style.display = "none";
        newValidator.id = "termsofuseValidator";
        newValidator.controltovalidate = "termsofuse_1";
        newValidator.errormessage = "<a href='#termsofuse_label'>Bitte akzeptieren Sie die Nutzungsbediengungen.</a>";
        newValidator.evaluationfunction = function() {

        if($("#termsofuse_1").is(':checked'))
        {
            return true;
        }
        else
        {
            if ($('#termsofuse_1').val() == "1") {
                return false;
            } else {
                return true;
            }
        }
    };
    Page_Validators.push(newValidator);
})

function removeValidator(fieldName) {
var count = 0;
for(var i =0; i < Page_Validators.length - count; i++){
if (Page_Validators[i - count].id == "RequiredFieldValidator" + fieldName) {
Page_Validators.splice(i - count, 1);
count++;
}
}
$("#" + fieldName + "_label").parent().removeClass("required");
}

Thanks!

Was this reply helpful? Yes No