File Error in Grid

[processmakeruserParticipant]

I have a file uploader in my grid and when I file uploaded, if I select in other cell, the file lost.

What can I do not to lost my file?

[MartinParticipant]

Hello processmakeruser,

I would suggest you to use the createwidget function for creating the fileUploader.
Here is an Example.

You can read more about createwidget and initwidget function in the Grid’s API, under the columns property.

Best Regards,
Martin

jQWidgets Team
http://www.jqwidgets.com/

[processmakeruserParticipant]

Hi Martin!

Thanks for your suggestion and reply.

I tried it and my form is really useful anymore thanks to you! I had tried many times since you wrote me.

Kr.

[processmakeruserParticipant]

Hi Martin!

I have one more question and I want to ask you from this topic.

My question is I can’t read value of the file that is I uploaded it on grid.

My codes are:

var index=0;

        tumliste.forEach(function (ELEMENT) {
            
            var DOSYA = $("#FILE_" + index)[0].files[0];
            var DURUM="KALITE_RAPORUNU_DEGERLENDIRME";
            
            var TEMP_SATIR = {

                URUNKODU: ELEMENT["URUNKODU"],
                TEDARIKCI: ELEMENT["TEDARIKCI"],
                DURUM: DURUM,
                KALITEKONTROL: ELEMENT["KALITEKONTROL"],      
                KALITEACIKLAMA: ELEMENT["KALITEACIKLAMA"],
                EK_DOSYA: DOSYA,
                EK_DOSYA_TYPE: DOSYA.type,
                EK_DOSYA_AD: DOSYA.name

            }
            KAYDET_TALEP_DEGERLENDIR.push(TEMP_SATIR);
            index++;
        });

Thanks for your attention
Kr.

[MartinParticipant]

Hello processmakeruser,

Can you clarify what is the issue?
From the code that you have sent it is not clear how you are using the grid.
Can you provide an example?
Thank you!

Best Regards,
Martin

jQWidgets Team
http://www.jqwidgets.com/

[processmakeruserParticipant]

Hi Martin!

The code of the grid is here. I hope this is better.

function TALEP_DEGERLENDIR_URUN_LISTESI(DATA) {
    var source = {
        dataType: "json",
        dataFields: [{
                name: "URUNKODU",
                type: "string"
            },
            {
                name: "ACIKLAMA",
                type: "string"
            },
            {
                name: 'RESIM',
                type: 'string'
            },
            {
                name: 'MIKTAR',
                type: 'number'
            },
            {
                name: 'BIRIM',
                type: 'string'
            },
            {
                name: 'MAT',
                type: 'bool'
            },
            {
                name: 'KALITEKONTROL',
                type: 'bool'
            },
            {
                name: 'KALITE_ACIKLAMA',
                type: 'string'
            },
            {
                name: 'TEDARIKCI',
                type: 'string'
            },           
            {
                name: 'IPTAL',
                type: 'bool'
            },
            {
                name: 'KALITEDOSYA',
                type: 'file'
            },
            {
                name: 'AD_SOYAD',
                type: 'string'
            }
            ],
        id: "ID",
        localData: DATA
    };
    var dataAdapter = new $.jqx.dataAdapter(source);
    var linkrenderer = function (row, column, value) {
        if (value.indexOf('#') != -1) {
            value = value.substring(0, value.indexOf('#'));
        }
        var href = value;
        return "<div style='width: 100%; height: 100%; padding-top: 7px; padding-left: 2px;' class='jqx-left-align'><a href='" + href + "' target='_blank'>GÖSTER</a></div>";

    }
    var cellclass = function (row, columnfield, value) {
        return "red";
    };
    var deger=0;
    var localizationobj = {};
    localizationobj.currencysymbol = "₺";
    $("#ugunlukkontrolu").jqxGrid({

        width: 1475,
        source: source,
        autoheight: true,
        rowdetails: true,
        rowsheight: 30,
        sortable: true,
        pageable: true,
        showstatusbar: true,
        statusbarheight: 25,
        showaggregates: true,
        altrows: true,
        editable: true,
        selectionmode: 'multiplecellsadvanced',
        columns: [{
                text: 'Ürün Kodu',
                datafield: 'URUNKODU',
                cellsalign: 'left',
                width: 120,
                pinned: true,
                editable: false,
            },
            {
                text: 'Açıklama',
                datafield: 'ACIKLAMA',
                cellsalign: 'left',
                pinned: true,
                width: 200,
                editable: false,
            },
            {
                text: "Resim",
                datafield: 'RESIM',
                width: 75,
                cellsrenderer: linkrenderer,
                editable: false,
                pinned: true
            },
            {
                text: 'Miktar',
                datafield: 'MIKTAR',
                cellsalign: 'center',
                width: 70,
                decimalDigits: 0,
                cellsformat: 'n',
                pinned: true,
                editable: false,
            },
            {
                text: 'Birim',
                datafield: 'BIRIM',
                cellsalign: 'center',
                width: 75,
                pinned: true,
                editable: false,
            },
            {
                text: 'Mat',
                datafield: 'MAT',
                cellsalign: 'center',
                columntype: 'checkbox',
                width: 75,
                pinned: true,
                editable: false,
            },
            {
                text: 'Tedarikçi',
                datafield: 'TEDARIKCI',
                cellsalign: 'left',
                width: 300,
                hidden: true,
                pinned: true,
                editable: false,

            },
            {
                text: "Kalite Kontrol Onaylandı",
                datafield: 'KALITEKONTROL',
                cellsalign: 'center',
                threestatecheckbox: false,
                columntype: 'checkbox',
                width: 170,
                editable: true
            },
            {
                text: 'Personel',
                datafield: 'AD_SOYAD',
                displayfield: 'AD_SOYAD',
                columntype: 'dropdownlist',
                editable: true,
                width: 150,

                createeditor: function (row, value, editor) {

                    var sourceArr = [];
                    for (var i = 0; i < PERSONEL.length; i++) {
                        var value = PERSONEL[i]["AD_SOYAD"];
                        sourceArr[i] = value;
                    }
                    editor.jqxDropDownList({
                        autoDropDownHeight: true,
                        source: sourceArr,
                        placeHolder: "Seçiniz:"
                    });

                },
            },
            {
                text: 'Kontrol Açıklaması',
                datafield: 'KALITE_ACIKLAMA',
                cellsalign: 'left',
                editable: true,
            },
            {
                text: 'Kontrol Raporu',
                datafield: 'KALITEDOSYA',
                columntype: 'custom',
                cellsalign: 'center',
                align: 'center',
                width: 200,
                height: 100,
                createwidget: function (row, column, value, htmlElement) {
                    var datarecord = value;                   
                    var fileUpload = $("<div>" + '<input id="FILE_' + deger + '" type="file"   accept="application/pdf, image/*" >' + "</div>");
                    $(htmlElement).append(fileUpload);
                    deger++;
                },
                initwidget: function (row, column, value, htmlElement) {
                   
                }
            }
            ]

    });
    var employeesSource = {
        datatype: "json",
        datafields: [{
            name: 'AD_SOYAD',
            type: 'string'
        }],
        id: 'ID',
        localData: PERSONEL
    };
    var employeesAdapter = new $.jqx.dataAdapter(employeesSource);
    $("#loader_ajax_container").remove();

}

Thank you!
Kr.

[MartinParticipant]

Hello Kr,

I have tested you code.
Here is an Example with your data, which shows how you can bind to the input event of the file input and log the uploaded file’s information.

Best Regards,
Martin

jQWidgets Team
http://www.jqwidgets.com/

[processmakeruserParticipant]

Hi Martin!

Thank you for your solution

Kind Regards

[Author]

Posts