如何在Rails的表单中使用javascript变量

Question

I'm getting the css property of the div through a click event.

I want to use saved properties in the input form.

I have already created a color column in the database, and I want to know how to apply a var color declared in Javascript to a partial view (_form.html.erb).

index.html.erb (home controller)

<%= render partial: 'posts/form', locals: { post: @post } %>

$(document).ready(function() {
        $(".scale-up-center").click(function() {
            var color = $(".scale-up-center").css("background-color");
            $(".first_scale").css("background-color", color);
        })
    })

<div class=".scale-up-center", style="background-color:red;"></div>
<div class=".first_scale"></div>

_form.html.erb (Posts Controller)

  <div class="field">
    <%= form.label :color %>
    <%= form.text_area :color %>
  </div>

Answer 1

I'm not sure I understand your question correctly. Do you want to render the input box with a colour stored in your database? In that case you could style the element you want using

<div style="background: <%= model.colour_field %>;">

Answer 2

_form.html.erb (Posts Controller)

  <div class="field">
    <%= form.label :color %>
    <%= form.text_area :color, id: 'post_color' %>
  </div>

Set Color value using javascript on click function

$(document).ready(function() {
        $(".scale-up-center").click(function() {
            var color = $(".scale-up-center").css("background-color");
            $(".first_scale").css("background-color", color);
            //set post's color value
            $("#post_color").val(color); 
        })
    })