Text Input MaxLength

How can I limit the max Length of a TextInput?

Thanks!

Do yo mean max string length or max width of the control itself?

There is no built-in mechanism to control the max string length, but you can listen to the TextChanged event and enforce it yourself from code.

The maximum width of the control can be set with MaxWidth

Im trying to limit the .Text.Length but I dont find a MaxLength variable. How can Achive this?

I try something like this:

void TextChange(object sender, object args){
    if(Myinput.Text.Length > 140){
    Myinput.IsEnabled = false;
    }
}

or

void TextChange(object sender, object args){
    if(Myinput.Text.Length > 140){
    Myinput.Text.Substring(0, 140);
    }
}

But nothing…

In case someone else wants to do this, I don’t think you want to disable the field, since the user then can’t change it any more.

This works for me:

Assuming your field is something like this:

You can then do this in the js:

exports.myInputField = Observable();

exports.myInputFieldChanged = function(args) { if(args.value.length > 3) { // or whatever max is myInputField.value = args.value.slice(0, 3); } }

I can’t figure out a way to automatically invoke the sender value property which is a bit annoying…

Oops Trying again…

Assuming your text field in the ux is something like this:

<TextEdit value="{myInputField}" valueChanged="{myInputFieldValueChanged}"/>

You can do this in the js:


exports.myInputField = Observable();

exports.myInputFieldChanged = function(args) { 
    if(args.value.length > 3) { // or whatever max is 
    myInputField.value = args.value.slice(0, 3); 
    } 
}

I can’t seem to figure out how to automatically invoke the sender’s value property. You can get the name of the sender with args.sender, so I guess you could write some code to automatically do the translation if you have enough fields…

Here’s a more generic approach that seems to work. In the UX:

<TextEdit Value="{inputs.myInput.value}" ValueChanged="{inputs.myInput.valueChanged}"/>

In the JS file you can then create a hash with a key value pair for each input field:

exports.inputs = {
    myInput: new MyInputField()
}

function MyInputField() {
    self = this;

    self.value = Observable();

    self.valueChanged = function(args) {
        if(args.value.length > 3) { // or whatever max is 
            self.value.value = args.value.slice(0, 3);    
        }
    }
}