How to use file uploads when editing your data

SQLite Edit for PHP supports the use of file upload form input types in the edit form. This means that you can use SQLite Edit for PHP to create forms and have an option to upload files from your desktop computer to the web server.

Once uploaded, you can choose to store the files either on the file system or within the database itself.

There are two demos in the download archive: editable-file.php which stores the uploaded files in a directory on the file system (only the file name is recorded in the database) and editable-file-database.php which stores the base64 encoded image within the database itself. Doing this may make more sense to you by keeping the backup requirements simple (just the database file). Here's the source code of an editor that has a file upload form input:

<?php
    $editor = new SQLiteEdit([
    
        // The database file
        'filename' => './sqliteedit.db',
        
        // For this example we'll use a table called images.
        'table' => 'images',

        //
        // Set the image field as being editable. This means that
        // we'll be able to add new data to the database.
        //
        'editable' => [
            'image' => true
        ],
        
        // 
        // Stipulate that the image field is a file upload type
        // instead of it being a plain old text input type.
        //
        'editable_types' => [
            'image' => 'file'
        ],
        
        
        //
        // This defines a function that's called when the table is
        // displayed. It uses the base64 encoded data that's in the
        // database as a data: URL that's the src of an image tag.
        // The link around the image tag just links directly to the
        // data: URL so that you can click the smaller image and
        // then see the full-size image.
        //
        // If you wanted you could extend this into using the
        // editor_modal.show function to popup a modal dialog with
        // the image inside of it.
        //
        'columns_callbacks' => [
            'image' => function ($editor, $row, $name, $value)
            {
                if ($value) {
                    return sprintf(
                        '<a href="./uploaded-images/%s"><img src="./uploaded-images/%s" height="32"/></a>',
                        $value,
                        $value
                    );
                }
            }
        ],
        
        
        //
        // The image field is not escaped so that the image is seen
        // by the user and not the HTML tag that we created in the
        // columns_callback function above.
        //
        'columns_escape' => [
            'image' => false
        ],
        
        //
        // When a file is uploaded this code is run. The function
        // moves the upoaded file into a sub-directory called
        // uploaded-images.
        //
        // On your server you might need to set this directory
        // (or the current directory) to be writeable by the
        // webserver so that it can save the images that are
        // uploaded.
        //
        'editable_types_file_callbacks' => [
            'image' => function ($obj, $field, $file)
            {
                // Ensure the current directory is writeable
                if (!is_writeable('.')) {
                    editor_messages::error($GLOBALS['editor']->id, 'The directory containing the examples is not writeable!');
                    editor_redirect('editable-file.php');
                }

                //
                // Make the uploaded-images folder if it doesn't
                // already exist.
                //
                if (!file_exists('./uploaded-images')) {
                    mkdir('uploaded-images');
                }
            
                if ($file['error'] === UPLOAD_ERR_OK) {
                    $filename = basename($file['tmp_name']) . '.png';
    
                    // Move the file into the uploaded-images folder
                    move_uploaded_file(
                        $file['tmp_name'],
                        './uploaded-images/' . $filename
                    );
    
                    // Whatever is returned by this function gets
                    // stored in the database.
                    return $filename;
                }
            }
        ],
        
        
        'columns_widths' => [
            'id' => 75
        ],
        'paging_perpage' => 10,
        'style' =>[
            'div.editor {line-height: initial;}',
            'div.editor table {margin-left: auto; margin-right: auto; width: 675px;}',
            'div.editor :where(button, input) {font-size: 16pt;}',
            'div.editor input[type=checkbox]{cursor: pointer;transform:scale(1.5) !important;}'
        ]
    ]);
    
    $editor->draw();
?>

The editable-file-database.php example file in the download archive shows you an example of storing the base64 encoded image file in a field in the database (the images_database table).

Last updated: 9th October 2026