jquery data element returning undefined

Question

I have two links in my html code. I use both of them to read the data element using jQuery. However it works fine for one of them and for the other it returns undefined values.

the html is as follows

<a class="loadCustomerInfo" href="#Augustinho" date-customerid="1" date-customername="Augustinho" date-customeraddress="mercado shoprite" date-companyname="Auto Kilimanjaro" date-phoneone="828759460" date-city="0">Augustinho</a>

the following jQuery I use

$(".loadCustomerInfo").live('click',function(){
  //alert("add item");
  var idVar=$(this).data('customerid');
  // alert($(this).innerHTML);

  alert($(this).attr('data-customername'));

  alert($(this).data('customername'));
  var randid = new Date().getUTCMilliseconds();

  $("#customerInfoTable").append('<tr><th id="customerInfoTH" colspan=2>Customer Information</th></tr>' +
  '<tr><th>Customer Name</th> <td>' +$(this).data('customername')+ '</td></tr>' +
  '<tr><th>Company Name</th><td>' +$(this).data('companyname')+ '</td></tr>' +
  '<tr><th>Address</th><td>' +$(this).data('customeraddress')+ '</td></tr>' +
  '<tr><th>City</th><td>' +$(this).data('city')+ '</td></tr>' +
  '<tr><th>Primary Phone</th><td>' +$(this).data('phoneone')+ '</td></tr>');


  //return false;
});

The click function is working as I get the response from alert() but always undefined, also in my html it displays undefined for all variables.

1) .live is deprecated in favour for .on 2) did you wrap this in $(function() {}) ? 3) it is data- not date- 4) use window.console&&console.log instead of alert — mplungjan
– mplungjan, Commented Nov 3, 2013 at 21:32
Use .on instead of .live, and please check the names, as you got different attribute names in js than in html. date != data. — Flash Thunder
– Flash Thunder, Commented Nov 3, 2013 at 21:33

Sirko · Accepted Answer · 2013-11-03 21:31:40Z

2

Your attributes in the HTML code are all starting with date- instead of data-.

Fix that and you'll be fine.

answered Nov 3, 2013 at 21:31

Sirko

74.3k19 gold badges157 silver badges194 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user2950777 Over a year ago

before going for my calculus exam in MS my professor told me, son, remember sometimes you turn blind with opened eyes, sometimes complicated questions have very simple answers...

mplungjan · Accepted Answer · 2013-11-03 21:35:56Z

0

.live is deprecated in favour for .on
did you wrap this in $(function() {}) ?
it is data- not date-
use window.console&&console.log instead of alert
pass event and preventDefault:

Like this

$(function() {
  $(".loadCustomerInfo").on('click',function(e) {
    e.preventDefault();
    var idVar=$(this).data('customerid');
    .
    .

answered Nov 3, 2013 at 21:35

mplungjan

180k29 gold badges183 silver badges246 bronze badges

Collectives™ on Stack Overflow

jquery data element returning undefined

2 Answers 2

1 Comment

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

1 Comment

Comments

Your Answer

Sign up or log in

Post as a guest

Related