CODEWITHSUNDEEP
javascriptjqueryregex
Foreba
Foreba

Reputation: 410

Regular expression in Javascript with a stopping character

I'm using the jQuery toggle function to change some characters of an text input. Each time the user clicks a button, the input value gets the value of the button (which is a | with a number). When the user click the button again, the script needs to remove the button's character of the value of the input.

For instance, if the input's value is 0|1|2|3|4|5 and the button has the 0| value, when the user clicks the button for the first time, the input's value should change to 1|2|3|4|5, but when the user clicks the button for the second time, the value should change to 1|2|3|4|5|0.

I did it and it's worked perfectly until I noticed that my regular expression wasn't so accurate.

Take a look at these chacarters: 0|1|2|3|4|5|6|7|8|9|10

There are two numbers that match the regular expression: |1 and |10

So, I need to fix it, look at my code:

    $('.topmenu_permission').toggle(function(){
    var permission = $(this).attr('name');
    var valor = $('#userpermission').val();

    var pattern = permission, re = new RegExp(pattern, "g");

    valor = valor.replace(pattern, '');

    $('#userpermission').val(valor + '' + permission);

    $(this).css({ 'background' : 'green', 'color' : 'white' });

    return false;

}, function(){
    var permission = $(this).attr('name');
    var valor = $('#userpermission').val();

    var pattern = permission, re = new RegExp(pattern, "g");

    valor = valor.replace(pattern, '');

    $('#userpermission').val(valor);

    $(this).css({ 'background' : '#ddd', 'color' : '#000' });

    return false;
});

Thank you very much guys, I converted the string to an array and now it's working perfectly well.

Look at the final code:

    $('.topmenu_permission').toggle(function(){
    var needle = $(this).attr('name').replace('|', '');
    var myString = $('#userpermission').val();
    myString = myString.split('|');
    var index = $.inArray(needle, myString);
    if( index >= 0)
    {
        myString.splice(index,1);
    }
    myString = myString.join('|');
    myString = myString + '|' +  needle;
    $('#userpermission').val(myString);
    $(this).css({ 'background' : 'green', 'color' : 'white', 'text-shadow' : 'none' });
    return false;
}, function(){
    var needle = $(this).attr('name').replace('|', '');
    var myString = $('#userpermission').val();
    myString = myString.split('|');
    var index = $.inArray(needle, myString);
    if( index >= 0)
    {
        myString.splice(index,1);
    }
    myString = myString.join('|');
    $('#userpermission').val(myString);
    $(this).css({ 'background' : '#ddd', 'color' : '#000' });
    return false;
});

Upvotes: 1

Views: 164

Answers (1)

Jonathan M
Jonathan M

Reputation: 17451

One way is to temporarily convert the string to an array, use $.inArray() to find the match, remove it from the array, the convert the array back to a delimited string.

This involves no regex, but it gets the job done.

var needle = "1";
var myString = "0|1|3|10|25";
var myNewString = myString; // the initial value of the result
var myArray = myString.split("|");
var needleLocation = $.inArray(needle,myString);
if (needleLocation >= 0) {
    myNewString = myArray.splice(needleLocation,1).join("|");
}
alert(myNewString);

More info: http://api.jquery.com/jQuery.inArray/

Also found this, which might be helpful: String manipulation - removing an element from a list

Upvotes: 1

Related Questions