Skip to Content
Menu
This question has been flagged
2 Replies
3339 Views

I have this custom widget that is used in an Odoo 12 project. I am new to Odoo still, and I need to convert it to Odoo 16. I am familiar with Odoo 12 because that's the version I followed a course from, but not with 16, so I can't really understand where the problem could be, but I am pretty sure it's in the widget.js file, and maybe it's something related to the libraries that are required in the code (maybe they are outdated)? The manifest file should be correct (unless there are some major changes that you are aware), and the view is a very simple xml file that shouldn't have any problems.

What this widget does btw, it takes a pdf file and it creates an url for it so you can preview it.

Thanks in advance, let me know if there's something I've been missing, but here's the js file:

odoo.define("pdf_preview_widget", function (require) {

  "use strict";


  var core = require('web.core');

  var fieldRegistry = require("web.field_registry");

  var basicFields = require("web.basic_fields");


  var PdfPreviewWidget = basicFields.FieldBinaryFile.extend({

    template: "PdfPreviewWidget",

    

    _renderModal: function (data) {

      const self = this;


      if($('.pdf-preview-modal').length) return;


      let modalTemplate = core.qweb.render('PdfPreviewModal', {

        iframe_data: data

      });


      $('body').append(modalTemplate);

      $('.modal-window').addClass('visible');

      $(".modal-close").on('click', function(ev) {

        ev.preventDefault();


        $(this).parent().parent().parent().remove();

      });

    },


    _b64toBlob: function(b64Data, contentType='', sliceSize=512) {

      const byteCharacters = atob(b64Data);

      const byteArrays = [];

    

      for (let offset = 0; offset < byteCharacters.length; offset += sliceSize) {

        const slice = byteCharacters.slice(offset, offset + sliceSize);

    

        const byteNumbers = new Array(slice.length);

        for (let i = 0; i < slice.length; i++) {

          byteNumbers[i] = slice.charCodeAt(i);

        }

    

        const byteArray = new Uint8Array(byteNumbers);

        byteArrays.push(byteArray);

      }

    

      const blob = new Blob(byteArrays, {type: contentType, title: 'Download.pdf'});

      return blob;

    },


    _render: function () {

      const self = this;


      this.$(".oe_field_pdf_preview").on('click', function(ev) {

        ev.preventDefault();


        const resBlob = self._b64toBlob(self.value, 'application/pdf');

        const resFile = new File([resBlob], 'Download.pdf', {type: 'application/pdf'});

        const resUrl = URL.createObjectURL(resFile, {type: 'application/pdf'});


        self._renderModal(resUrl);

      });

    }

  });


  fieldRegistry.add("pdf_preview", PdfPreviewWidget);

});
Avatar
Discard
Best Answer

try this way:
odoo.define("pdf_preview_widget", function (require) {
"use strict";

var core = require("web.core");
var BasicFields = require("web.basic_fields");

var PdfPreviewWidget = BasicFields.FieldBinaryFile.extend({
template: "PdfPreviewWidget",

_render: function () {
var self = this;

this.$(".oe_field_pdf_preview").on("click", function (ev) {
ev.preventDefault();

var resBlob = self._b64toBlob(self.value, "application/pdf");
var resUrl = URL.createObjectURL(resBlob);

self._renderModal(resUrl);
});
},

_renderModal: function (data) {
if ($(".pdf-preview-modal").length) return;

var modalTemplate = core.qweb.render("PdfPreviewModal", {
iframe_data: data,
});

$("body").append(modalTemplate);
$(".modal-window").addClass("visible");

$(".modal-close").on("click", function (ev) {
ev.preventDefault();
$(this).parent().parent().parent().remove();
});
},

_b64toBlob: function (b64Data, contentType = "", sliceSize = 512) {
var byteCharacters = atob(b64Data);
var byteArrays = [];

for (
var offset = 0;
offset < byteCharacters.length;
offset += sliceSize
) {
var slice = byteCharacters.slice(offset, offset + sliceSize);

var byteNumbers = new Array(slice.length);
for (var i = 0; i < slice.length; i++) {
byteNumbers[i] = slice.charCodeAt(i);
}

var byteArray = new Uint8Array(byteNumbers);
byteArrays.push(byteArray);
}

var blob = new Blob(byteArrays, { type: contentType, title: "Download.pdf" });
return blob;
},
});

return {
PdfPreviewWidget: PdfPreviewWidget,
};
});

Avatar
Discard
Best Answer

Hi,
There is a lot of change that comes when Odoo was upgraded from version 12 to 16. Currently, in the case of the backend, we are using OWL (Odoo Web Library)
To create a field widget in Odoo 16, you can follow the instructions provided in this blog: "How to Create a Field Widget in Odoo 16".
https://www.cybrosys.com/blog/how-to-create-a-field-widget-in-the-odoo-16
The blog should provide you with detailed steps and guidance on creating a custom field widget in Odoo 16.

Hope it helps

Avatar
Discard
Related Posts Replies Views Activity
1
Apr 24
1990
1
Sep 23
1556
1
May 24
1578
1
Jun 23
2400
2
Nov 22
6745