Lägga till anpassad JavaScript till ett formulär
Anteckning
Från och med den 12 oktober 2022 byter Power Apps-portaler namn till Power Pages. Mer information: Microsoft Power Pages är nu allmänt tillgänglig (blogg)
Vi kommer snart migrera och sammanfoga dokumentationen för Power Apps-portaler med Power Pages-dokumentationen.
Såväl stegposten grundläggande formulär som stegposten flerstegsformulär innehåller ett fält kallat Anpassat JavaScript som kan användas för att lagra JavaScript-kod så att du kan utöka eller ändra formulärets visning eller funktion.
Det anpassade blocket med JavaScript kommer att läggas till längst ned på sidan precis före det avslutandet formulärtaggelementet.
Formulärfält
Indata-ID för HTML för ett tabellfält anges till det logiska namnet på attributet. Välja fält, inställningsvärden eller annan klientmanipulering med hjälp av jQuery.
$(document).ready(function() {
$("#address1_stateorprovince").val("Saskatchewan");
});
Viktigt
Om du lägger till en alternativkolumn i ett modellbaserat formulär som ska användas i ett steg för flerstegsformulär eller ett grundläggande formulär, visas denna som serverkontroll via listrutan på portalsidan. Om du använder eget JavaScript för att lägga till ytterligare värden i kontrollen får meddelandet "Ogiltigt återskickande- eller motringningsargument" när sidan skickas.
Ytterligare klientfältvalidering
Ibland kan du behöva anpassa verifieringen av fält i formuläret. Exemplet tvingar användaren att ange ett e-postmeddelande endast om ett annat fält för "föredragen kontaktmetod" anges som E-post.
Anteckning
Verifiering på klientsidan stöds inte i ett underrutnät.
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 = "emailaddress1Validator";
newValidator.controltovalidate = "emailaddress1";
newValidator.errormessage = "<a href='#emailaddress1_label' referencecontrolid='emailaddress1 ' onclick='javascript:scrollToAndFocus(\"emailaddress1 _label\",\" emailaddress1 \");return false;'>Email is a required field.</a>";
newValidator.validationGroup = ""; // Set this if you have set ValidationGroup on the form
newValidator.initialvalue = "";
newValidator.evaluationfunction = function () {
var contactMethod = $("#preferredcontactmethodcode").val();
if (contactMethod != 2) return true; // check if contact method is not 'Email'.
// only require email address if preferred contact method is email.
var value = $("#emailaddress1").val();
if (value == null || value == "") {
return false;
} else {
return true;
}
};
// Add the new validator to the page validators array:
Page_Validators.push(newValidator);
});
}(window.jQuery));
}
Allmän validering
Om du klickar på knappen Nästa/Skicka kommer en funktion kallad entityFormClientValidate att köras. Du kan utöka den här metoden om du vill lägga till anpassad verifieringslogik.
if (window.jQuery) {
(function ($) {
if (typeof (entityFormClientValidate) != 'undefined') {
var originalValidationFunction = entityFormClientValidate;
if (originalValidationFunction && typeof (originalValidationFunction) == "function") {
entityFormClientValidate = function() {
originalValidationFunction.apply(this, arguments);
// do your custom validation here
// return false; // to prevent the form submit you need to return false
// end custom validation.
return true;
};
}
}
}(window.jQuery));
}