Upgrade project to bs5 issues

I upgraded a project from bs4 to bs5, pretty simple, all works well, but have some minor differences such as
I had custom toggles before, that on modal close would auto switch themselves off if they were on, however they no longer do that.
I think it is this file from the old project, that seems like it has no new bs5 version.

<script src="dmxAppConnect/bs-custom-file-input/bs-custom-file-input.min.js"></script>

Can anyone confirm please.

bs4 code for reference

<div class="modal fade" id="modalTagAdder" is="dmx-bs4-modal" tabindex="-1" role="dialog" dmx-on:hide-bs-modal="switchTagEditor.setValue(switchTagEditor.select(false))">
    <div class="modal-dialog modal-dialog-centered" role="document">
        <div class="modal-content">
            <div class="modal-header">
                <h5 class="modal-title">Tag Manager</h5>
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">X</span>
                </button>
            </div>
            <div class="modal-body">
                <div class="mb-3">
                    <p>Tag Manager, no spaces, no special characters, use CamelCase to distinguish word breaks.</p>
                    <form id="formAdminTagNew" method="post" is="dmx-serverconnect-form" action="api/image-manager/tags/tag-add" dmx-on:success="formAdminTagNew.reset();sctaglist.load()" class="mb-4 pkt-footer-underline pb-4">
                        <div class="input-group">
                            <input id="textTagNew" name="textTagNew" type="text" class="form-control" placeholder="Example: ArcticWolf" aria-label="Example: ArcticWolf" aria-describedby="btnTagNew" required="" data-rule-lettersonly=""
                                data-rule-nowhitespace="">
                            <div class="input-group-append">
                                <button class="btn btn-outline-success" type="submit" id="btnTagNew">Add Tag</button>
                            </div>
                        </div>
                    </form>
                </div>
                <div>
<!-- NOT WORKING BS5 -->
                    <div class="custom-control custom-switch text-right">
                        <input type="checkbox" class="custom-control-input" id="switchTagEditor">
                        <label class="custom-control-label" for="switchTagEditor">Enable/Disable Editor</label>
                    </div>
<!-- NOT WORKING BS5 -->
                    <div class="table-responsive">
                        <table class="table table-striped table-bordered table-hover table-sm">
                            <thead>
                                <tr>
                                    <th>Current Tags</th>
                                </tr>
                            </thead>
                            <tbody is="dmx-repeat" dmx-generator="bs4table" dmx-bind:repeat="sctaglist.data.queryTags" id="tableRepeat1">
                                <tr>
                                    <td>
                                        <span dmx-hide="switchTagEditor.checked">{{mit_tag_name}}</span>
                                        <form id="formAdminTagEdit" method="post" is="dmx-serverconnect-form" class="form-inline" action="api/image-manager/tags/tag-edit" dmx-on:success="formAdminTagEdit.reset();sctaglist.load()"
                                            dmx-show="switchTagEditor.checked">
                                            <input id="textTagEditId" name="textTagEditId" type="hidden" class="form-control" required="" dmx-bind:value="mit_id">
                                            <div class="input-group w-100">
                                                <input id="textTagEdit" name="textTagEdit" type="text" class="form-control" required="" data-rule-lettersonly="" data-rule-nowhitespace="" dmx-bind:value="mit_tag_name">
                                                <div class="input-group-append">
                                                    <button id="btnTagEdit" class="btn btn-outline-success" type="submit">Save Edit</button>
                                                    <button class="btn btn-outline-danger" dmx-on:click="sctagdelete.load({delete_tag_id: mit_id});sctaglist.load()"><i class="far fa-trash-alt fa-fw text-danger"></i></button>
                                                </div>
                                            </div>
                                        </form>
                                    </td>
                                </tr>
                            </tbody>
                        </table>
                    </div>
                </div>
            </div>
            <div class="modal-footer">
                <button type="button" class="btn btn-secondary" data-dismiss="modal">Close</button>
            </div>
        </div>
    </div>
</div>

Edit: Just checked the bs-custom-file-input.min.js file, and it is not that, so I am not sure what it is to be honest.

Community Page
Last updated: