how to toggle password





.everyoneloves__top-leaderboard:empty,.everyoneloves__mid-leaderboard:empty,.everyoneloves__bot-mid-leaderboard:empty{ height:90px;width:728px;box-sizing:border-box;
}







1















In view I have the following ruby code:



Password: <input type="password" value= <%= @user_credentials.first.encrypted_password %> id="myInput">
<input type="checkbox" onclick="myFunction()"> Show Password




And in js file app/assest/js I have the below function,
but toggle password can't be done while checking the checkbox.



function myFunction () {
var x = document.getElementById("myInput");
if (x.type === "password") {
x.type = "text";
} else {
x.type = "password";
}
}









share|improve this question































    1















    In view I have the following ruby code:



    Password: <input type="password" value= <%= @user_credentials.first.encrypted_password %> id="myInput">
    <input type="checkbox" onclick="myFunction()"> Show Password




    And in js file app/assest/js I have the below function,
    but toggle password can't be done while checking the checkbox.



    function myFunction () {
    var x = document.getElementById("myInput");
    if (x.type === "password") {
    x.type = "text";
    } else {
    x.type = "password";
    }
    }









    share|improve this question



























      1












      1








      1








      In view I have the following ruby code:



      Password: <input type="password" value= <%= @user_credentials.first.encrypted_password %> id="myInput">
      <input type="checkbox" onclick="myFunction()"> Show Password




      And in js file app/assest/js I have the below function,
      but toggle password can't be done while checking the checkbox.



      function myFunction () {
      var x = document.getElementById("myInput");
      if (x.type === "password") {
      x.type = "text";
      } else {
      x.type = "password";
      }
      }









      share|improve this question
















      In view I have the following ruby code:



      Password: <input type="password" value= <%= @user_credentials.first.encrypted_password %> id="myInput">
      <input type="checkbox" onclick="myFunction()"> Show Password




      And in js file app/assest/js I have the below function,
      but toggle password can't be done while checking the checkbox.



      function myFunction () {
      var x = document.getElementById("myInput");
      if (x.type === "password") {
      x.type = "text";
      } else {
      x.type = "password";
      }
      }






      javascript ruby






      share|improve this question















      share|improve this question













      share|improve this question




      share|improve this question








      edited Nov 16 '18 at 14:46









      Eugene Mihaylin

      1,0101725




      1,0101725










      asked Nov 16 '18 at 11:59









      usman azmatusman azmat

      94




      94
























          2 Answers
          2






          active

          oldest

          votes


















          1














          The problem is in the value attribute code.



          The following snippet works ok.



          So js and html code is ok.



          Just format the dynamic ruby part correctly.



          I guess it should have quotes (for a valid html):



          value="<%= @user_credentials.first.encrypted_password %>"





          function myFunction() {
          var x = document.getElementById("myInput");
          if (x.type === "password") {
          x.type = "text";
          } else {
          x.type = "password";
          }
          }

          Password: <input type="password" value="123" id="myInput">
          <input type="checkbox" onclick="myFunction()"> Show Password








          share|improve this answer
























          • thnks alot. yes! i was doing that HTML format mistake

            – usman azmat
            Nov 16 '18 at 12:12











          • @usmanazmat please vote up and pick answer as correct

            – Eugene Mihaylin
            Nov 16 '18 at 12:12











          • may be voting require at least 15 reputation and i"m new sorry to say right now i can't do that

            – usman azmat
            Nov 17 '18 at 7:35











          • @usmanazmat but you can select answer anytime

            – Eugene Mihaylin
            Nov 17 '18 at 13:18



















          2














          Browsers automatically put quotes if any user forgot to put it. It is the behavior of the browser. So, if you put any space after any attribute, browser will automatically put quotes around that and it will ignore everything which comes after that space. Which can mess your element's markup code.



          There should not be a space after any attribute in the markup.



          value= <%= @user_credentials.first.encrypted_password %>


          You can fix it by wrapping them in quotes:



          value="<%= @user_credentials.first.encrypted_password %>"





          share|improve this answer
























          • Thnks Alot you are right it works

            – usman azmat
            Nov 16 '18 at 12:12














          Your Answer






          StackExchange.ifUsing("editor", function () {
          StackExchange.using("externalEditor", function () {
          StackExchange.using("snippets", function () {
          StackExchange.snippets.init();
          });
          });
          }, "code-snippets");

          StackExchange.ready(function() {
          var channelOptions = {
          tags: "".split(" "),
          id: "1"
          };
          initTagRenderer("".split(" "), "".split(" "), channelOptions);

          StackExchange.using("externalEditor", function() {
          // Have to fire editor after snippets, if snippets enabled
          if (StackExchange.settings.snippets.snippetsEnabled) {
          StackExchange.using("snippets", function() {
          createEditor();
          });
          }
          else {
          createEditor();
          }
          });

          function createEditor() {
          StackExchange.prepareEditor({
          heartbeatType: 'answer',
          autoActivateHeartbeat: false,
          convertImagesToLinks: true,
          noModals: true,
          showLowRepImageUploadWarning: true,
          reputationToPostImages: 10,
          bindNavPrevention: true,
          postfix: "",
          imageUploader: {
          brandingHtml: "Powered by u003ca class="icon-imgur-white" href="https://imgur.com/"u003eu003c/au003e",
          contentPolicyHtml: "User contributions licensed under u003ca href="https://creativecommons.org/licenses/by-sa/3.0/"u003ecc by-sa 3.0 with attribution requiredu003c/au003e u003ca href="https://stackoverflow.com/legal/content-policy"u003e(content policy)u003c/au003e",
          allowUrls: true
          },
          onDemand: true,
          discardSelector: ".discard-answer"
          ,immediatelyShowMarkdownHelp:true
          });


          }
          });














          draft saved

          draft discarded


















          StackExchange.ready(
          function () {
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53337476%2fhow-to-toggle-password%23new-answer', 'question_page');
          }
          );

          Post as a guest















          Required, but never shown

























          2 Answers
          2






          active

          oldest

          votes








          2 Answers
          2






          active

          oldest

          votes









          active

          oldest

          votes






          active

          oldest

          votes









          1














          The problem is in the value attribute code.



          The following snippet works ok.



          So js and html code is ok.



          Just format the dynamic ruby part correctly.



          I guess it should have quotes (for a valid html):



          value="<%= @user_credentials.first.encrypted_password %>"





          function myFunction() {
          var x = document.getElementById("myInput");
          if (x.type === "password") {
          x.type = "text";
          } else {
          x.type = "password";
          }
          }

          Password: <input type="password" value="123" id="myInput">
          <input type="checkbox" onclick="myFunction()"> Show Password








          share|improve this answer
























          • thnks alot. yes! i was doing that HTML format mistake

            – usman azmat
            Nov 16 '18 at 12:12











          • @usmanazmat please vote up and pick answer as correct

            – Eugene Mihaylin
            Nov 16 '18 at 12:12











          • may be voting require at least 15 reputation and i"m new sorry to say right now i can't do that

            – usman azmat
            Nov 17 '18 at 7:35











          • @usmanazmat but you can select answer anytime

            – Eugene Mihaylin
            Nov 17 '18 at 13:18
















          1














          The problem is in the value attribute code.



          The following snippet works ok.



          So js and html code is ok.



          Just format the dynamic ruby part correctly.



          I guess it should have quotes (for a valid html):



          value="<%= @user_credentials.first.encrypted_password %>"





          function myFunction() {
          var x = document.getElementById("myInput");
          if (x.type === "password") {
          x.type = "text";
          } else {
          x.type = "password";
          }
          }

          Password: <input type="password" value="123" id="myInput">
          <input type="checkbox" onclick="myFunction()"> Show Password








          share|improve this answer
























          • thnks alot. yes! i was doing that HTML format mistake

            – usman azmat
            Nov 16 '18 at 12:12











          • @usmanazmat please vote up and pick answer as correct

            – Eugene Mihaylin
            Nov 16 '18 at 12:12











          • may be voting require at least 15 reputation and i"m new sorry to say right now i can't do that

            – usman azmat
            Nov 17 '18 at 7:35











          • @usmanazmat but you can select answer anytime

            – Eugene Mihaylin
            Nov 17 '18 at 13:18














          1












          1








          1







          The problem is in the value attribute code.



          The following snippet works ok.



          So js and html code is ok.



          Just format the dynamic ruby part correctly.



          I guess it should have quotes (for a valid html):



          value="<%= @user_credentials.first.encrypted_password %>"





          function myFunction() {
          var x = document.getElementById("myInput");
          if (x.type === "password") {
          x.type = "text";
          } else {
          x.type = "password";
          }
          }

          Password: <input type="password" value="123" id="myInput">
          <input type="checkbox" onclick="myFunction()"> Show Password








          share|improve this answer













          The problem is in the value attribute code.



          The following snippet works ok.



          So js and html code is ok.



          Just format the dynamic ruby part correctly.



          I guess it should have quotes (for a valid html):



          value="<%= @user_credentials.first.encrypted_password %>"





          function myFunction() {
          var x = document.getElementById("myInput");
          if (x.type === "password") {
          x.type = "text";
          } else {
          x.type = "password";
          }
          }

          Password: <input type="password" value="123" id="myInput">
          <input type="checkbox" onclick="myFunction()"> Show Password








          function myFunction() {
          var x = document.getElementById("myInput");
          if (x.type === "password") {
          x.type = "text";
          } else {
          x.type = "password";
          }
          }

          Password: <input type="password" value="123" id="myInput">
          <input type="checkbox" onclick="myFunction()"> Show Password





          function myFunction() {
          var x = document.getElementById("myInput");
          if (x.type === "password") {
          x.type = "text";
          } else {
          x.type = "password";
          }
          }

          Password: <input type="password" value="123" id="myInput">
          <input type="checkbox" onclick="myFunction()"> Show Password






          share|improve this answer












          share|improve this answer



          share|improve this answer










          answered Nov 16 '18 at 12:03









          Eugene MihaylinEugene Mihaylin

          1,0101725




          1,0101725













          • thnks alot. yes! i was doing that HTML format mistake

            – usman azmat
            Nov 16 '18 at 12:12











          • @usmanazmat please vote up and pick answer as correct

            – Eugene Mihaylin
            Nov 16 '18 at 12:12











          • may be voting require at least 15 reputation and i"m new sorry to say right now i can't do that

            – usman azmat
            Nov 17 '18 at 7:35











          • @usmanazmat but you can select answer anytime

            – Eugene Mihaylin
            Nov 17 '18 at 13:18



















          • thnks alot. yes! i was doing that HTML format mistake

            – usman azmat
            Nov 16 '18 at 12:12











          • @usmanazmat please vote up and pick answer as correct

            – Eugene Mihaylin
            Nov 16 '18 at 12:12











          • may be voting require at least 15 reputation and i"m new sorry to say right now i can't do that

            – usman azmat
            Nov 17 '18 at 7:35











          • @usmanazmat but you can select answer anytime

            – Eugene Mihaylin
            Nov 17 '18 at 13:18

















          thnks alot. yes! i was doing that HTML format mistake

          – usman azmat
          Nov 16 '18 at 12:12





          thnks alot. yes! i was doing that HTML format mistake

          – usman azmat
          Nov 16 '18 at 12:12













          @usmanazmat please vote up and pick answer as correct

          – Eugene Mihaylin
          Nov 16 '18 at 12:12





          @usmanazmat please vote up and pick answer as correct

          – Eugene Mihaylin
          Nov 16 '18 at 12:12













          may be voting require at least 15 reputation and i"m new sorry to say right now i can't do that

          – usman azmat
          Nov 17 '18 at 7:35





          may be voting require at least 15 reputation and i"m new sorry to say right now i can't do that

          – usman azmat
          Nov 17 '18 at 7:35













          @usmanazmat but you can select answer anytime

          – Eugene Mihaylin
          Nov 17 '18 at 13:18





          @usmanazmat but you can select answer anytime

          – Eugene Mihaylin
          Nov 17 '18 at 13:18













          2














          Browsers automatically put quotes if any user forgot to put it. It is the behavior of the browser. So, if you put any space after any attribute, browser will automatically put quotes around that and it will ignore everything which comes after that space. Which can mess your element's markup code.



          There should not be a space after any attribute in the markup.



          value= <%= @user_credentials.first.encrypted_password %>


          You can fix it by wrapping them in quotes:



          value="<%= @user_credentials.first.encrypted_password %>"





          share|improve this answer
























          • Thnks Alot you are right it works

            – usman azmat
            Nov 16 '18 at 12:12


















          2














          Browsers automatically put quotes if any user forgot to put it. It is the behavior of the browser. So, if you put any space after any attribute, browser will automatically put quotes around that and it will ignore everything which comes after that space. Which can mess your element's markup code.



          There should not be a space after any attribute in the markup.



          value= <%= @user_credentials.first.encrypted_password %>


          You can fix it by wrapping them in quotes:



          value="<%= @user_credentials.first.encrypted_password %>"





          share|improve this answer
























          • Thnks Alot you are right it works

            – usman azmat
            Nov 16 '18 at 12:12
















          2












          2








          2







          Browsers automatically put quotes if any user forgot to put it. It is the behavior of the browser. So, if you put any space after any attribute, browser will automatically put quotes around that and it will ignore everything which comes after that space. Which can mess your element's markup code.



          There should not be a space after any attribute in the markup.



          value= <%= @user_credentials.first.encrypted_password %>


          You can fix it by wrapping them in quotes:



          value="<%= @user_credentials.first.encrypted_password %>"





          share|improve this answer













          Browsers automatically put quotes if any user forgot to put it. It is the behavior of the browser. So, if you put any space after any attribute, browser will automatically put quotes around that and it will ignore everything which comes after that space. Which can mess your element's markup code.



          There should not be a space after any attribute in the markup.



          value= <%= @user_credentials.first.encrypted_password %>


          You can fix it by wrapping them in quotes:



          value="<%= @user_credentials.first.encrypted_password %>"






          share|improve this answer












          share|improve this answer



          share|improve this answer










          answered Nov 16 '18 at 12:05









          JaiJai

          64.4k105782




          64.4k105782













          • Thnks Alot you are right it works

            – usman azmat
            Nov 16 '18 at 12:12





















          • Thnks Alot you are right it works

            – usman azmat
            Nov 16 '18 at 12:12



















          Thnks Alot you are right it works

          – usman azmat
          Nov 16 '18 at 12:12







          Thnks Alot you are right it works

          – usman azmat
          Nov 16 '18 at 12:12




















          draft saved

          draft discarded




















































          Thanks for contributing an answer to Stack Overflow!


          • Please be sure to answer the question. Provide details and share your research!

          But avoid



          • Asking for help, clarification, or responding to other answers.

          • Making statements based on opinion; back them up with references or personal experience.


          To learn more, see our tips on writing great answers.




          draft saved


          draft discarded














          StackExchange.ready(
          function () {
          StackExchange.openid.initPostLogin('.new-post-login', 'https%3a%2f%2fstackoverflow.com%2fquestions%2f53337476%2fhow-to-toggle-password%23new-answer', 'question_page');
          }
          );

          Post as a guest















          Required, but never shown





















































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown

































          Required, but never shown














          Required, but never shown












          Required, but never shown







          Required, but never shown







          Popular posts from this blog

          Florida Star v. B. J. F.

          Danny Elfman

          Lugert, Oklahoma