Changing fields separator for a Macaddress

Question

Changing fields separator for a Macaddress

Asked 6 years ago

Viewed 57 times

2

I would like to implement an event that fixes data that is outside the standard, replacing the tab with : and put the letters in lower case. For example, the user type 00-25-66-F0-21-11, would be corrected to 00:25:66:f0:21:11.

My current code:

<html>

<form name="muda">MAC: <input type="text" name="mac" id="macad" onmouseover="capturamac()" /></form>

<script>
function capturamac(){
    var macadd = toString(muda.mac.value);
    var corrige = macadd.split('-').join(':').toLowerCase();
    document.getElementById('macad').value = toString.corrige;
}
</script>

</html>

and what’s wrong with your code? It’s not right??

– rLinhares

2018/12/04 at 17:23
Is giving [Object Undefined]

– Anderson Fidelis

2018/12/04 at 17:24
1

The toString is in the wrong place. Would: muda.mac.value.toString(). Although you don’t even need to convert to string, since the value already seems to be a string. But the Sorack answer already said it all :D

– Sam

2018/12/04 at 17:53

2 answers

Browser other questions tagged javascript replace

You are not signed in. Login or sign up in order to post.

by hkotsubo • **55,826** points · Answer 1 · 2018-12-04T17:29:14+00:00

An alternative is to use split to break the string into an array, and then use join to generate a string again.

The parameter of split is the separator (in case, -). With this, an array will be generated with the parts of the address (00, 25, etc). And the parameter of the join is the new separator (in case, :), so the parts of the array will be joined into a single string, with the parts separated by :. At last I used toLowerCase() to make letters lower case:

let endereco = '00-25-66-F0-21-11';

let correto = endereco.split('-').join(':').toLowerCase();

console.log(correto); // 00:25:66:f0:21:11

Since you are only changing one character for another, I find this solution easier. But the solution from @Sorack with regex is also valid, and I would use it for more complex cases (when the separator is not just a single character, or it can be "any tiny character or digits", or any other criterion that is easier to do with regex).

Regarding the error of Object Undefined, it occurs because of the way you are trying to capture the value of input and then set it back.

For example, call toString is unnecessary because the value is already a string. And onmouseover calls the conversion function when the mouse is placed over the field. The right would be to convert the value only after the focus is removed from the field, and for that use onblur.

The corrected code looks like this:

function capturamac(){
    var macadd = muda.mac.value;
    var corrige = macadd.split('-').join(':').toLowerCase();
    muda.mac.value = corrige;
}

<html>

<form name="muda">MAC: <input type="text" name="mac" id="macad" onblur="capturamac()" /></form>

</html>

by Sorack • **27,430** points · Answer 2 · 2018-12-04T17:24:08+00:00

First use toLowerCase in his string:

toLowerCase

The toLowerCase() method returns the string called converted to lowercase.

Then use replace:

replace
 str.replace(regexp|substr, newSubStr|function)
The replace() method returns a new string with some or all combinations of the pattern replaced by a substitute. The default can be a string or a Regexp, and the substitute can be a string or a function to be called by each combination.

Note that the replace may receive a string as a second parameter, but if this type of data is provided, only the first occurrence will be replaced. Therefore I recommend the use of a regular expression:

/-/g

Where the literal character will be matched - and used the modifier g (global).

Applying this in a conversion function:

const converter = entrada => entrada.toLowerCase().replace(/-/g, ':');

console.log(converter('00-25-66-F0-21-11'));

The above expression looks for the literal character - and uses the modifier g (global).