KendoMaskedTextBox bind unmasked value

[Michael]

How can I make the KendoMaskedTextBox for Vue bind with v-model against the unmasked value?  For example, if my mask is "00000-0000" for a US postal code, and I enter "30157" in the control, it will currently bind "30157-____".  I need it to bind as "30157" (no hyphen, and no underscores).  I could strip out what I don't want on the server, but it seems like that shouldn't be necessary.

 

[Nencho]

Hello Michael,

You can use computed property and raw() method of the maskedtextbox, which will return you the value without the mask. The Example below shows such implementation:

https://stackblitz.com/edit/w3zycn-wrqpqy?file=index.html

Hope this would help.


Regards,
Nencho
Progress Telerik

[Michael]

Thanks!  We're using v-model against a property on an object that came back from a service call.  I think ideally, there would just be an option you can specify on kendoMaskedTextbox that tells it whether to bind against the raw value or not.  That would have required zero changes in my component, and just a minor change in the template.

[Nencho]

Hello Michael,

I understand your point. That being said, I can suggest you a slight alternative of the previous approach:

https://stackblitz.com/edit/w3zycn-wrqpqy?file=index.html

The above example following the Vue Model Binding and it does require only a specification of the value for the model:

https://www.telerik.com/kendo-vue-ui/components/framework/model-binding/#toc-events

Hope this would help.

Regards,
Nencho
Progress Telerik

[Michael]

That does seem to work in conjunction with v-model as well, so we at least have something that works from the view.  I think other people are going to need this capability too, and it should just be a simple boolean property to control how it binds, if you're able to log that somewhere.  Thanks!

[Nencho]

Hello Michael,

I have created a Feature Request on your behalf in your brain new Feedback Portal below:

https://feedback.telerik.com/kendo-vue-ui/1362250-add-the-ability-to-implement-model-binding-to-the-raw-value-of-the-maskedtextbox

You can vote for and track the item in the link above.

Regards,
Nencho
Progress Telerik

[Zerry]

[quote]Nencho said:Hello Michael,

I understand your point. That being said, I can suggest you a slight alternative of the previous approach:

The above example following the Vue Model Binding and it does require only a specification of the value for the model:

Hope this would help.

Regards,
Nencho
Progress Telerik

[/quote]

I think ideally, there would just be an option you can specify on kendoMaskedTextbox that tells it whether to bind against the raw value or not.

[Nencho]

Hello Michael,

Thanks for the additional specification. Generally, I would suggest you have your comment added to the FeedBack portal as well. I have updated it, though, having your comment added to the specification of the item.

https://feedback.telerik.com/kendo-vue-ui/1362250-add-the-ability-to-implement-model-binding-to-the-raw-value-of-the-maskedtextbox

Thanks for your suggestion!

Regards,
Nencho
Progress Telerik