> ## Documentation Index
> Fetch the complete documentation index at: https://api-docs.jarvi.tech/llms.txt
> Use this file to discover all available pages before exploring further.

# Enviar las candidaturas

> Esta API te permitirá enviar a Jarvi los candidatos de tu sitio web, de un formulario o de cualquier otra fuente.

Aquí están los pasos a seguir:

<Steps>
  <Step title="Obtener mis claves API">
    Si aún no tienes tus claves API, sigue los pasos en la sección{' '}
    <a href="../api-keys">Obtener mis claves API</a>
  </Step>

  <Step title="Descubrir la API">
    Consulta la documentación detallada de la <a href="../api-reference/applicants/post">API post applicants</a>. También te será útil entender el concepto de <a href="../custom-fields">Campos personalizados</a>
  </Step>

  <Step title="Inspírate en los ejemplos de integraciones">
    No eres el primero, tranquilo, y probablemente encontrarás a continuación ejemplos de integraciones
    similares a lo que deseas.

    <AccordionGroup>
      <Accordion title="Wordpress (quform)" icon="wordpress">
        Aquí tienes un ejemplo de integración con Wordpress utilizando el plugin QuForm para los formularios.

        ```php theme={null}
          add_action('quform_post_process_{ID_FORM}', function (array $result, Quform_Form $form){
              $file_content = file_get_contents( $this->attachments[ 0 ] );
              $file_base_64_content = base64_encode( $file_content );

              $data = [
                  'firstName' => $form->getValue('quform_{ID_FORM}_5'),
                  'lastName' => $form->getValue('quform_{ID_FORM}_7'),
                  'fullName' => $form->getValue('quform_{ID_FORM}_6') . ' ' . $form->getValue('quform_{ID_FORM}_7'),
                  'cb9d4872-bfaa-4c57-b1af-91c008883386' => $form->getValue('quform_{ID_FORM}_10'), // Poste
                  '17fe3ebf-3641-4a94-ac9f-f11a6d429107' => $form->getValue('quform_{ID_FORM}_31'), // Exp SaaS
                  '6b751e8d-3947-43f9-af52-1db532210c6d' => $form->getValue('quform_{ID_FORM}_12'), // 1e année CDI
                  'region' => $form->getValue('quform_{ID_FORM}_15'),
                  'linkedinUrl' => $form->getValue('quform_{ID_FORM}_17'),
                  'phoneNumbers' => $form->getValue('quform_{ID_FORM}_20'),
                  'emailAddresses' => $form->getValue('quform_{ID_FORM}_22'),
                  'resumesFiles' => [
                    [
                      'data' => $file_base_64_content,
                      'fileName' => $this->attachments[0]->file_name,
                    ],
                  ],
              ];

              wp_remote_post('https://functions.prod.jarvi.tech/v1/public-api/rest/v2/applicants', [
                  'body' => json_encode($data),
                  'headers' => array(
                      'Content-Type' => 'application/json',
                      'X-Api-Key' => '{JARVI_PRIVATE_API_KEY}'
                    ),
              ]);

              return $result;
          }, 10, 2);
        ```
      </Accordion>

      <Accordion title="Webflow (sin CV)" icon="webflow">
        Aquí tienes un ejemplo de integración en WebFlow. Esta integración también es válida para un sitio web clásico.

        <iframe width="560" height="315" src="https://www.loom.com/embed/5bd5bfc1cae84b1d8a572d976d4af397?sid=5c2ddafe-3399-4245-97c9-805e98eae2c5" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen />

        ```javascript theme={null}
          document.querySelector('#form-submit-button').addEventListener('click', function() {
              var formElement = document.querySelector('.inscription-candidat-form');
              var formData = new FormData(formElement);
              var formDataAsObject = {}

              for (var [key, value] of formData.entries()) {
                console.log(key, value);
                formDataAsObject[key] = value
              }

              if(!formDataAsObject.linkedinUrl) console.error("linkedinUrl is mandatory");

              const data = {
                  "referenceId":"PROJECT-REFERENCE-ID",
                  ...formDataAsObject
              }

              console.log("data to send",data)

              fetch('https://functions.prod.jarvi.tech/v1/public-api/rest/v2/applicants', {
                  method: 'POST',
                  mode:'cors',
                  headers: {
                    'Content-Type': 'application/json',
                    'X-Api-Key': 'JARVI_PUBLIC_API_KEY'
                  },
                  body: JSON.stringify(data)
              })
              .then(response => response.json())
              .then(data => console.log("data sent",data))
              .catch((error) => {
                  console.error('Error:', error);
              });
          });
        ```
      </Accordion>

      <Accordion title="Webflow (CON CV)" icon="webflow">
        Aquí tienes un ejemplo de integración en WebFlow. Esta integración también es válida para un sitio web clásico.

        <iframe width="560" height="315" src="https://www.loom.com/embed/5bd5bfc1cae84b1d8a572d976d4af397?sid=5c2ddafe-3399-4245-97c9-805e98eae2c5" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen />

        ```javascript theme={null}

        // Rellena estas constantes con tus propios valores
        const FORM_SELECTOR = "#candidature-form";
        const SUBMIT_BUTTON_SELECTOR = "#form-submit-button";
        const RESUME_INPUT_NAME = "resumesFiles";
        const PROJECT_REFERENCE_ID = "PROJECT-REFERENCE-ID";
        const JARVI_PUBLIC_API_KEY = "YOUR JARVI PUBLIC API KEY";

        // Función auxiliar para leer archivo como base64
        const readFileAsBase64 = (file) => {
        return new Promise((resolve, reject) => {
        const reader = new FileReader();
        reader.onload = (event) => resolve(event.target.result);
        reader.onerror = (error) => reject(error);
        reader.readAsDataURL(file);
        });
        };

        // Función auxiliar para validar datos del formulario
        const validateFormData = (formData) => {
        if (!formData.linkedinUrl) {
        throw new Error("LinkedIn URL is mandatory");
        }
        return true;
        };

        // Manejador principal de envío del formulario
        document.querySelector(SUBMIT_BUTTON_SELECTOR).addEventListener("click", async function (event) {
        event.preventDefault(); // Prevenir el envío predeterminado del formulario

        try {
        const formElement = document.querySelector(FORM_SELECTOR);
        if (!formElement) {
        throw new Error("Form element not found");
        }

        // Convertir FormData a objeto
        const formData = new FormData(formElement);
        const formDataAsObject = Object.fromEntries(formData.entries());

        // Validar datos del formulario
        validateFormData(formDataAsObject);

        // Obtener y validar archivo
        const fileInput = formElement.querySelector(`input[name="${RESUME_INPUT_NAME}"]`);
        if (!fileInput) {
          throw new Error("Resume input field not found");
        }

        const file = fileInput.files[0];
        if (!file) {
          throw new Error("No file uploaded");
        }

        // Leer archivo y preparar datos
        const base64Data = await readFileAsBase64(file);
        const resumesFiles = [
          {
            fileName: file.name,
            data: base64Data,
          },
        ];

        const data = {
          referenceId: "PROJECT-REFERENCE-ID", // Actualiza con tu ID de referencia del proyecto
          ...formDataAsObject,
          resumesFiles,
        };

        console.log("Sending data:", data);

        // Enviar datos a la API
        const response = await fetch("https://functions.prod.jarvi.tech/v1/public-api/rest/v2/applicants", {
          method: "POST",
          mode: "cors",
          headers: {
            "Content-Type": "application/json",
            "X-Api-Key": JARVI_PUBLIC_API_KEY,
          },
          body: JSON.stringify(data),
        });

        if (!response.ok) {
          throw new Error(`HTTP error! status: ${response.status}`);
        }

        const responseData = await response.json();
        console.log("Data sent successfully:", responseData);

        // Opcional: Mostrar mensaje de éxito al usuario
        alert("Application submitted successfully!");

        } catch (error) {
        console.error("Error:", error);
        alert(`Error: ${error.message}`);
        }
        });

        ```
      </Accordion>
    </AccordionGroup>
  </Step>
</Steps>
