You could but it is useless.
Let's assume, you do it. First of all, you should encrypt the value of the filed only when it's not changed anymore, most algorithms won't tolerate this
while you type. You could however encrypt the value using a javascript event handler just before the form is posted.
But haven't you wondered why this is not used? Because if you want to encrypt on client side, you need to have all logic and keys on client side, you need to send (when we speak of web) all logic and keys to the client side. If one can capture the encrypted text when travelling over http, that one can also capture the logic and keys also. Still, if you want to, just use a library like this:
https://github.com/travist/jsencrypt[
^].
So you better encrypt the communication, by using https.
On the other hand storing passwords in an encrypted form is a good practice. But not the best, you should not store passwords at all. You should be able to compare passwords but without knowing the password itself. How to do that? By using a good hash algorithm, and some "salt". This is a really good description of how to proceed:
https://www.owasp.org/index.php/Password_Storage_Cheat_Sheet[
^]. This is also a good lecture:
http://www.captechconsulting.com/blog/kevin-hazzard/best-practices-managing-customer-passwords[
^]
I hope you will succeed in your project.
Submit an article or tip