Click the [rails] button to create a random alphanumeric password and enter it in the password field

I want to automatically generate a password

I have set a password function for the portfolio posting function. It would be convenient if there was a function that automatically generated and even entered the password.

So let's make it!

Goal of this article

Click the "Generate Password" button Let's be able to enter it automatically! パスワード生成.gif

Premise

rails:5.2 ruby:2.6.3 bootstrap jquery

Generate password

First, let's make random alphanumeric characters with the controller.

topics_controller.rb


def new
  @topic    = Topic.new
  @password = SecureRandom.alphanumeric(6)
  ->Random alphanumeric characters(A-Z, a-z, 0-9)Generate a
   (6)Is 6 digits, 16 digits if not specified
end

Allows you to fill in fields with the click of a button

Next, change the password you created earlier to password_field (this time it is text_field) Allows you to enter.

ruby:new.html.erb


<div class="topic-new-wrapper" >
  <div class="container">
    <div class="row">
      <div class="col-md-6 col-md-offset-3">
          <%= form_for @topic do |f| %>
            <div class="form-group">
              <%= f.label :password, 'password(Any)' %>
              <%= f.text_field :password, class: 'form-control', id: 'password' %>
              <%= button_tag 'Generate password', id: 'auto-fill-link' %>
            </div>
  
            <%= f.submit 'Password registration', class: 'btn btn-black btn-block' %>
  
          <% end %>
      </div>
    </div>
  </div>
</div>
  
<script>
  $(function(){
    autoFill();
    function autoFill() {
      $('#auto-fill-link').click(function(){
        $('#password').val("<%= @password %>");
      });
    }
  })
</script>

When a link containing the id "auto-fill-link" is clicked, it contains the id "password" @Password is entered in the field.

However, if this is the case, it will be submitted when the button_tag is clicked, so If you want to use it as just a button, add the following code.

type: "button"

ruby:new.html.erb


<div class="topic-new-wrapper" >
  <div class="container">
    <div class="row">
      <div class="col-md-6 col-md-offset-3">
          <%= form_for @topic do |f| %>
            <div class="form-group">
              <%= f.label :password, 'password(Any)' %>
              <%= f.text_field :password, class: 'form-control', id: 'password' %>
This line->       <%= button_tag 'Generate password', id: 'auto-fill-link', type: "button" %>
            </div>
  
            <%= f.submit 'Password registration', class: 'btn btn-black btn-block' %>
  
          <% end %>
      </div>
    </div>
  </div>
</div>
  
<script>
  $(function(){
    autoFill();
    function autoFill() {
      $('#auto-fill-link').click(function(){
        $('#password').val("<%= @password %>");
      });
    }
  })
</script>

Summary

We have created a function that will generate and enter a password.

It's easy, so please use the above code.

Recommended Posts

Click the [rails] button to create a random alphanumeric password and enter it in the password field
Install Rails in the development environment and create a new application
[Rails] How to create a table, add a column, and change the column type
The Android app crashes. Just click a button and it will fall.
How to easily create a pull-down in Rails
[Rails] How to create a Twitter share button
A memo to simply create a form using only HTML and CSS in Rails 6
Until you create a Spring Boot project in Intellij and push it to Github
How to create a placeholder part to use in the IN clause
I want to create a form to select the [Rails] category
Create a method to return the tax rate in Java
[Rails 6.0, Docker] I tried to summarize the Docker environment construction and commands necessary to create a portfolio
Add a shadow to the Swift Button (and also the circle)
Create a private repository in Amazon ECR and push/pull the image
(Ruby on Rails6) Creating a database and displaying it in a view
Things to remember and concepts in the Ruby on Rails tutorial
(Ruby on Rails6) Create a function to edit the posted content
Preparing to create a Rails application
Create a new app in Rails
[Ruby on Rails] How to log in with only your name and password using the gem devise
Inexperienced create a weather app using OpenWeatherMap and deploy it to Netlify
How to create a query using variables in GraphQL [Using Ruby on Rails]
The story of forgetting to close a file in Java and failing
Add the pre-built jar library to Android and call it in the framework
How to update user edits in Rails Devise without entering a password
[Docker] How to create a virtual environment for Rails and Nuxt.js apps
Create a program to post to Slack with GO and make it a container
I thought about the best way to create a ValueObject in Ruby
Have a tool to create and open a new canvas in Mac preview
Is it possible to put the library (aar) in the Android library (aar) and use it?
How to create your own annotation in Java and get the value
How to insert a video in Rails
Rails refactoring story learned in the field
Steps to set a favicon in Rails
When I wanted to create a method for Premium Friday, it was already in the Java 8 standard API
[rails] How to create a partial template
If it is Ruby, it is efficient to make it a method and stock the processing.
[Rails / JavaScript / Ajax] I tried to create a like function in two ways.
How to ZIP a JAVA CSV file and manage it in a Byte array
How to make a unique combination of data in the rails intermediate table
Find out about Rails hidden_field (create a confirmation screen and check the behavior)
I tried to express the phone number (landline / mobile phone) with a regular expression in Rails and write validation and test
[Ruby] When you want to assign the result obtained by conditional branching to a variable and put it in the argument
Convert to a tag to URL string in Rails
[Rails] Button to return to the top of the page
[Rails / ActiveRecord] About the difference between create and create!
[Rails] rails new to create a database with PostgreSQL
[Rails] How to create a graph using lazy_high_charts
I tried to organize the session in Rails
Try to create a bulletin board in Java
How to create a theme in Liferay 7 / DXP
How to implement a like feature in Rails
A note about the Rails and Vue process
How to make a follow function in Rails
How to check Rails commands in the terminal
I want to morphologically analyze the log in the DB and put it in the DB to classify messages 1
[Rails] How to delete production environment MySQL data after putting it in the development environment
How to create a header or footer once and use it on another page
Create a private key / public key in CentOS8.2 and connect to SSH with VS Code
Install multiple submit buttons in Rails View to get the value of the pressed button
Docker command to create Rails project with a single blow in environment without Ruby