First of all, I'm completely new to asp.net, jquery and all the web side stuff. I don't have a good understanding on any of it. I've tried to do some research, but I can't figure out my problem.
I bought a template and am now trying to go through this broken code to make it functional.
I have a contact form, the fields look like this:
<label class="name">
<input type="text" value="Name:">
<span class="error">*This is not a valid name.</span>
<span class="empty">*This field is required.</span>
<span class="clear"></span>
</label>
There are 3 or 4 fields that are all the same, except one is a textarea.
Now I think my problem is, I'm not getting the values from the text fields. Either that or I'm not sending the values correctly.
This is my submit function:
submitFu: function () {
_.validateFu(_.labels)
if (!_.form.has('.' + _.invalidCl).length)
$.ajax({
type: "POST",
url: _.mailHandlerURL,
dataType: 'json',
data: {
'name': +_.getValFromLabel($('.name', _.form)),
'email': +_.getValFromLabel($('.email', _.form)),
'phone': _.getValFromLabel($('.phone', _.form)),
'message': +_.getValFromLabel($('.message', _.form)),
'from': 'email@email.net',
'smtpMailServer': + _.smtpMailServer,
'stripHTML': 'false'
},
success: function () { _.showFu() },
error: function (data) { alert(data.responseText); }
})
And this is my "getValFromLabel" function, which I REALLY don't understand:
getValFromLabel: function (label) {
var val = $('input,textarea', label).val()
, defVal = label.data('defVal')
return label.length ? val == defVal ? 'nope' : val : 'nope'
}
I put alert(+_.getValFromLabel($('.message', _.form)))
on my submit function and it shows "NaN", which makes no sense to me at all. Thats why I think I'm not getting values correctly. The contact form returns the error that it doesn't have a from address.
Any ideas???
here is basic code using http://bassistance.de/jquery-plugins/jquery-plugin-validation/
<form method="post" class="cmxform" id="form" action="form.php">
<fieldset>
<legend>Login Form (Enter "foobar" as password)</legend>
<p>
<label for="user">Name</label>
<input id="name" name="name" title="Please enter your name (at least 3 characters)" class="required" minlength="3" />
</p>
<p>
<label for="email">Email</label>
<input id="email" name="email" title="Please enter a valid email address" class="required email"/>
</p>
<p>
<label for="phone">Phone</label>
<input id="phone" name="phone" title="Please enter a valid phone number" class="required digits" minlength="10" maxlength="15" />
</p>
<p>
<label for="phone">comment</label>
<textarea id="comment" name="comment" title="Please enter a comment" class="required" rows="10" cols="50" ></textarea>
</p>
<p>
<input class="submit" type="submit" value="Submit"/>
</p>
</fieldset>
</form>
here is javascript/jquery code
jQuery("#form").validate({
submitHandler: function() {
$.ajax({
type: "POST",
url: "EMAIL.ashx",//or you can code behind web method/webservice
dataType: 'json',
data: {
'name': + $("#name").val(),
'email': + $("#email").val(),
'phone': $("#phone").val(),
'message': + $("#comment").val(),
'from': 'email@email.net',
'smtpMailServer': + $("#smtpserver").val(),
'stripHTML': 'false'
},
success: function () { alert("email sent successfully") },
error: function (data) { alert(data.responseText); }
})
}
});
you should point the url to your ashx code since you already have the code/ sample is posted above i am not including it, also passing the smtp details is not recommended, you get the details in you csharp code from web.config