CODEWITHSUNDEEP
javascriptjqueryhtml
user3502930
user3502930

Reputation: 173

How to Get Id from class selector

<input  id="1" class="Find">
<input  id="2" class="Find">
<input  id="3" class="Find">

$('.Find').autocomplete('auto/data.php?mode='+ $('.Find').attr('id')  +'', {    
                    width: 220,
                    max: 5,
                    selectFirst: false,      
                    mustMatch:true,
                    formatItem: function(data, i, n, value) {return  value.split("|")[0];}
                    });

In this case the code $('.Find').attr('id') only shows the first array. Not showing the specific id where I needed.

I've done to change with new var n change this line $('.Find').attr('id') with new variable but the result is undefined.

The new var look like this var one = $("#GetObjc").attr("value");

Can anyone help me. What should I do to get the specific id on that class. Sorry if am make confuse cozz am newbie.

Upvotes: 3

Views: 1211

Answers (6)

Tasos K.
Tasos K.

Reputation: 8079

In order to have a dynamic data source you need to set a function() as your source.

Also, the this attribute does not return the actual DOM element, rather than a more rich object that (of course) contains the actual elemet.

So, to achieve what you want you can try the following:

$('.Find').autocomplete({    
    source: function(request, response) {
        var id = this.element[0].id;
        var url = 'auto/data.php?mode='+ id;
        jQuery.getJSON(url, response).error(function () { /* handle JSON error */ }); 
    },
    width: 220,
    max: 5,
    selectFirst: false,      
    mustMatch:true,
    formatItem: function(data, i, n, value) {return  value.split("|")[0];}
});

Upvotes: 1

Vfleitao
Vfleitao

Reputation: 58

I'm not sure if i get what you want but i suppose you want to autocomplete all inputs with data from different urls based on the of the input, if so you can do this:

$('.Find').each(function(){
  $(this).autocomplete('auto/data.php?mode='+ $(this).attr('id')  +'', {    
                width: 220,
                max: 5,
                selectFirst: false,      
                mustMatch:true,
                formatItem: function(data, i, n, value) {return  value.split("|")[0];}
  });
})

to get the id, in the each just do: 

$(this).attr('id') or $(this).prop('id')

Upvotes: 1

leonprou
leonprou

Reputation: 4888

$('.Find') return an array of all DOM elements (wrapped in jquery) that got a 'Find' class.

You can access each element with [] operator - like $('.Find')[0], or iterate trough the array with for lop. To get the id of the element use the id property.

To sum up - $('.Find')[0].id - id of the first element

Upvotes: 1

Magus
Magus

Reputation: 15104

I think you want to do this :

$('.Find').each(function() {
    var $this = $(this);
    $this.autocomplete('auto/data.php?mode='+ $this.attr('id')  + '', {    
        width: 220,
        mzx: 5,
        selectFirst: false,      
        mustMatch:true,
        formatItem: function(data, i, n, value) {return  value.split("|")[0];}
    });
});

$('.Find').attr('id') will always return the id of the first .Find in the page. So you can't use it like this.

Upvotes: 1

Romain
Romain

Reputation: 573

2% chance I understood your question in the right way but it seems that you need to iterate through your element list:

    $('.Find').each(function() {
        $(this).autocomplete('auto/data.php?mode='+ $(this).attr('id')  +'', {
            width: 220,
            max: 5,
            selectFirst: false,      
            mustMatch:true,
            formatItem: function(data, i, n, value) {return  value.split("|")[0];}
        });
    });

Upvotes: 1

Moshtaf
Moshtaf

Reputation: 4903

I'm not sure what you looking for. but you can get all ids using .each.

var ids ='';
$(".Find").each(function( index, value ) {
  ids += $(this).attr('id') + ',';
});

Then you can split ids variable or something like this.

Check JSFiddle Demo

In your case i think it's useful for you:

$('.Find').each(function() {
    var $this = $(this);
    $this.autocomplete('auto/data.php?mode='+ $this.attr('id')  + '', {    
        width: 220,
        mzx: 5,
        selectFirst: false,      
        mustMatch:true,
        formatItem: function(data, i, n, value) {return  value.split("|")[0];}
    });
});

Upvotes: 1

Related Questions