`var sm = {
nature:[
{name:”nature1″,ar:”الطبيعة 1″},
{name:”nature2″,ar:”الطبيعة 2″},
{name:”nature3″,ar:”الطبيعة 3″},
{name:”nature4″,ar:”الطبيعة 4″}
],
exportateur:[
{name:”exportateur1″,ar:”المصدر 1″},
{name:”exportateur2″,ar:”المصدر 2″},
{name:”exportateur3″,ar:”المصدر 3″},
{name:”exportateur4″,ar:”المصدر 4″}
],
pays:[
{name:”germany”,ar:”ألمانيا”},
{name:”france”,ar:”فرنسا”},
{name:”belgium”,ar:”بلجيكا”},
{name:”spain”,ar:”إسبانيا”}
]
}
function createPdf(event){
“use strict”;
var doc = new jsPDF();
doc.text(“Nature de la marchandise: “+sm.nature[0].ar,10, 10);
}
`
>
Results {Show me some weird langage unstead of showing me الطبيعة 1}
sm
```<i>
</i><!DOCTYPE html>
<html lang="de">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Test Pdfmake</title>
<style>
</style>
<_script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.3.0-beta.1/pdfmake.min.js"
integrity="sha512-G332POpNexhCYGoyPfct/0/K1BZc4vHO5XSzRENRML0evYCaRpAUNxFinoIJCZFJlGGnOWJbtMLgEGRtiCJ0Yw=="
crossorigin="anonymous" referrerpolicy="no-referrer"></_script>
<_script src="https://cdnjs.cloudflare.com/ajax/libs/pdfmake/0.3.0-beta.1/vfs_fonts.min.js"
integrity="sha512-6RDwGHTexMgLUqN/M2wHQ5KIR9T3WVbXd7hg0bnT+vs5ssavSnCica4Uw0EJnrErHzQa6LRfItjECPqRt4iZmA=="
crossorigin="anonymous" referrerpolicy="no-referrer"></_script>
</head>
<body>
<_script>
pdfMake.fonts = {
Roboto: {
// I kept the name Roboto (the standard font in pdfmake)
//in order to make testing easier,
// this way I didn't have to research how to specify a font.
normal: 'http://localhost/arabtype.ttf',
// bold: 'https://example.com/fonts/fontFile2.ttf',
// italics: 'https://example.com/fonts/fontFile3.ttf',
// bolditalics: 'https://example.com/fonts/fontFile4.ttf'
}
};
const dd = {
content: [
'إسبانيا',
'Another paragraph, this time a little bit longer to make sure, this line will be divided into at least two lines'
]
};
pdfMake.createPdf(dd).download();
</__script>
</body>
</html><i>
</i>
``
``<i>
</i>Access to XMLHttpRequest at 'http://localhost/arabtype.ttf' from origin 'http://127.0.0.1:5501' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
GET http://localhost/arabtype.ttf net::ERR_FAILED 200
Uncaught (in promise) TypeError: Failed to fetch (url: "http://localhost/arabtype.ttf")<i>
</i>
``
>has been blocked by CORS policy
document.querySelector('#test').addEventListener("click",function(event){<br/>
event.preventDefault()<br/>
pdfMake.fonts = {<br/>
Roboto: {<br/>
// I kept the name Roboto (the standard font in pdfmake)<br/>
//in order to make testing easier,<br/>
// this way I didn't have to research how to specify a font.<br/>
normal: 'http://localhost/arabtype.ttf',<br/>
// bold: 'https://example.com/fonts/fontFile2.ttf',<br/>
// italics: 'https://example.com/fonts/fontFile3.ttf',<br/>
// bolditalics: 'https://example.com/fonts/fontFile4.ttf'<br/>
}<br/>
};<br/>
const dd = {<br/>
content: [<br/>
'إسبانيا',<br/>
'Another paragraph, this time a little bit longer to make sure, this line will be divided into at least two lines'<br/>
]<br/>
};<br/>
pdfMake.createPdf(dd).download();<br/>
})
>The problem is I don't know how to access to it with fetch request because fetch give me a promise unstead of value
ar
</C> in a data attribute of each option:
<CODE>
`<i>
</i>json.then((a) => {
// for(var key in a.nature){nature
for (var key in a.nature) {
document.getElementById('nature').innerHTML += '<option value="' + key
+ '" data-ar="' + a.nature[key].ar + '">' + a.nature[key].name + '</option>'
// console.log(a.nature[key].name)
}
// do the same for the remaining selects<i>
</i>
`</CODE>
Later on you can read the value from the option being selected:
<CODE>
`<i>
</i> content: [
{
text: document.querySelector('#nature options:selected').dataset.ar
},
// {text: '1 Headline',style: 'header' },
// 'Some long text of variable length ...',
// {text: '2 Headline', headlineLevel: 1},
// 'Some long text of variable length ...',
// {text: '3 Headline', headlineLevel: 1},
// 'Some long text of variable length ...',
],<i>
</i>
``:selected
</C>, must read <C>
option:checked
</C>:
<CODE>
`<i>
</i> const dd = {
// pageSize: {
// width: 170,
// height: 113
// },
content: [
{
text: document.querySelector('#nature option:checked').dataset.ar
},<i>
</i>
``document.querySelector('#nature')
</C> exists but doesn't have an attribute <C>
dataset
`>i want to write a number with my arabic word
``<i>
</i> const dd = {
content: [
" الطبيعة 2 ".split(" ").reverse().join(" "),
'Another paragraph, this time a little bit longer to make sure, this line will be divided into at least two lines'
]
};<i>
</i>
``
{text: 'لوريم ايبسوم هو نموذج', alignment: 'right'}
`0.1.9 — BETA 5.19