Form using more than one service – Ofbiz 18.12

I have a form to create and update a client entity, the field for the name is supposed to search in the entity, make autocompletion and if it finds a match, it is supposed to place the results to the other fields in the form for the client.

I defined a service using java code to create and update the client, this one works fine, to generate this other service I was trying to use javascript and groovy, but I don’t fully understand how to do this other service. I don’t understand well how to handle more than one service for the same form. The way I tried is, my form is calling the service to create and update the client, and my field is calling the other service.

Also, I have downloaded JQuery to use my .js script, but I can’t find the right version, I keep getting an error. I have tried with the latest one (1.14.1,), and others (1.13.1, 1.12.1, 1.7, …)

javascript Error

The form uses the createClient service to update and add a client (this one works) :

<form name="clientForm" default-entity-name="Client" target="createClient">
        <field name="editModeClient" title=" ">
            <radio>
                <option key="create" description="ADD"/>
                <option key="update" description="UPDATE"/>
            </radio>
        </field>
        <field name="nameClient" title="VALIDATE CLIENT" entity-name="Client" service-name="getClientDetails">
            <text size="50"/>
        </field>
        <field name="prefixClient" title="PREFIX">
            <text read-only="true" default-value="TEST" size="3"/>
        </field>
        <field name="typeRClient" title="TYPE R" >
            <drop-down allow-empty="false">
                <entity-options
                        entity-name="TypeRS"
                        key-field-name="typeRSId"
                        description="[${typeRSId} ${typeRSDesc}]">
                </entity-options>
            </drop-down>
        </field>
        <field name="rSClient" title="RS>
            <text client-autocomplete-field="false" size="50"/>
        </field>
        <field name="nameComClient" title="NCOM">
            <text client-autocomplete-field="false" size="50"/>
        </field>
        <field name="rfClient" title="RF">
            <text client-autocomplete-field="false" size="10"/>
        </field>
        <field name="phone" title="PHONE">
            <text client-autocomplete-field="false" size="15"/>
        </field>
        <field name="email" title="EMAIL">
            <text client-autocomplete-field="false" size="25"/>
        </field>
        <field name="cClient" title="C">
            <text client-autocomplete-field="false" size="40"/>
        </field>
        <field name="Save" title="SAVE">
            <!--<submit button-type="submit"/>-->
            <submit button-type="button"/>
        </field>
    </form>

The field nameClient uses the service getClientDetails to handle the search for the field, this is the one I’m having problems:

<service name="getClientDetails" engine="groovy"
             location="component://mycomponent/groovyScripts/ClientServices.groovy"
             invoke="getClientDetails" auth="true">
        <description>Get client details by name</description>
        <attribute name="searchTerm" type="String" mode="IN" optional="false"/>
        <attribute name="clientList" type="List" mode="OUT" optional="false"/>
    </service>

The request :

<request-map uri="getClientDetails">
        <security https="true" auth="true"/>
        <event type="service" invoke="getClientDetails"/>
        <response name="success" type="request" value="json"/>
        <response name="error" type="request" value="json"/>
    </request-map>

The groovy code:

import org.apache.ofbiz.entity.GenericValue
import org.apache.ofbiz.entity.util.EntityQuery
import org.apache.ofbiz.entity.util.EntityOperator

def getClientDetails(Map context) {
    Map result = [:]
    String searchTerm = context.searchTerm

    try {
        List<GenericValue> clientList = EntityQuery.use(delegator)
                .from("Client")
                .where(EntityCondition.makeCondition("nameClient", EntityOperator.LIKE, "%" + searchTerm + "%"))
                .queryList()

        result.clientList = clientList
    } catch (Exception e) {
        return error("Error getting client details: ${e.message}")
    }

    return result
}

The javascript code:

$(document).ready(function() {
    $("#nameClient").on("input", function() {
        var searchTerm = $(this).val();
        $.ajax({
            url: "getClientDetails",
            data: { searchTerm: searchTerm },
            type: "POST",
            success: function(response) {
                // ... (rest of your AJAX handling code) ...
            },
            // ...
        });
    });
})

So, can anyone help me to understand how to perform more than one service in a form?, is it better to try a .ftl file for the form and handle everything there?, and how to get the functionality described before?. Apologies, a lot of questions but I have not found the answers,Thanks!