londondev
londondev

Reputation: 231

Cannot init an object in jquery document.ready

I have an javascript object named concept:

function concept() {
    this.ConceptId = 0;
    this.Name = "";
}

I am trying to initiate it in jQuery document.ready:

$(document).ready(function() {
    var concept = new concept;
});

It returns an error:

Uncaught TypeError: concept is not a constructor

If I move the object inside the document.ready, it is working.

$(document).ready(function() {
    function concept() {
        this.ConceptId = 0;
        this.Name = "";
    }
    var concept = new concept;
});

I am still new on javascript, as far as I understood document.ready is run when DOM is completed. I don't understand why it cannot access the object which is defined out of the document.ready scope.

Here it is the fiddle: https://jsfiddle.net/49rkcaud/1/

Upvotes: 7

Views: 1300

Answers (3)

Jitendra Tiwari
Jitendra Tiwari

Reputation: 1691

You just need to change variable name where call this function.

Answer

  $(document).ready(function() {
    /*function concept() {
            this.ConceptId = 0;
            this.Name = "";
          }*/

    var concept1 = new concept;
    alert(concept1.ConceptId);  
  });

  function concept() {
    this.ConceptId = 5;
    this.Name = "";
  }

Better Approach

You should create object of function using ()

var objConcetp = new concept();

Also use constructor rather than directly assigning values. Your function look like:

$(document).ready(function(){
   var oConcept = new concept(1, "YourName");
});

function concept(conceptId, name){
   this.ConceptId = conceptId;
   this.Name = name;
}

Upvotes: 2

Jayesh Chitroda
Jayesh Chitroda

Reputation: 5049

Try this:

Jsfiddle: https://jsfiddle.net/3w284mcs/

  $(document).ready(function() {
    var concept = function() {
      this.ConceptId = 0;
      this.Name = "";
    }

    var concept_obj = new concept();
    alert(concept_obj.ConceptId);  
  });

Upvotes: 3

Rory McCrossan
Rory McCrossan

Reputation: 337560

The issue is because you're redefining concept. You just need to change the name of the variable:

$(document).ready(function() {
    var foo = new concept; // change the variable name here
    alert(foo.ConceptId); // = 0
});

function concept() {
    this.ConceptId = 0;
    this.Name = "";
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

Upvotes: 4

Related Questions