Fixed a bug where if inputParent was empty, nothing would render. Do not remove the parent css, this can cause unexpected issues in layouts Use bootstrap's auto margin and max widths to fix a few layout bugs on some devices.
Jeremy D commited on 2021-11-24 11:14:11
Showing 2 changed files, with 18 additions and 4 deletions.
- demo.html 7f8a934..9e1ebfb
- jquery-numbercontrol.js b6623c1..32c75e0
| ... | ... |
@@ -24,6 +24,9 @@ |
| 24 | 24 |
<li class="nav-item"> |
| 25 | 25 |
<a class="nav-link" data-tab="highlight">Highlight</a> |
| 26 | 26 |
</li> |
| 27 |
+ <li class="nav-item"> |
|
| 28 |
+ <a class="nav-link" data-tab="noparent">No Parent</a> |
|
| 29 |
+ </li> |
|
| 27 | 30 |
</ul> |
| 28 | 31 |
|
| 29 | 32 |
<div id="content_containers"> |
| ... | ... |
@@ -74,6 +77,13 @@ |
| 74 | 77 |
</datalist> |
| 75 | 78 |
</div> |
| 76 | 79 |
</div> |
| 80 |
+ |
|
| 81 |
+ <!-- No Parent --> |
|
| 82 |
+ <div id="viewbox_noparent" style="display:none;"> |
|
| 83 |
+ <div class="col-sm-2"> |
|
| 84 |
+ <input type="numbere" id="numbercontrol_noparent" value="0" min="-1" max="1" /> |
|
| 85 |
+ </div> |
|
| 86 |
+ </div> |
|
| 77 | 87 |
</div> |
| 78 | 88 |
|
| 79 | 89 |
<script type="text/javascript" src="https://code.jquery.com/jquery-3.5.1.min.js"></script> |
| ... | ... |
@@ -134,6 +144,10 @@ |
| 134 | 144 |
} |
| 135 | 145 |
}); |
| 136 | 146 |
|
| 147 |
+ // The No parent number controls. |
|
| 148 |
+ $('#numbercontrol_noparent').numbercontrol({
|
|
| 149 |
+ 'inputParent': '' |
|
| 150 |
+ }); |
|
| 137 | 151 |
|
| 138 | 152 |
// Example of how we can do a filtered highlight list for example of a room list. |
| 139 | 153 |
function filterRoomList(dataselector, value) |
| ... | ... |
@@ -171,11 +171,11 @@ |
| 171 | 171 |
var $maxValue = findMinMaxValue(options.max, $base.attr('max'), Number.MAX_SAFE_INTEGER);
|
| 172 | 172 |
|
| 173 | 173 |
// Build the parent up. |
| 174 |
- if (!$($base).parent().is('div') || !$($base).parent().hasClass('numberControlDestoryed')) {
|
|
| 174 |
+ if (options.inputParent != '' && (!$($base).parent().is('div') || !$($base).parent().hasClass('numberControlDestoryed'))) {
|
|
| 175 | 175 |
$base.wrap('<' + options.inputParent + '></' + options.inputParent + '>');
|
| 176 | 176 |
} |
| 177 | 177 |
var $parent = $base.parent(options.parentSelector); |
| 178 |
- $parent.removeClass().addClass(options.inputParentCss); |
|
| 178 |
+ $parent.addClass(options.inputParentCss); |
|
| 179 | 179 |
|
| 180 | 180 |
// Set the base. |
| 181 | 181 |
$base.attr('type', options.type);
|
| ... | ... |
@@ -246,7 +246,7 @@ |
| 246 | 246 |
$KeyboardLayout = options.keyboardLayout; |
| 247 | 247 |
else |
| 248 | 248 |
$KeyboardLayout = |
| 249 |
- '<div class="modal-dialog modal-dialog-centered" style="width: 250px;">' + |
|
| 249 |
+ '<div class="modal-dialog modal-dialog-centered m-auto" style="width: 250px;">' + |
|
| 250 | 250 |
'<div class="modal-content">' + |
| 251 | 251 |
'<table>' + |
| 252 | 252 |
'<tr>' + |
| ... | ... |
@@ -279,7 +279,7 @@ |
| 279 | 279 |
|
| 280 | 280 |
// Fill out the input. |
| 281 | 281 |
if (typeof options.keyboardControl['INPUTBOX'] === 'undefined') |
| 282 |
- options.keyboardControl['INPUTBOX'] = '<input class="numberControlVirtualNumPad numberControlVirtualNumPadINPUT form-control" type="text" readonly value="{VAL}"/>';
|
|
| 282 |
+ options.keyboardControl['INPUTBOX'] = '<input class="numberControlVirtualNumPad numberControlVirtualNumPadINPUT form-control w-100" type="text" readonly value="{VAL}"/>';
|
|
| 283 | 283 |
$KeyboardLayout = $KeyboardLayout.replace('{INPUTBOX}', options.keyboardControl['INPUTBOX'].replace('{VAL}', $base.val()).toString());
|
| 284 | 284 |
|
| 285 | 285 |
// Fill out all buttons. |
| 286 | 286 |