want to show success message after file upload

want to show success message after file upload

ashiersashiers Posts: 101Questions: 8Answers: 7
edited February 2016 in Editor

Given the following javascript, once the file uploads, I'd like to display a message like: "File Upload Successful." right on the form itself. As it stands now, the upload button simply does a percentage count up to 100%. I'd like a message displayed once it completes. Is that even possible? As you can see, the success function is setup to display an alert for now, but it doesn't even fire on a file upload. I'm thinking the upload type field has its own internal ajax call separate from the form itself? If we do get this working, how do I make the Create and Edit forms display my message just as any error message might be displayed?

var editor;
var table;  
var rowid;

$(document).ready(function() {
    editor = new $.fn.dataTable.Editor( {
        ajax: {
            url: "../jsp/uploadfiletodb.jsp",
            type: "POST",
            success: function (data) {
                alert("success function: " + data);
            }
        },
        table: "#example",
    title: "Upload File",
        fields: [ 
            {
               label: "ID:",
               name: "DT_RowId",
               type: "readonly"
            },          
            {
                label: "Select A File:",
                name: "content",
                type: "upload",
                ajaxData: function ( fd ) {
                   alert("id: " + editor.field('DT_RowId').val());
                   if(editor.field('DT_RowId').val() != "")
                   {
                      //a reminder that I changed the name of the field specifically for uploads
                      //thus the name Upload_RowId is what Parameters is expecting on an update.
                      fd.append( 'Upload_RowId', editor.field('DT_RowId').val() );
                   }
                }               
            }
        ]       
    } );

  table = $('#example').DataTable( {
        dom: "Bfrtip",
        ajax: "../jsp/uploadfiletodb.jsp",
        columns: [
            { data: "filename" },
            { data: "filesize" },
            { data: "mimetype" },
            { data: "modified" }
        ],
        select: true,
        buttons: [
            {
              extend: 'create',
              editor: editor,
              formButtons: [
                {
                    label: 'Close',
                    fn: function () {                      
                       table.row(rowid).deselect();
                       table.ajax.reload();
                       this.close();
                    }
                }                
              ]           
            },
            {
              extend: 'edit',
              editor: editor,
              formButtons: [
                {
                    label: 'Close',
                    fn: function () {                      
                       table.row(rowid).deselect();
                       table.ajax.reload();
                       this.close();
                    }
                }                
              ]           
            },            
            { extend: "remove", editor: editor },
            { extend: "selectedSingle",
              text: "Download File",
              action: function(e,dt,node,config){                               
                //alert("ID: " + rowid + " This function is temporarily undefined");
                $("input#rowid").val(rowid);
                //Submit the hidden form for processing.
                $("form#myform").submit();
              }  
            }
        ]       
    } );
    //Record the id of every row clicked on
    $('#example').on( 'click', 'tr', function () {
       rowid = table.row( this ).id();
       //selector = table.row( rowid );    
    } );
    //Hide the form
    $("div#hiddenform").hide();

Answers

  • allanallan Posts: 63,498Questions: 1Answers: 10,471 Site admin

    Currently no - there isn't really a way of doing this I'm afraid. The only notification you have of a change in file is the render callback of the upload field type. I expected that to be used to show information about the uploaded file and thought that would be enough. Is that not the case here?

    One other point - as the ajax documentation notes, you shouldn't override the success function - doing so would overwrite Editor's own success callback.

    Allan

  • ashiersashiers Posts: 101Questions: 8Answers: 7

    OK. I was thinking that might be the case. No problem. We'll live with it. At least the example as a whole is functional.

This discussion has been closed.