I have a form including Image field:
{type: "newcolumn", offset: 50},
{
type: "image",
name: "logo",
label: "Logo",
position: "label-top",
url: './podmioty/showlogo/'
},
It is very large form divided between couple of Tabs in Tabbar. All the form works fine except the Image field which is usually not shown the image. Sometimes it show it as expected but most often it does not.
I use form.load(‘filename’) to populate form with data.
Below is the whole function that is being used for this purpose:
function showPodmiotDetails() {
if (!gridPodmioty.getSelectedRowId()) {
dhtmlx.message({
title: "Ostrzeżenie",
type: "alert",
text: "Wybierz rekord!"
});
return;
}
var windowPodmiotDetails = layoutFaktury.dhxWins.createWindow('windowPodmiotDetails', 0, 0, 600, 600);
var layoutPodmiotDetails = windowPodmiotDetails.attachLayout('2E');
var cellDane = layoutPodmiotDetails.cells('a');
cellDane.hideArrow();
cellDane.setText('Dane firmy');
cellDane.setHeight('210');
cellDane.fixSize(0, 1);
var str = [
{type: "input", name: "nazwa", label: "Nazwa", inputWidth: 240, required: true},
{type: "input", name: "ulica", label: "Ulica", inputWidth: 240},
{type: "input", name: "kod_pocztowy", label: "Kod poczt.", inputWidth: 50, required: true},
{type: "input", name: "miejscowosc", label: "Miejscowość", required: true},
{type: "input", name: "nip", label: "NIP", inputWidth: 90, required: true},
{
type: "combo",
name: "wojewodztwo",
label: "Województwo",
connector: "./slownik/wojewodztwa",
inputWidth: 160,
required: true
},
{type: "input", name: "powiat", label: "Powiat", inputWidth: 160, required: true},
{type: "input", name: "gmina", label: "Gmina", inputWidth: 160, required: true},
{type: "input", name: "kod_urzedu", label: "Kod urzędu", inputWidth: 50, required: true},
{type: "input", name: "miejsce_wystawienia", label: "Miejsce wyst.", required: true},
{type: "newcolumn", offset: 50},
{
type: "image",
name: "logo",
label: "Logo",
position: "label-top",
url: './podmioty/showlogo/'
},
{
type: "button",
value: "Usuń logo",
name: 'btnRemoveLogo'
//disabled: true
},
{
type: "block", name: "blockFaktura", id: "blockFaktura", list: [
{
type: "label",
name: "faktury_przyklad",
label: "Przykładowy numer: <i>1/FV/2017</i>",
labelWidth: 240
},
{
type: "block", name: "radiosFaktury", list: [
{
type: "radio",
name: "schemat_nr_fakt",
label: "numer faktury/rok",
value: "$!/#",
labelAlign: "left",
position: "label-right"
},
{
type: "radio",
name: "schemat_nr_fakt",
label: "rok/numer faktury",
value: "#/$!",
position: "label-right"
},
{
type: "radio",
name: "schemat_nr_fakt",
label: "numer faktury/miesiąc/rok",
value: "$/?/#",
labelAlign: "left",
position: "label-right"
},
{
type: "radio",
name: "schemat_nr_fakt",
label: "rok/miesiąc/numer faktury",
value: "#/?/$"
},
{type: "newcolumn", offset: 30},
{
type: "radio",
name: "schemat_nr_fakt",
label: "miesiąc/numer faktury/rok",
value: "?/$/#"
},
{
type: "radio",
name: "schemat_nr_fakt",
label: "numer faktury w roku/miesiac/rok",
value: "$!/?/#"
},
{
type: "radio",
name: "schemat_nr_fakt",
label: "rok/miesiąc/numer faktury w roku",
value: "#/?/$!"
},
{
type: "radio",
name: "schemat_nr_fakt",
label: "numer faktury/typ/rok",
checked: "1",
value: "$!/&/#"
},
]
},
{type: "settings", labelWidth: 200, position: "label-right"}
]
},
{
type: "block", name: "blockKorekta", id: "blockKorekta", list: [
{
type: "label",
name: "korekty_przyklad",
label: "Przykładowy numer: <i>1/FK/2017</i>",
labelWidth: 240
},
{
type: "block", name: "radiosKorekty", list: [
{
type: "radio",
name: "schemat_nr_korekta",
label: "numer faktury/rok",
value: "$!/#",
labelAlign: "left",
position: "label-right"
},
{
type: "radio",
name: "schemat_nr_korekta",
label: "rok/numer faktury",
value: "#/$!",
position: "label-right"
},
{
type: "radio",
name: "schemat_nr_korekta",
label: "numer faktury/miesiąc/rok",
value: "$/?/#",
labelAlign: "left",
position: "label-right"
},
{
type: "radio",
name: "schemat_nr_korekta",
label: "rok/miesiąc/numer faktury",
value: "#/?/$"
},
{type: "newcolumn", offset: 30},
{
type: "radio",
name: "schemat_nr_korekta",
label: "miesiąc/numer faktury/rok",
value: "?/$/#"
},
{
type: "radio",
name: "schemat_nr_korekta",
label: "numer faktury w roku/miesiac/rok",
value: "$!/?/#"
},
{
type: "radio",
name: "schemat_nr_korekta",
label: "rok/miesiąc/numer faktury w roku",
value: "#/?/$!"
},
{
type: "radio",
name: "schemat_nr_korekta",
label: "numer faktury/typ/rok",
checked: "1",
value: "$!/&/#"
},
]
},
{type: "settings", labelWidth: 200, position: "label-right"}
]
},
{
type: "block", name: "blockProforma", id: "blockProforma", list: [
{
type: "label",
name: "proformy_przyklad",
label: "Przykładowy numer: <i>1/FPF/2017</i>",
labelWidth: 240
},
{
type: "block", name: "radiosProformy", list: [
{
type: "radio",
name: "schemat_nr_proforma",
label: "numer faktury/rok",
value: "$!/#",
labelAlign: "left",
position: "label-right"
},
{
type: "radio",
name: "schemat_nr_proforma",
label: "rok/numer faktury",
value: "#/$!",
position: "label-right"
},
{
type: "radio",
name: "schemat_nr_proforma",
label: "numer faktury/miesiąc/rok",
value: "$/?/#",
labelAlign: "left",
position: "label-right"
},
{
type: "radio",
name: "schemat_nr_proforma",
label: "rok/miesiąc/numer faktury",
value: "#/?/$"
},
{type: "newcolumn", offset: 30},
{
type: "radio",
name: "schemat_nr_proforma",
label: "miesiąc/numer faktury/rok",
value: "?/$/#"
},
{
type: "radio",
name: "schemat_nr_proforma",
label: "numer faktury w roku/miesiac/rok",
value: "$!/?/#"
},
{
type: "radio",
name: "schemat_nr_proforma",
label: "rok/miesiąc/numer faktury w roku",
value: "#/?/$!"
},
{
type: "radio",
name: "schemat_nr_proforma",
label: "numer faktury/typ/rok",
checked: "1",
value: "$!/&/#"
},
]
},
{type: "settings", labelWidth: 200, position: "label-right"}
]
},
{type: "settings", labelWidth: 100}
];
var formPodmiot = cellDane.attachForm(str);
formPodmiot.attachEvent('onChange', function (name, value, state) {
if (name == 'schemat_nr_fakt') {
formPodmiot.setItemLabel('faktury_przyklad', 'Przykładowy numer: <i>' + decodeFvNumber(value, 'FV') + '</i>');
}
if (name == "schemat_nr_korekta") {
formPodmiot.setItemLabel('korekty_przyklad', 'Przykładowy numer: <i>' + decodeFvNumber(value, 'FK') + '</i>');
}
if (name == "schemat_nr_proforma") {
formPodmiot.setItemLabel('proformy_przyklad', 'Przykładowy numer: <i>' + decodeFvNumber(value, 'FPF') + '</i>');
}
});
formPodmiot.attachEvent('onButtonClick', function (bId) {
console.log(formPodmiot.getItemValue('logo'));
if (bId == 'btnRemoveLogo') {
// window.dhx.ajax.post('./podmioty/removelogo', 'filename=' + formPodmiot.getItemValue('logo'), function (response) {
// var nresp = JSON.parse(response.xmlDoc.responseText);
// if (nresp.status) {
//
// } else {
// dhtmlx.message('Wystąpił błąd usuwania pliku.', 'error');
// }
// });
// console.log('Klikniete');
formPodmiot.setItemValue('logo', '');
}
})
formPodmiot.attachEvent('onXLS', function () {
windowPodmiotDetails.progressOn();
});
formPodmiot.attachEvent('onXLE', function () {
formPodmiot.setItemLabel('faktury_przyklad', 'Przykładowy numer: <i>' + decodeFvNumber(formPodmiot.getItemValue('schemat_nr_fakt'), 'FV') + '</i>');
formPodmiot.setItemLabel('korekty_przyklad', 'Przykładowy numer: <i>' + decodeFvNumber(formPodmiot.getItemValue('schemat_nr_korekta'), 'FK') + '</i>');
formPodmiot.setItemLabel('proformy_przyklad', 'Przykładowy numer: <i>' + decodeFvNumber(formPodmiot.getItemValue('schemat_nr_proforma'), 'FPF') + '</i>');
windowPodmiotDetails.progressOff();
});
function decodeFvNumber(value, type) {
value = value.replace('$!', '1');
value = value.replace('$', '1');
value = value.replace('?', (new Date()).getMonth());
value = value.replace('#', (new Date()).getFullYear());
value = value.replace('&', type);
return value;
}
var cellSzczegoly = layoutPodmiotDetails.cells('b');
cellSzczegoly.fixSize(0, 1);
cellSzczegoly.setText('Konfiguracja dodatkowa');
cellSzczegoly.collapse();
var tabbarSzczegoly = cellSzczegoly.attachTabbar();
tabbarSzczegoly.setArrowsMode("auto");
tabbarSzczegoly.addTab('tabNumeracja', 'Faktury VAT');
var tabNumeracja = tabbarSzczegoly.cells('tabNumeracja');
tabNumeracja.setActive();
var tabbarNumeracja = tabNumeracja.attachTabbar();
tabbarNumeracja.setArrowsMode("auto");
tabbarNumeracja.addTab('tabFaktury', 'Faktury VAT');
var tabFaktury = tabbarNumeracja.cells('tabFaktury');
tabFaktury.attachObject('blockFaktura');
tabFaktury.setActive();
tabbarNumeracja.addTab('tabKorekty', 'Korekty faktur');
var tabKorekty = tabbarNumeracja.cells('tabKorekty');
tabKorekty.attachObject('blockKorekta');
tabbarNumeracja.addTab('tabProforma', 'Faktury proforma');
var tabProforma = tabbarNumeracja.cells('tabProforma');
tabProforma.attachObject('blockProforma');
formPodmiot.load('./podmioty/view/' + gridPodmioty.getSelectedRowId());
function deleteRachunek() {
if (!gridRachunki.getSelectedRowId()) {
dhtmlx.message({
title: "Ostrzeżenie",
type: "alert",
text: "Wybierz rekord!"
});
return;
}
dhtmlx.message({
title: "Potwierdzenie",
type: "confirm-warning",
text: "Czy na pewno chcesz usunąć ten rekord?",
cancel: "Anuluj",
callback: function (result) {
if (result) {
gridRachunki.deleteSelectedRows();
}
}
});
}
tabbarSzczegoly.addTab('tabRachunki', 'Rachunki bankowe');
var tabRachunki = tabbarSzczegoly.cells('tabRachunki');
tabbarSzczegoly.attachEvent('onSelect', function (tId) {
if (tId == 'tabRachunki')
gridRachunki.clearAndLoad('./rachunkibankowe/data?id_podmiotu=' + gridPodmioty.getSelectedRowId());
return true;
});
var toolbarRachunki = tabRachunki.attachToolbar();
toolbarRachunki.setIconset('awesome');
toolbarRachunki.loadStruct('<toolbar>' +
'<item type="button" id="buttonAdd" img="fa fa-plus" imgdis="fa fa-plus" />' +
'<item type="button" id="buttonDelete" img="fa fa-trash-o" imgdis="fa fa-trash-o" />' +
'<item type="spacer"/>' +
'<item type="button" id="buttonReload" img="fa fa-refresh" imgdis="fa fa-refresh"/>' +
'</toolbar>', function () {
});
toolbarRachunki.attachEvent('onCLick', function (bId) {
if (bId == "buttonDelete")
deleteRachunek();
if (bId == 'buttonReload')
gridRachunki.clearAndLoad('./rachunkibankowe/data?id_podmiotu=' + gridPodmioty.getSelectedRowId());
});
var popRachunki = new dhtmlXPopup({
toolbar: toolbarRachunki,
id: "buttonAdd" //attaches popup to the "Open" button
});
popRachunki.attachEvent('onHide', function () {
popRachunki.clear();
});
var strRachunki = [
{type: "input", name: "nazwa_banku", label: "Nazwa banku", required: true},
{type: "input", name: "numer_konta", label: "Numer konta", required: true},
{type: "hidden", name: "id_podmiotu", value: gridPodmioty.getSelectedRowId()},
{type: "button", name: "buttonSave", value: "Zapisz"},
{type: "settings", labelWidth: 100, inputWidth: 210}
];
popRachunki.attachEvent('onShow', function () {
var formRachunki = popRachunki.attachForm(strRachunki);
formRachunki.attachEvent('onButtonClick', function (bId) {
if (bId == 'buttonSave') {
formRachunki.send('./rachunkibankowe/create', 'post', function (loader, response) {
var nresp = JSON.parse(response);
if (nresp.status === true) {
popRachunki.hide();
gridRachunki.clearAndLoad('./rachunkibankowe/data?id_podmiotu=' + gridPodmioty.getSelectedRowId());
} else {
for (var key in nresp.message) {
if (formRachunki.isItem(key) && !formRachunki.isItemHidden(key)) formRachunki.setNote(key, {
text: nresp.message[key],
width: 210
})
}
dhtmlx.message('<b>Wystąpił błąd zapisu danych.</b>');
}
});
}
})
});
var gridRachunki = tabRachunki.attachGrid();
gridRachunki.setIconsPath('./codebase/imgs/');
gridRachunki.setHeader(["Nazwa banku", "Numer rachunku"]);
gridRachunki.setColTypes("ro,ro");
gridRachunki.setColSorting('str,str');
gridRachunki.setColumnMinWidth('200', 1);
gridRachunki.setInitWidths('200,*');
gridRachunki.attachEvent('onXLS', function () {
tabRachunki.progressOn();
});
gridRachunki.attachEvent('onXLE', function () {
tabRachunki.progressOff();
});
gridRachunki.attachEvent('onBeforeContextMenu', function (rId, cellInd, gridObj) {
gridObj.selectRowById(rId);
return true;
});
var contextRachunki = new dhtmlXMenuObject();
contextRachunki.setIconset('awesome');
contextRachunki.renderAsContextMenu();
contextRachunki.loadStruct('<menu>' +
'<item type="item" id="cxDelete" text="Usuń" img="fa fa-trash-o" imgdis="fa fa-trash-o"/></menu>');
contextRachunki.attachEvent('onClick', function (bId) {
switch (bId) {
case 'cxDelete':
deleteRachunek();
break;
}
});
gridRachunki.enableContextMenu(contextRachunki);
var dpRachunki = new dataProcessor('./rachunkibankowe/dataplain');
dpRachunki.init(gridRachunki);
gridRachunki.init();
//gridRachunki.load('./rachunkibankowe/data/?id_podmiotu=' + gridPodmioty.getSelectedRowId());
var toolbarPodmiotDetails = windowPodmiotDetails.attachToolbar();
toolbarPodmiotDetails.setIconset('awesome');
toolbarPodmiotDetails.loadStruct('<toolbar>' +
'<item type="button" id="buttonWinSave" text="Zapisz" img="fa fa-check" imgdis="fa fa-check"/>' +
'<item type="button" id="buttonWinCancel" text="Anuluj" img="fa fa-times" imgdis="fa fa-times"/>' +
'</toolbar>', function () {
});
toolbarPodmiotDetails.attachEvent('onClick', function (bId) {
switch (bId) {
case 'buttonWinSave':
windowPodmiotDetails.progressOn();
formPodmiot.send('./podmioty/update/' + gridPodmioty.getSelectedRowId(), 'post', function (loader, response) {
var nresp = JSON.parse(response);
if (nresp.status === true) {
windowPodmiotDetails.close();
gridPodmioty.clearAndLoad('./podmioty/data');
} else {
windowPodmiotDetails.progressOff();
dhtmlx.message('<b>Wystąpił błąd zapisu danych.</b>');
}
});
break;
case 'buttonWinCancel':
windowPodmiotDetails.close();
break;
}
});
windowPodmiotDetails.setText('Ustawienia podmiotu');
windowPodmiotDetails.denyResize();
windowPodmiotDetails.setModal(1);
windowPodmiotDetails.centerOnScreen();
windowPodmiotDetails.button('minmax').hide();
windowPodmiotDetails.button('park').hide();
}