Home>

I am implementing asynchronous communication using jQuery and ajax in rails.
Asynchronous data passing was successful, and finally there was a problem restructuring the html.
Can you write iterative processes like times in your javascript code?

Error message

As you can see from the gif, you can fire the event in the select box and display the records related to that year, but the code will be output as it is.
] (c964e942523eef2fd9eaeac45b7b4313.gif)

Applicable source code
. history_result
  [email protected] first_view.each do | rec |
    .history_box.row
      .history_list.col-12.d-flex
        -2.times do | number |
          .history_list__category.col-md-4.text-center {class: "category # {number}"}
            -case number
            -when 0
              = rec.donation_day
            -when 1
              = rec.inspection_method_i18n
        .col-md-3
          View records


The description of the event occurrence of javascript is omitted.

function appendList (record, result_area) {
      var result = `
                      
                        <% 2.times do | number |%>
                          
                            <% case number%>
                            <% when 0%>
                              <% = ${record.day}%>
                            <% when 1%>
                              <% = ${record.method}%>
                            <% end%>
                          
                        <% end%>
                         View recording 
                      
                     `;
      result_area.append (result);
    }


This is the html that is going to be displayed after changing the select box.
Simply change the description of the original haml to html.

Although I thought about how to write the same html for two times, I would like to make it repeatable as much as the original html.

Supplemental information (FW/tool version etc.)

rails (5.2.3)

  • Answer # 1

    It doesn't work even if you put the notation of rails in JavaScript. JavaScript works on the browser and rails runs on the server.
    If you are movingappendListbased on the data received in the Ajax callback, you must also write the data processing in JavaScript. If you want to use the rails notation, let's rewrite the HTML output by rails so that it is passed to JavaScript and rendered.