{"id":4476,"date":"2017-01-12T16:37:58","date_gmt":"2017-01-12T15:37:58","guid":{"rendered":"https:\/\/mind-force.de\/?p=4476"},"modified":"2024-07-10T11:11:09","modified_gmt":"2024-07-10T09:11:09","slug":"javascript-remoting-in-visualforce","status":"publish","type":"post","link":"https:\/\/mind-force.de\/it\/javascript-remoting-in-visualforce\/","title":{"rendered":"JavaScript Remoting in Visualforce: Ein Code-Beispiel"},"content":{"rendered":"\n

JavaScript Remoting ist eine Möglichkeit von einer Visualforce-Seite aus Datenbankaufrufe auszuführen und zu verarbeiten. In seiner Funktionalität ist es den Visualforce-Konstrukten <apex:form> und <apex:actionFunction> ähnlich, unterscheidet sich in der Handhabung jedoch stark von diesen. Wieso sollte ich mich also mit JavaScript Remoting beschäftigen?<\/p>\n

Wieso JavaScript Remoting?<\/h2>\n
In meinem aktuellen Kundenprojekt beschäftige ich mich zurzeit mit der Weiterentwicklung von Visualforce-Seiten<\/a>. Der Kunde ist sich noch nicht sicher, ab wann es sich für ihn lohnt, von Salesforce Classic auf Lightning<\/a> zu wechseln und eine Hindernis für den Wechsel stellen seine alten Visualforce Seiten dar. Die Seiten bestehen aus klassischen Konstrukten, wie <apex:inputField>, <apex:form> oder <apex:actionFunction> und besitzen damit Look-and-Feel der Salesforce Classic Seiten. Betrachte ich diese Seiten jedoch in der aktuellen Lightning Version von Salesforce, so haben diese weiterhin Salesforce Classic Optik oder verkommen gar zu einfachen Textseiten. Salesforce liefert hierfür zwar regelmäßig Updates, doch ist das Ganze noch nicht wirklich rund.<\/p>\n

Lightning Design System<\/h3>\n
Als Entwickler habe ich mich daher entschieden, die Visualforce-Seiten meines Kunden durch Standard HTML Konstrukte zu ersetzen und mit JavaScript Funktionen zu erweitern. Salesforce bietet hierfür kostenfrei das Lightning Design System (Link<\/a>) an, mit welchem Visualforce-Seiten mit Standard HTML Elementen wie Lightning Standard Seiten aussehen. Der im Vergleich zur alten Visualforce Seite gestiegene Entwicklungsaufwand wird hierbei durch höhere Flexibilität und einen größeren Grad der Anpassung ausgeglichen. Visualforce-Seiten können tatsächlich aussehen wie moderne Webseiten! Aber können Sie sich auch so verhalten?<\/p>\n

Problemstellung<\/h2>\n
Was mich anfangs immer wieder vor Probleme und lästige Bugs gestellt hat, waren die Datenbankaufrufe über den Controller. Hier mal ein Beispiel: Ich benötige eine Funktion, mit der ich die Opportunities massenhaft absagen möchte. Ich habe eine Tabelle mit einer Reihe von Opportunities und möchte diese per Checkbox markieren und danach über einen Buttonclick auf den Status “Closed Lost” setzen. Hierzu habe ich eine Funktion im Controller, die eine Liste von Ids und einen neuen Status entgegennimmt.<\/p>\n
Bediene ich mich der <apex>-Konstrukte so müsste ich als erstes eine <apex:actionFunction> definieren, die diese Funktion im Controller aufruft und zusätzlich noch zwei <apex:param> hinzufügen, die die eingetragenen Werte an Variablen im Controller übergeben. Um auch nur die Ids der Opps zu übertragen, welche ich auch angeklickt habe, benötige ich zusätzlich noch etwas JavaScript. Damit ich das Ganze dann auch automatisch zur Anzeige bringe, benötige ich einen zusätzlichen Rerender-Befehl oder muss die Seite neu laden.<\/p>\n

Lösungsvorschlag<\/h2>\n
Oder ich löse das Problem allein über eine statische Funktion im Controller und einem Javascript-Befehl auf meiner Visualforce-Seite. Und so sieht das dann aus:<\/p>\n
$\"JavaScript$ <\/a>
JavaScript Remote Call (Klicken zum Vergrößern)<\/p><\/div>\n
$\"Controller$ <\/a>
Controller Remote Action (Klicken zum Vergrößern)<\/p><\/div>\n
Es ist zu beachten, dass die Funktion des Controllers statisch ist und mit der Annotation “@RemoteAction” gekennzeichnet wird. Daraufhin kann ich eine JavaScript-Funktion definieren, welche über die Syntax Controllername.Funktionsname(Parameter 1, Parameter 2, …, Callback Funktion)<\/em> diese Funktion aufruft (Salesforce HowTo<\/a>).<\/p>\n
$\"Unser$ <\/div>
OnePager: Was ist Salesforce Visualforce?<\/h3><\/div>
\n\t\t\t\t\tSalesforce Visualforce ist ein Mix aus HTML, Tags, Apex und Javascript. Aber was genau k\u00f6nnen Sie damit tun?\t\t\t\t<\/p><\/div><\/div>
Jetzt anfordern<\/a><\/div><\/div>
OnePager: Was ist Salesforce Visualforce?<\/h3>