JavaScript UI Libraries & Blazor Components Suite – Smart UI › Forums › Text Boxes & Inputs › SeleclAllOnFocus on NumericTextBox
Tagged: smart-numeric-text-box
- This topic has 5 replies, 2 voices, and was last updated 1 year ago by svetoslav_borislavov.
-
AuthorPosts
-
May 19, 2023 at 1:52 pm #104832tbettinazzi@axioma.itParticipant
In standard Testbox I found a very usefull feature SelectAllOnFocus in order to select and rewrite everithing without the need to select it.
However I din’t find the same feature on NumericTextBox and DatePicker.
For numeric textboxes it would be very usefull in oder to avoid errors.
Is there something equivalent ?
Tks
- This topic was modified 1 year, 4 months ago by tbettinazzi@axioma.it.
- This topic was modified 1 year, 4 months ago by tbettinazzi@axioma.it.
May 19, 2023 at 8:00 pm #104837svetoslav_borislavovParticipantHi,
You can select the value on focus, here is an example of that: https://codepen.io/svetoslavjqwidgets/pen/RweqLXW
Best Regards,
Svetoslav BorislavovSmart UI Team
https://www.htmlelements.com/September 15, 2023 at 4:56 pm #108700tbettinazzi@axioma.itParticipantTks for Your help.
I know the post is quite old but only now I’d the time to try to implement it.
I tried with numeric textbox but it doesn’t seem to wotk.
Here my code.<span style=”background-color: #ffffff; padding: 0px 0px 0px 2px;”><span style=”color: #000000; background-color: #ffffff; font-family: ‘Consolas’; font-size: 10pt; white-space: pre;”><span style=”color: #073642; font-weight: bold;”>function</span> </span></span>
function numericTextboxInit() {
console.log(“Entrato”);
for (let i = 0; i < document.getElementsByTagName(‘smart-numeric-text-box’).length; i++) {
console.log(“numero ” + i);
const numericTextbox = document.getElementsByTagName(‘smart-numeric-text-box’)[i];
numericTextbox.addEventListener(‘focus’, (e) => {
setTimeout(() => {
console.log(“Farei”);
e.target.select()
})
});
}
}You see a loop because I can have more than one numeric textbox.
On the console I see
Entrato
numero 0
numero 1
but nothing happen when I set the focus on a smart-numeric-text-box.
What’s wrong ?
Tks
- This reply was modified 1 year ago by tbettinazzi@axioma.it.
September 18, 2023 at 2:34 am #108703svetoslav_borislavovParticipantHi,
You should select the input element of the numeric text box and then invoke the select function.
Here is an example: https://codepen.io/dkeamcaksoem/pen/RwELxNKI hope it helps!
Best Regards,
Svetoslav BorislavovSmart UI Team
https://www.htmlelements.com/September 18, 2023 at 10:53 am #108705tbettinazzi@axioma.itParticipantI tested Your solution but I’ve a onfocus trigger
<smart-numeric-text-box id=”e53796681″ input-format=”integer” class=”elemento_testo_valore” value=”0″ name=”e53796681″ required=”” onchange=”mostraAlertMsgOption(this)” onfocus=”on_focus(this)”>
and this seems to inhibit the solution You proposed.
How can I solve it ?
Tks
September 18, 2023 at 3:50 pm #108708svetoslav_borislavovParticipantHi,
What do you execute on focus? You can both select everything and also do the other actions
If I have not understood you correctly, explain again.Best Regards,
Svetoslav BorislavovSmart UI Team
https://www.htmlelements.com/ -
AuthorPosts
- You must be logged in to reply to this topic.