HTML Filedialog Datei-Erweiterungen festlegen zur Laufzeit

input_Files.attributes["accept"].value = ".jpg,.png,.tiff,.jpeg,.bmp,.gif"; 

function editor_open_FileDialog_Images() {

    //------< editor_open_FileDialog_Images() >------

    editor_Remove_all_ImageResize_Divs();

    editor_open_FileDialog("Images", ".jpg,.png,.tiff,.jpeg,.bmp,.gif");; //or image/*"

    //------</ editor_open_FileDialog_Images() >------

}

function editor_open_FileDialog_Videos() {

    //------< editor_open_FileDialog_Videos() >------

    editor_open_FileDialog("Videos", ".mp4");; //video/*"

    //------</ editor_open_FileDialog_Videos() >------

}

function editor_open_FileDialog_Files() {

    //------< editor_open_FileDialog_Videos() >------

    editor_open_FileDialog("Files", ".zip,.pdf,.doc?,.dot?,.xls?,.xlt?,.ppt?,.css,.txt,.csv,.cs,.json,.ts,.html,.js,.map,.ico,.user,.cshtml,*.accdb,.  flp");; //*"

    //------</ editor_open_FileDialog_Videos() >------

}

function editor_open_FileDialog(sFileType,sExtensions) {

    //------< editor_open_FileDialog() >------

    //editor_Remove_all_ImageResize_Divs();

    varUpload_Files_Type = sFileType;

    var input_Files = document.getElementById("files_input_field");

    input_Files.attributes["accept"].value = sExtensions;  //".jpg";

    input_Files.click();    //*do not debug at this point, debug at this code-point in browser does not work

    //------</ editor_open_FileDialog() >------

}

        @*----< Upload_Images_Dialog >----*@

    <form method="post" enctype="multipart/form-data">

        <input type="file" id="files_input_field" name="files" accept="" multiple style="visibility:hidden; height:0px;width:0px;" onchange="upload_Files_onChanged();" />

        @*image/**@

    </form>

        @*----</ Upload_Images_Dialog >----*@

@*-------< Right_Toolbar >-------*@

    <div id="divRight_Toolbar" class="divToolbarArticleEdit">

        @*--------< divInteract >--------*@

        <div id="divToolbarFloatArticle" class="divToolbarFloatArticle">

            <a title="View" class="fab_Button" onclick="save_to_View();">

                <span class="fab_Icon">✔</span>

            </a>

            <hr style="margin:40px;;" />

            <a title="Insert Images" class="fab_Button fab_Button_edit" onclick="editor_open_FileDialog_Images();">

                <span class="fab_Icon">+📸</span>

            </a>

            <a title="Insert Videos" class="fab_Button fab_Button_edit" onclick="editor_open_FileDialog_Videos();">

                <span class="fab_Icon">+🎞</span>

            </a>

            <a title="Upload and Insert Any files" class="fab_Button fab_Button_edit" onclick="editor_open_FileDialog_Files();">

                <span class="fab_Icon">+📎</span>

            </a>

            <a title="Delete" class="fab_Button fab_Button_red" onclick="Delete_Record();">

                <span class="fab_Icon">🗑</span>

            </a>

            <progress id="ctlProgress" value="0" max="100" style=" visibility:hidden;display:inline-block;width:100%;height:30px;position:fixed;bottom:0px;left:0px"></progress>

            <br />

        </div>

        @*--------</ DivInteract >--------*@

    </div>

    @*-------</ Right_Toolbar >-------*@

.fab_Button {

    display: inline-flex;

    padding: 20px;

    height: 70px;

    width: 70px;

    justify-content: center;

    margin-bottom: 4px;

    background-color: limegreen;

    font-size: x-large;

    border-radius: 40px;

    box-shadow: 4px 4px 8px darkgrey;

}

.fab_Button_edit {

    background-color: dodgerblue;   

}

.fab_Button_red {

    background-color: indianred;

}

.fab_Button:hover {

    background-color: lawngreen;   

}

.fab_icon {

}

.divToolbarArticle{

    width:40px;

    flex-direction:column;

}