Zum Inhalt springen
Odoo Menü
  • Anmelden
  • Jetzt gratis testen
  • Apps
    Finanzen
    • Buchhaltung
    • Rechnungsstellung
    • Spesenabrechnung
    • Tabellenkalkulation (BI)
    • Dokumente
    • E-Signatur
    Vertrieb
    • CRM
    • Vertrieb
    • Kassensystem – Shop
    • Kassensystem – Restaurant
    • Abonnements
    • Vermietung
    Websites
    • Website-Builder
    • E-Commerce
    • Blog
    • Forum
    • Livechat
    • E-Learning
    Lieferkette
    • Lager
    • Fertigung
    • PLM
    • Einkauf
    • Wartung
    • Qualität
    Personalwesen
    • Mitarbeiter
    • Personalbeschaffung
    • Abwesenheiten
    • Mitarbeiterbeurteilung
    • Personalempfehlungen
    • Fuhrpark
    Marketing
    • Social Marketing
    • E-Mail-Marketing
    • SMS-Marketing
    • Veranstaltungen
    • Marketing-Automatisierung
    • Umfragen
    Dienstleistungen
    • Projekte
    • Zeiterfassung
    • Außendienst
    • Kundendienst
    • Planung
    • Termine
    Produktivität
    • Dialog
    • Genehmigungen
    • IoT
    • VoIP
    • Wissensdatenbank
    • WhatsApp
    Apps von Drittanbietern Odoo Studio Odoo Cloud-Plattform
  • Branchen
    Einzelhandel
    • Buchladen
    • Kleidergeschäft
    • Möbelhaus
    • Lebensmittelgeschäft
    • Baumarkt
    • Spielwarengeschäft
    Essen & Gastgewerbe
    • Bar und Kneipe
    • Restaurant
    • Fast Food
    • Gästehaus
    • Getränkehändler
    • Hotel
    Immobilien
    • Immobilienagentur
    • Architekturbüro
    • Baugewerbe
    • Immobilienverwaltung
    • Gartenarbeit
    • Eigentümervereinigung
    Beratung
    • Buchhaltungsfirma
    • Odoo-Partner
    • Marketingagentur
    • Anwaltskanzlei
    • Talentakquise
    • Prüfung & Zertifizierung
    Fertigung
    • Textil
    • Metall
    • Möbel
    • Speisen
    • Brauerei
    • Firmengeschenke
    Gesundheit & Fitness
    • Sportklub
    • Brillengeschäft
    • Fitnessstudio
    • Therapeut
    • Apotheke
    • Friseursalon
    Handel
    • Handyman
    • IT-Hardware & -Support
    • Solarenergiesysteme
    • Schuster
    • Reinigungsdienstleistungen
    • HLK-Dienstleistungen
    Sonstiges
    • Gemeinnützige Organisation
    • Umweltschutzagentur
    • Plakatwandvermietung
    • Fotostudio
    • Fahrrad-Leasing
    • Software-Händler
    Alle Branchen ansehen
  • Community
    Lernen
    • Tutorials
    • Dokumentation
    • Zertifizierungen
    • Schulung
    • Blog
    • Podcast
    Bildung fördern
    • Bildungsprogramm
    • Scale-Up! Planspiel
    • Odoo besuchen
    Software anfragen
    • Herunterladen
    • Editionen vergleichen
    • Releases
    Zusammenarbeiten
    • Github
    • Forum
    • Veranstaltungen
    • Übersetzungen
    • Partner werden
    • Dienstleistungen für Partner
    • Buchhaltungsfirma registrieren
    Services anfragen
    • Partner finden
    • Buchhalter finden
    • Einen Experten treffen
    • Implementierungsservices
    • Kundenreferenzen
    • Support
    • Upgrades
    Github Youtube Twitter Linkedin Instagram Facebook Spotify
    +1 (650) 691-3277
    Eine Demo erhalten
  • Preiskalkulation
  • Hilfe

Odoo is the world's easiest all-in-one management software.
It includes hundreds of business apps:

  • CRM
  • e-Commerce
  • Buchhaltung
  • Lager
  • PoS
  • Projekte
  • MRP
All apps
Sie müssen registriert sein, um mit der Community zu interagieren.
Alle Beiträge Personen Abzeichen
Stichwörter (Alle anzeigen)
odoo accounting v14 pos v15
Über dieses Forum
Sie müssen registriert sein, um mit der Community zu interagieren.
Alle Beiträge Personen Abzeichen
Stichwörter (Alle anzeigen)
odoo accounting v14 pos v15
Über dieses Forum
Hilfe

add a custom code when form view is loaded in odoo 17

Abonnieren

Erhalten Sie eine Benachrichtigung, wenn es eine Aktivität zu diesem Beitrag gibt

Diese Frage wurde gekennzeichnet
javascriptv17
1 Antworten
5384 Ansichten
Avatar
odooUser
hello, i am trying to dynamically add some div-s when form view is loaded, but i am not able to call my custom code.
here is what i did so far

/** @odoo-module **/
import { formView } from "@web/views/form/form_view";

export class SliderInFormView extends formView {
setup() {
super.setup();
}
showSlider() {
document.addEventListener('DOMContentLoaded', function () {
// console.log(`carouselInner >> ${carouselInnerClass}`)
const modelId = 389; // Replace with the actual ID of your Odoo model instance
fetch('/get_images', {
method: 'GET',
credentials: "include",
})
.then(response => response.json() )
.then(data => {
const images = data.images;
const carouselInnerc = document.querySelector('.odoo-vehicle-carousel');
const carouselInner = document.getElementsByClassName("odoo-vehicle-carousel");
const car = document.getElementById('myCarousel')

images.forEach((imageUrl, index) => {

const carouselItem = document.createElement('div');
carouselItem.classList.add('carousel-item');
if (index === 0) {
carouselItem.classList.add('active');
}
const img = document.createElement('img');
img.src = 'data:image/gif;base64,'+ imageUrl;
img.alt = `Image ${index + 1}`;

carouselItem.appendChild(img);
carouselInner.appendChild(carouselItem);
});
// Activate the carousel
const myCarousel = new bootstrap.Carousel(document.getElementById('myCarousel'), {
interval: 2000, // Set the interval for auto sliding in milliseconds
});

})
.catch(error => console.error('Error fetching images', error));
});
}

}






0
Avatar
Verwerfen
Avatar
odooUser
Autor Beste Antwort

fixed with

/** @odoo-module **/
import { patch } from "@web/core/utils/patch";
import { FormController } from '@web/views/form/form_controller';


patch(FormController.prototype, {
setup() {
super.setup(...arguments);

// const modelId = 389; // Replace with the actual ID of your Odoo model instance

fetch('/get_images', {
method: 'GET',
credentials: "include",
})
.then(response => response.json() )
.then(data => {
const images = data.images;
// console.log(document)
const carouselInner = document.querySelector('.odoo-vehicle-carousel');
const carouselDiv = document.querySelector('.carousel');

images.forEach((imageUrl, index) => {

const carouselItem = document.createElement('div');
carouselItem.classList.add('carousel-item');
if (index === 1) {
carouselItem.classList.add('active');
}

const img = document.createElement('img');
img.className = 'd-block w-100 h-100';

img.src = 'data:image/gif;base64,'+ imageUrl;
img.alt = `Image ${index + 1}`;

carouselItem.appendChild(img);
carouselInner.appendChild(carouselItem);

});

const buttonPrevious = document.createElement('button');
buttonPrevious.className = 'carousel-control-prev';
buttonPrevious.type = 'button';
buttonPrevious.setAttribute('data-bs-target', '#myCarousel');
buttonPrevious.setAttribute('data-bs-slide', 'prev');


const prevIconSpan = document.createElement('span');
prevIconSpan.className = 'carousel-control-prev-icon';
prevIconSpan.setAttribute('aria-hidden', 'true');

const visuallyHiddenSpan = document.createElement('span');
visuallyHiddenSpan.className = 'visually-hidden';
visuallyHiddenSpan.textContent = 'Previous';

buttonPrevious.appendChild(prevIconSpan);
buttonPrevious.appendChild(visuallyHiddenSpan);

carouselDiv.appendChild(buttonPrevious);


const buttonNext = document.createElement('button');

buttonNext.className = 'carousel-control-next';
buttonNext.type = 'button';
buttonNext.setAttribute('data-bs-target', '#carouselExampleControls');
buttonNext.setAttribute('data-bs-slide', 'next');

const nextIconSpan = document.createElement('span');
nextIconSpan.className = 'carousel-control-next-icon';
nextIconSpan.setAttribute('aria-hidden', 'true');

const NextHiddenSpan = document.createElement('span');
NextHiddenSpan.className = 'visually-hidden';
NextHiddenSpan.textContent = 'Next';

buttonNext.appendChild(nextIconSpan);
buttonNext.appendChild(NextHiddenSpan);

carouselDiv.appendChild(buttonNext);



// Activate the carousel
// const myCarousel = new bootstrap.Carousel(document.getElementById('myCarousel'), {
// interval: 5, // Set the interval for auto sliding in milliseconds
// });


})
.catch(error => console.error('Error fetching images', error));
// });

},
});


0
Avatar
Verwerfen
Diskutieren Sie gerne? Treten Sie bei, statt nur zu lesen!

Erstellen Sie heute ein Konto, um exklusive Funktionen zu nutzen und mit unserer tollen Community zu interagieren!

Registrieren
Verknüpfte Beiträge Antworten Ansichten Aktivität
Odoo 17, the following modules are needed by other modules but have not been defined, they may not be present in the correct asset bundle.
javascript v17
Avatar
Avatar
Avatar
Avatar
Avatar
4
Mai 25
11768
Modules are needed by other modules but have not been defined / Modules could not be loaded because they have unmet dependencies
javascript v17
Avatar
Avatar
2
Dez. 24
7884
where can i find the web.core and qweb.core in Odoo17? Gelöst
javascript v17
Avatar
Avatar
Avatar
Avatar
3
Apr. 24
7775
UncaughtPromiseError null
javascript v17 UncaughtPromiseError
Avatar
0
Apr. 25
1670
Custom button trigger in FormController?
javascript action v17
Avatar
0
Dez. 24
2505
Community
  • Tutorials
  • Dokumentation
  • Forum
Open Source
  • Herunterladen
  • Github
  • Runbot
  • Übersetzungen
Dienstleistungen
  • Odoo.sh-Hosting
  • Support
  • Upgrade
  • Individuelle Entwicklungen
  • Bildung
  • Buchhalter finden
  • Partner finden
  • Partner werden
Über uns
  • Unsere Firma
  • Markenwerte
  • Kontakt
  • Karriere
  • Veranstaltungen
  • Podcast
  • Blog
  • Kunden
  • Rechtliches • Datenschutz
  • Sicherheit
الْعَرَبيّة Català 简体中文 繁體中文 (台灣) Čeština Dansk Nederlands English Suomi Français Deutsch हिंदी Bahasa Indonesia Italiano 日本語 한국어 (KR) Lietuvių kalba Język polski Português (BR) română русский язык Slovenský jazyk slovenščina Español (América Latina) Español ภาษาไทย Türkçe українська Tiếng Việt

Odoo ist eine Suite von Open-Source-Betriebsanwendungen, die alle Bedürfnisse Ihres Unternehmens abdecken: CRM, E-Commerce, Buchhaltung, Lager, Kassensystem, Projektmanagement etc.

Das einzigartige Wertversprechen von Odoo ist, dass es gleichzeitig sehr einfach zu bedienen und voll integriert ist.

Website made with

Odoo Experience on YouTube

1. Use the live chat to ask your questions.
2. The operator answers within a few minutes.

Live support on Youtube
Watch now