javascript - Jquery val is not working when try to get a value from a form -

i've tried insert form in woocommerce product page. i've inserted form in product page. when form submitted i'm trying email (form input value) , validate accordingly.

the problem i'm not able value in theme using jquery. see form , elements in firebug. jquery not working click event in variable product (woocommerce product page). here form inside form (which enctype multipart/form-data), might 1 reason or if place form above variable product form jquery works returns empty string.

even if there text inside form input field, returns empty string.

here form

here jquery on submit click

 jquery(document).ready(function() {    jquery('.mailsub').click(function() {      var subaddress = jquery('.subemail').val();      console.log(subaddress);      if ( jquery('.subemail').length > 0 ){        console.log('the element element_id exists in dom');      }      //ajax goes here followed validation email      return false;    }); }); 

i've tried check whether in dom or not, i've used code, says the element element_id exists in dom.

i'm able form work on twentyeleven , defaults themes. working in wordpress defaults themes not in other third party themes.

what might problem? suggestion helpful.

the html , code given should work. i'm guessing there element class subemail earlier in document. when jquery(".subemail").val(), jquery finds of matching elements, returns value (if any) of first of them.

---

side note: if step through code debugger built browser, rather doing console.log statements, can inspect variables code running, dramatically more educational, usually.

---

side note 2: browsers submit forms when user presses enter in text field. in case, click event on submit button may not fired (since button wasn't clicked). reliably hook form submission process, use submit event on form, rather click event on button.

---

side note 3: you've said you're using ajax validate email address. default, ajax calls asynchronous, means cannot use result server decide whether submit form, because don't result until after submit event handler has returned , (probably) form has been submitted. can make ajax call synchronous, locks ui of browsers while call in progress, leading poor user experience. suggest validating email address via ajax when field changes, , again on server when receives form (you can never rely on client-side validation). lets give user proactive feedback (the on-change validation) without trying validate via ajax when submitting form.