Question

How do I make alert() return either 123, 456 or the nth group key?

I wanna retrieve the index key is to do some chain operations on the corresponding option values.

Note: The index keys could just as well be alphanumeric.

HTML:

<select name="option[group][123]">
    <option>a</option>
    <option>b</option>
</select>
<select name="option[value][123]">
    <option>1</option>
    <option>2</option>
</select>

<select name="option[group][456]">
    <option>a</option>
    <option>b</option>
</select>
<select name="option[value][456]">
    <option>1</option>
    <option>2</option>
</select>

Script:

$("select[name^='option[group]']").change(function(){
  alert('Index:' + $(this).fieldsetIndexKeyIdentifier());
  // Do something with option values of group
});

Answer 1

You can parse it out of the name attribute like this:

$("select[name^='option[group]']").change(function(){
    var nums = this.name.match(/\[(\d+)\]$/)
    if (nums) {
        alert('Index:' + nums[1]);
    }
  // Do something with option values of group
});

Working demo here: http://jsfiddle.net/jfriend00/TcRzW/

Or, if you want any sequence of characters from the last index in the name, it would be this:

$("select[name^='option[group]']").change(function(){
    var nums = this.name.match(/\[([^\]]+)\]$/)
    if (nums) {
        alert('Index:' + nums[1]);
    }
  // Do something with option values of group
});

Working demo here: http://jsfiddle.net/jfriend00/TcRzW/

If you now want to know which group number you’re working on, you can do that like this:

var selectGroups$ = $("select[name^='option[group]']");
selectGroups$.change(function(){
    var index = selectGroups$.index(this);
    // index will be a number like 0, 1, 2, 3 for which
    // sequential "select[name^='option[group]']" we are operating on.
});