user1072337 user1072337 - 2 months ago 17
jQuery Question

event.target.name.value - Uncaught TypeError: Cannot read property 'value' of undefined

I have a form and some javascript logic I am using within a Meteor.js app. When submitting the form. I am getting the error:

Uncaught TypeError: Cannot read property 'value' of undefined

It is complaining about this line:

var email = event.target.email.value.toLowerCase();

This is what the form looks like:

<form class="request-form" id="request-form" method="post" action="#">
<div class="form-group">
<input type="text" name="name" id="name" value="" class="form-control" placeholder="Your Name" required />
</div>
<div class="form-group">
<input type="text" name="email" id="email" value="" class="form-control" placeholder="Email Address" required />
</div>
<div class="form-group">
<input type="text" name="subject" id="subject" value="" class="form-control" placeholder="Subject" required />
</div>
</form>
</div>
</div>
<div class="col-md-6 col-sm-12">
<div class="block">
<form>
<div class="form-group-2">
<textarea id="message" name="message" class="form-control" value="" rows="3" placeholder="Your Message"></textarea>
</div>
<button class="btn btn-default submit" type="submit">Send Message</button>
</form>


This is what the logic handler looks like:

Template.contact.events({
'submit form': function(event, template) {
event.preventDefault();
var $form = template.$('#request-form');

if ($form.valid()) {

var name = event.target.name.value;

//COMPLAINING ABOUT THIS
var email = event.target.email.value.toLowerCase();

var subject = event.target.subject.value;
var message = event.target.message.value;

UserList.insert({
name: name,
email: email,
subject: company,
message: message
});

// template.showForm.set( false );
}

window.scroll(0,0);
}
});

Answer

If you have an id attribute assigned to the field, and you are sure that this field is always filled, then you can access it by:

var email = $("#email").val();

I think the main problem is that you have 2 forms. And submit is acting on a different form from where your e-mail is.