CODEWITHSUNDEEP
jqueryobject
peace_love
peace_love

Reputation: 6461

How can I get a specific value from an object?

I am creating an object and want to output the value of id:

   var result = {};
  $.each($('.color input').serializeArray(), function() {
      result[this.name] = this.value;
  });  
  
  console.log(result[id]);
  
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="color" style="background-color:pink">
<input type="hidden" name="name" value="fred">
<input type="hidden" name="id" value="23">
</div>

The result I expect is 23

Upvotes: 0

Views: 66

Answers (3)

Pranav C Balan
Pranav C Balan

Reputation: 115212

First of all, you need to get the name and value property from the object which can get as the second argument. And get the property using ['id'] or .id syntax.

var result = {};
$.each($('.color input').serializeArray(), function(i, v) {
  result[v.name] = v.value;
});

console.log(result.id);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="color" style="background-color:pink">
  <input type="hidden" name="name" value="fred">
  <input type="hidden" name="id" value="23">
</div>

Or generate the object as follows by iterating simply using each() method on the jQuery input element collection.

var result = {};
$('.color input').each(function() {
  result[this.name] = this.value;
});

console.log(result.id);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="color" style="background-color:pink">
  <input type="hidden" name="name" value="fred">
  <input type="hidden" name="id" value="23">
</div>

Upvotes: 2

War10ck
War10ck

Reputation: 12508

The error you're receiving is because the browser believes that id is a variable. You need to access it via either result['id'] or result.id to get the property's value from the object:

Example 1: Access property value using bracket notation

   var result = {};
  $.each($('.color input').serializeArray(), function() {
      result[this.name] = this.value;
  });  
  
  console.log(result['id']);
  
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="color" style="background-color:pink">
<input type="hidden" name="name" value="fred">
<input type="hidden" name="id" value="23">
</div>

Example 2: Access property value using object notation

   var result = {};
  $.each($('.color input').serializeArray(), function() {
      result[this.name] = this.value;
  });  
  
  console.log(result.id);
  
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="color" style="background-color:pink">
<input type="hidden" name="name" value="fred">
<input type="hidden" name="id" value="23">
</div>

Upvotes: 1

St&#233;phane Ammar
St&#233;phane Ammar

Reputation: 1454

You must call result['id']or result.id since idis not declared as a variable

   var result = {};
  $.each($('.color input').serializeArray(), function() {
      result[this.name] = this.value;
  });  
  
  console.log(result.id);
  
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div class="color" style="background-color:pink">
<input type="hidden" name="name" value="fred">
<input type="hidden" name="id" value="23">
</div>

Upvotes: 2

Related Questions