Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Error using $.fn.editable.defaults.mode = 'popover'; when using BootStrap 5 and jquery-3.7.1 #1190

Open
albeiroval opened this issue Sep 9, 2024 · 2 comments

Comments

@albeiroval
Copy link

Uncaught TypeError: Cannot convert undefined or null to object
at Function.values ()
at us._isWithActiveTrigger (tooltip.js:536:19)
at tooltip.js:270:16
at g (index.js:226:51)
at HTMLDivElement.a (index.js:247:5)
at s (index.js:71:11)
at index.js:253:7
_isWithActiveTrigger @ tooltip.js:536
(anonymous) @ tooltip.js:270
g @ index.js:226
a @ index.js:247
s @ index.js:71
(anonymous) @ index.js:253
setTimeout
_ @ index.js:251
_queueCallback @ base-component.js:49
hide @ tooltip.js:282
(anonymous) @ popover.js:86
each @ jquery-3.7.1.min.js:2
each @ jquery-3.7.1.min.js:2
jQueryInterface @ popover.js:75
call @ bootstrap-editable.js:4834
innerHide @ bootstrap-editable.js:4813
hide @ bootstrap-editable.js:1149
destroy @ bootstrap-editable.js:1256
(anonymous) @ bootstrap-editable.js:936
i @ jquery-3.7.1.min.js:2
remove @ bootstrap-editable.js:1408
remove @ jquery-3.7.1.min.js:2
cleanData @ jquery-3.7.1.min.js:2
empty @ jquery-3.7.1.min.js:2
(anonymous) @ jquery-3.7.1.min.js:2
M @ jquery-3.7.1.min.js:2
html @ jquery-3.7.1.min.js:2
value @ bootstrap-table.min.js:10
initBody @ bootstrap-table-editable.js:2522
(anonymous) @ bootstrap-table-editable.js:2560
dispatch @ jquery-3.7.1.min.js:2
v.handle @ jquery-3.7.1.min.js:2
trigger @ jquery-3.7.1.min.js:2
triggerHandler @ jquery-3.7.1.min.js:2
save @ bootstrap-editable.js:1221
i @ jquery-3.7.1.min.js:2
dispatch @ jquery-3.7.1.min.js:2
v.handle @ jquery-3.7.1.min.js:2
trigger @ jquery-3.7.1.min.js:2
triggerHandler @ jquery-3.7.1.min.js:2
(anonymous) @ bootstrap-editable.js:286
i @ jquery-3.7.1.min.js:2
c @ jquery-3.7.1.min.js:2
add @ jquery-3.7.1.min.js:2
submit @ bootstrap-editable.js:243
i @ jquery-3.7.1.min.js:2
dispatch @ jquery-3.7.1.min.js:2
v.handle @ jquery-3.7.1.min.js:2Understand this error

@albeiroval
Copy link
Author

Error using $.fn.editable.defaults.mode = 'popover'; when using BootStrap 5 and jquery-3.7.1

I Use this code :

`

<script src="./jquery.3.7.1/jquery-3.7.1.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-YvpcrYf0tY3lHB60NNkmXc5s9fDVZLESaAA55NDzOxhy9GkcIdslK1eN7N6jIeHz" crossorigin="anonymous"></script> <script src="./bs-editable5/js/popper.min.js"></script> <script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/bootstrap-table.min.js"></script> <script src="./extensions/editable/bootstrap-table-editable.js"></script> <script src="./bs-editable5/js/bootstrap-editable.js"></script> <script src="./fonts/all.min.js"></script> <script src="./bs-editable5/js/moment-with-locales.js"></script>
Id Nombre Precio Fecha Memo
<script> // https://github.com/twbs/bootstrap/issues/39743 // https://vitalets.github.io/x-editable/docs.html $(function() { $('#table').bootstrapTable() // $.fn.editable.defaults.mode = 'inline'; $.fn.editable.defaults.mode = 'popover'; EditableEvents() ComboDate() }) function dateFormatter(value, row, index) { var date = new Date(value); const month = date.getUTCMonth() + 1; // months from 1-12 const day = date.getUTCDate(); const year = date.getUTCFullYear(); const newDate = day + "/" + month + "/" + year; return newDate; } function ComboDate() { moment.locale('es'); } function EditableEvents() { // https://bootstrap-table.com/docs/extensions/editable/#oneditableiniteditable-initbstable console.log("EditableEvents") $('#table').on('editable-shown.bs.table', function(field, row, $el) { console.log('Show editable', field, row, $el) }) $('#table').on('editable-save.bs.table', function(field, row, rowIndex, oldValue, $el) { console.log('Save editable', field, row, rowIndex,oldValue, $el) }) $('#table').on('editable-hidden.bs.table', function(field, row, $el) { console.log('close editable', field, row, $el) }) } </script> <style> .btn-default { color: white; background-color: #e33a3a; width: 30.25px; height: 31px; } .btn-default:hover { background-color: #efa3a3; } </style> `

@francogiacobbi
Copy link

francogiacobbi commented Sep 10, 2024

I'm having same troubles with this environment:

ASP.NET 4.6.2 - Bootstrap 5.3.3 - Jquery 3.7.1 - Bootstrap-Table 1.23.2

Problem is when i try to edit cell and update value (inside table and on database).

For cell EDITING using bootstrap-editable.js with skycyclone-x-editable

I use popup editing text-box.

All is ok until application stores value in database.
Values are correctly stored in database.

Event onEditableHidden is perfect and popup text disapperead well.
New Value appears in table.

A thing that i can't understand is that tooltip.js (inside browser inspector) is located in
localhost:44300/lib/bootstrap/js/src/tooltip.js
but in my folder bootstrap there's not a js folder with src subfolder but in browser i can see code of tooltip.js

Bootstrap and Jquery Libraries are managed by Libman.

In browser inspector i receive this error

If anyone has a workaround.....

Uncaught TypeError: can't convert null to object
    _isWithActiveTrigger tooltip.js:536
    hide tooltip.js:270
    g index.js:226
    a index.js:247
    s index.js:71
    _ index.js:253
    setTimeout handler*_ index.js:251
    _queueCallback base-component.js:49
    hide tooltip.js:282
    jQueryInterface popover.js:86
    jQuery 2
    jQueryInterface popover.js:75
    call bootstrap-editable.js:4834
    innerHide bootstrap-editable.js:4813
    hide bootstrap-editable.js:1149
    destroy bootstrap-editable.js:1256
    init bootstrap-editable.js:936
    i jQuery
    remove bootstrap-editable.js:1408
    jQuery 6
    value bootstrap-table.min.js:10
    value bootstrap-table-editable.min.js:10
    value bootstrap-table-filter-control.min.js:10
    value bootstrap-table-editable.min.js:10
    jQuery 4
    save bootstrap-editable.js:1221
    jQuery 5
    submit bootstrap-editable.js:286
    jQuery 3
    submit bootstrap-editable.js:243
    jQuery 10
    render bootstrap-editable.js:114
    jQuery 9
    render bootstrap-editable.js:92
    editableform bootstrap-editable.js:410
    jQuery 2
    editableform bootstrap-editable.js:401
    renderForm bootstrap-editable.js:1081
    show bootstrap-editable.js:1127
    show bootstrap-editable.js:1810
    toggle bootstrap-editable.js:1832
    init bootstrap-editable.js:1555
    jQuery 9
    init bootstrap-editable.js:1540
    Editable bootstrap-editable.js:1485
    editable bootstrap-editable.js:2147
    jQuery 2
    editable bootstrap-editable.js:2133
    value bootstrap-table-editable.min.js:10
    jQuery 2
    value bootstrap-table-editable.min.js:10
    each jQuery
    value bootstrap-table-editable.min.js:10
    value bootstrap-table-filter-control.min.js:10
    value bootstrap-table.min.js:10
    value bootstrap-table.min.js:10
    value bootstrap-table-filter-control.min.js:10
    timeoutId bootstrap-table-filter-control.min.js:10
    setTimeout handler*ag/< bootstrap-table-filter-control.min.js:10
    jQuery 6
        dispatch
        handle
        trigger
        trigger
        each
        each
[tooltip.js:536:18](https://localhost:44300/lib/bootstrap/js/src/tooltip.js)



Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants