How to download an image as base64 from db only, not from a folder, usind c#, .net

ASWS

Also it seems that the image table gets a new row on any edit type file select action. It doesnt seem to update any existing row, it just adds a row each time the user selects a file. Is this the default behaviour, or my buggy setup?

ASWS

I integrate it now in the way I currently understood it, ok.

I finally just need to know how to run a raw sql in .net syntax after some editor event like "closed". Couldn't find anything so far in .net...

That should do it then. Thanks in advance!!

ASWS

ok found it, so in order to execute raw sql, linked to editor events with .net mvc,
in the editor-controller add:

.Validator((editor, type, args) =>
                    {
                            editor.PostEdit += (sender, e) => Update_AvatarTables_AfterUpload(db, e.Id);
                            return null;                     
                    })

--------------------------

void Update_AvatarTables_AfterUpload(Database db, object id)
            {
                var sqlQuery = 
                    "UPDATE  ... etc ; ";

                // execute stored procedure
                db.Sql(sqlQuery);
            }

ASWS

hello again,
I would need some more info here pls:
how to read the ajax json response after the edit window was opened and subsequently a file selected in windows explorer for download?

I tried something like this but without success:

var editorEdit = new $.fn.dataTable.Editor({
                ajax: { 
                    type: "POST",
                    url: "/api/AdminFileUploadEdit",
                    contentType: 'application/json',
                    data: function (data) {
                        jsonData = JSON.parse(data);
                        xyz = jsonData.xyz;                        
                        }
                    }
                },
                table: "#xyz",

allan

Each time the upload db method inserts a row, or the id field is just left empty by your method

I've assumed that the id field would be a serial (auto-increment). What is your use case that this would be a problem? Such a field is ideal for foreign key references from the host table.

how to read the ajax json response after the edit window was opened and subsequently a file selected in windows explorer for download?

It depends exactly what you want to do? But uploadXhrSuccess will give you access to the JSON response from an upload action.

Allan

ASWS

I've assumed that the id field would be a serial (auto-increment). What is your use case that this would be a problem? Such a field is ideal for foreign key references from the host table.

Hi Allen, actually this might be a valid approach, but how about integration into an existing db-structure (that maybe shouldn't be altered), data-migration of existing or historical data involving a new dt upload-table... Also, serial means serial growth, how about updates and deletes in integrated/linked db-tables?

If the datatable upload mechanism could just offer the possibility to freely assign a target upload table incl. freely assigned additional key & data fields (e.g. fields enriched with serverside data), it would be perfectly flexible for many use cases. (e.g. get rid of the image table right away and just use existing structures)

ASWS

Thanks Allen, your advice did it. I overlooked the "uploadXhrSuccess" event. (as it's last on the events list, who reads documentation anyway lol )

I assign some vars like this now, works fine (.net asp core, in mvc view, js part. -> just as example for var attribution by dt events, dt logic behind was changed...):

            //--- uploadXhrSuccess :-> after windows explorer opened 
            //--- and file selected, read json response!

            editorEdit.on('uploadXhrSuccess', function (e, fieldName, json) {
                avatarFileName = json.files.dte_image_helptable[0].file_name;
                avatarFileAndPath = ("@directory_root_files" + json.files.dte_image_helptable[0].file_name);
            });

            editorEdit.on('submitSuccess', function (e, data, fieldName, json) {
                $.ajax({
                    url: "@Url.Action("Index", "API_PartialAvatarArray")",
                    method: "POST",
                    data: JSON.stringify(data),
                    contentType: "application/json",
                    dataType: "json"
                }).done(function (data) {
                    jsonData = JSON.parse(data);
                    jsAvatarArray = jsonData.JsonArray;
                    parentTable.ajax.reload(); 
                    //setTimeout(function () { parentTable.ajax.reload(); }, 1000);
                });
            });

ASWS

subsequently above vars are used to fill the edit menu pic placeholder aso, like this (.net):

var editorEdit = new $.fn.dataTable.Editor({
                ajax: "/api/AdminFileUploadEdit",
                table: "#file_upload_edit",
                fields: [
                    { label: "address_id", name: "address.address_id", className: "text-primary", type: "hidden" },
                    { label: "Benutzer:", name: "user.user_id", className: "text-primary", type: "select", placeholder: "--Auswahl Benutzer:--" },
                    { label: "Firma:", name: "company.company_id", className: "text-info", type: "select", placeholder: "--Auswahl Firma:--" },
                    {   label: "Avatar:",
                        name: "contact_info.dte_image_id",
                        type: "upload",
                        display: function () {
                            if (avatarFileAndPath != "")
                            {
                            return '<img src="'+ avatarFileAndPath +'" width="50px" height="50px"/>';
                            }
                            else
                            {
                            return '<img src="data:image/png;base64,' + jsAvatarArray[selected_row] + '" width="50px" height="50px"/>';
                            }
                        avatarFileAndPath = "";
                        },
                    className: 'text-dark btn-sm-menu',
...
...

get selected_row for edit in dt table:

            parentTable.on('click', 'td', function () {
                var tr = $(this).closest("tr");
                selected_row = tr.index() + 1;
            });

allan

Very nice solution - thank you for sharing that! I've opened a bug on our tracker to make it easier to specify your own id in future

Allan

ASWS

We enjoy datatables, it really gives us added value in our .net asp projects, so thank you guys..!!!

cc: "specify own id in future..."

.Field(new Field("contact_info.dte_image_id")
                            .Upload(new Upload(@directory_var)
                            //- inserts a row with some id and a contentbinary into this table
                            .Db("dte_image_helptable", "image_id", new Dictionary<string, object>
                            {
                            {"system_path", Upload.DbType.SystemPath},
                            {"file_name", "__ID____EXTN__" }, //Upload.DbType.FileName},
                            {"file_size", Upload.DbType.FileSize},
                            {"image_blob", Upload.DbType.ContentBinary}
                        })
                        .Validator(Validation.FileSize(500000, "Max file size is 500K."))
                        .Validator(Validation.FileExtensions(new[] { "jpg", "png", "gif" }, "Please upload an image."))
                        ).SetFormatter(Format.NullEmpty()))

the above syntax is used in the .net / controller as upload definition.

It involves 2 tables and has predifined fields like:

                            {"system_path", Upload.DbType.SystemPath},
                            {"file_name", "__ID____EXTN__" }, //Upload.DbType.FileName},
                            {"file_size", Upload.DbType.FileSize},
                            {"image_blob", Upload.DbType.ContentBinary}

if a choice would be given to
a) use your setup
or
b) modify the default setup and use just 1! table of choice PLUS freely add fields like the 4 shown above, e.g.: {"my_field", @my_funny_content}

I think this would nail it

allan

Long dormant thread this - sorry! However, I'm working though some of the backlog issues at the moment and I wanted to get this one sorted out. I've come up with what I think is a nice way to handle custom id values.

If you define a column in the array of column properties to set that matches the name of the primary key column, then the value given will be used. That means it can be a function that goes to some other service (Snowflake, or a UUID generator?) and use that value. The returned id will then be used in the remainder of the code.

This will be included in Editor 2.1 and our .NET, PHP and Node.js libraries have all been updated for this.

Allan