0

Here is a code:

<input type="button" id="array[1]" value="Value1" />
<input type="button" id="array[2]" value="Value2" /> 
<input type="button" id="array[3]" value="Value3" /> 

And I want to do something like that:

$('#array').click(function() {
    id = this.id;       
    $.ajax({
        here goes type, url, data and else
    });     
})  

I want to id add array's number. For example, if I click button where id is array[3] so id gets value of 3 in Jquery's function. Hope you got what I mean.

good_evening
  • 21,085
  • 65
  • 193
  • 298

7 Answers7

5

First of all you should not be using [] in id values ... only a-zA-Z0-9-_.:

look at the html ID attribute for more info on the specs..

you should name them something like id_1 and extract the number with regular expressions like the other answers suggest...
(remember that you cannot start the id value with a number only a-zA-Z)

Gabriele Petrioli
  • 191,379
  • 34
  • 261
  • 317
3

Get rid of the ID attributes, add a common class array, and give them all a name of array[].

Then use this in your jQuery;

$('input.array').click(function() {
    var id = $(this).val();      
    $.ajax({
        here goes type, url, data and else
    });     
})  
TheDeadMedic
  • 9,948
  • 2
  • 35
  • 50
0

I would try add class on each array.

<input type="button" class='array' id="array[1]" value="Value1" />
<input type="button" class='array' id="array[2]" value="Value2" /> 
<input type="button" class='array' id="array[3]" value="Value3" /> 


$('.array').click(function() {
   var id = $(this).attr('id');       
    $.ajax({
        here goes type, url, data and else
    });     
})  

Hope it helps

FlyingCat
  • 14,036
  • 36
  • 119
  • 198
0

Use a regexp to extract the number

var reId = /[(\d+)]/;
$('#array').click(function() {
    var id = reId.exec($(this).attr("id"))[0];       
    $.ajax({
        //id is now a string containing only the number
    });     
})  
Sean Kinsey
  • 37,689
  • 7
  • 52
  • 71
  • 1
    Doesn't quite work. You need to escape the `[` and `]` and reference index `1` of the result, or don't escape and just put the `+` outside them. :o) – user113716 May 30 '10 at 16:32
0

A crude approach:

$(this).attr("id").replace(/[^0-9]*/ig, "")

Full example:

<!DOCTYPE html>
<html>
<head>
    <title>2939346</title>
    <script src="http://www.google.com/jsapi"></script>
    <script>google.load("jquery", "1");</script>
    <script type="text/javascript" charset="utf-8">
        $(document).ready(function(){
            $("input[type=button]").click(function(){
                alert($(this).attr("id").replace(/[^0-9]*/ig, ""));
            });
        });
    </script>
</head>
<body>
    <input type="button" id="array[1]" value="Value1" />
    <input type="button" id="array[2]" value="Value2" /> 
    <input type="button" id="array[3]" value="Value3" />
</body>
</html>
miku
  • 181,842
  • 47
  • 306
  • 310
0

if you're storing content in your elements i would use data-* to store them, For example instead of using arrays i would use a json string

<input type="button" class='array' data-json="{id:22,defualt_val:'Value1'}" value="Value1" />

then within your javascript code i would use!

$('input[data-json]').click(function(){
    $data = $('[data-json]',this)
    $.ajax({
        data:$data
    });     
}) 

This is a method used to store content to an element such as original-title etc.

BenMorel
  • 34,448
  • 50
  • 182
  • 322
RobertPitt
  • 56,863
  • 21
  • 114
  • 161
  • it is generally not a good idea to use arbitrary attribute names (*although yours is HTML 5 compliant, so i am just posting this as a general read for anyone interested*) .. a good discussion can be found at http://stackoverflow.com/questions/994856/so-what-if-custom-html-attributes-arent-valid-xhtml – Gabriele Petrioli May 30 '10 at 17:07
0

I think i can help you solving this problem. As far as I understand input ids start with array keyword and contains original id within bracket which you wanna fetch and send on an ajax call. For elements that start with some predefined string you can use $("[name^=value]") jquery selector.

$("input[id^='array']").click(function() {
    var id = parseInt($(this).attr("id").split("[")[1].slice(0,-1));     
   //above variable should contain whatever you put inside brackets. 
    $.ajax({
        here goes type, url, data and else
    });     
});

That should give desired results. Cheers Ayaz Alavi

Ayaz Alavi
  • 4,825
  • 8
  • 50
  • 68