TypeError: passwordElement.up(…) is undefined in magento:
Basically in in magento validation.js file – validation will happen according to the form field’s of class and id.
Ex:
Sample.phtml
<form id=”first-form” method=”post” actio=’..’ >
<input type=”text” id=”first-password” name=”first-password” class=”validate-password“/>
<buttom type=”submit” id=”first-submit” name=”first-submit”>
</form>

From the above sample code, validate-password is common validation class in magento. If you add above code into your custom .phtml with proper form declaration then the magento validation will work properly in your custom form.

What issue you may get:
Above code are place more than once in a page with same magento validation class but with not a proper form tag (<form>) declaration then you may get issue from the browser-console as like below

sample-ajax.phtml
<input type=”text” id=”header-password” name=”header-password” class=”validate-password”/>
<buttom type=”submit” id=”header-submit” name=”header-submit”>

sample.phml

<form id=”first-form” method=”post” actio=’..’ >
<input type=”text” id=”first-password” name=”first-password” class=”validate-password”/>
<buttom type=”submit” id=”first-submit” name=”first-submit”>
</form>

inc.phtml
Here i included below two files into one file and am going to run inc.phtml file.
include(sample-ajax.phtml);
include(sample.phtml);

when i run inc.phtml file i will get below error message

TypeError: passwordElement.up(…) is undefined

if (passwordElement.up(‘form’).id == conf.up(‘form’).id) {

How to resolve:

First solution:

Add form tag into sample-ajax.phtml file.
sample-ajax.phtml
<form id=”header-form” method=”post” actio=’..’ >
<input type=”text” id=”header-password” name=”header-password” class=”validate-password”/>
<buttom type=”submit” id=”header-submit” name=”header-submit”>
</form>

sample.phml

<form id=”first-form” method=”post” actio=’..’ >
<input type=”text” id=”first-password” name=”first-password” class=”validate-password”/>
<buttom type=”submit” id=”first-submit” name=”first-submit”>
</form>

(or)

Second solution:

Remove “validate-password” class from intput field incase if you used ajax.

sample-ajax.phtml
<input type=”text” id=”header-password” name=”header-password” class=””/>
<buttom type=”submit” id=”header-submit” name=”header-submit”>

If you are using ajax then remove form and remove “validate-password” class from the input fields

sample.phml

<form id=”first-form” method=”post” actio=’..’ >
<input type=”text” id=”first-password” name=”first-password” class=”validate-password”/>
<buttom type=”submit” id=”first-submit” name=”first-submit”>
</form>

Thanks to Pradeep.

———————————————————————————————————————————————————————————————-

Corner of Blog:

“Save Earth, Stop Plastic Use… “

———————————————————————————————————————————————————————————————-