Rails / JavaScript onclick通過輔助方法Ajax Request發送值

Question

我有一個Rails方法，該方法可以轉換日期輸入並返回數字。 我花了一些時間來創建它，所以我想繼續使用它。 數據未存儲。 我想做的是創建一個簡單的JS輸入以獲取數據並通過該方法發送數據。

所以本質上我的方法是這樣的：

def date_converter(user_number)
 blah blah blah
 if blah < 2069
  error
 els if blah > 2069
  convert user_number.year
 else
  this number
 end
end

然后在我的HTML中，我有一個基本的JS輸入：

<p> Enter in Date </p>
<input id="check_number">
<button type="button" onclick="numberFunction()">Submit</button>
<p id="demo"></p>

<script>
 function numberFunction() {
  var x, dispay_value;
  x = document.getElementById('check_number').value;
  document.getElementById('demo').innerHTML = display_value;
 }
</script>

因此，我需要通過該方法發送x，然后將結果發送到innerHTML。 使用Ajax，我使用該方法更新了PostsController，但是取消了參數。 我創建了一條路線：

post 'posts/date_converter' => 'posts#date_converter'

然后在我的帖子>顯示中，我將腳本更新為：

function numberFunction() {
 user_number = $('check_number').val();
 $.ajax({
     url: 'week_date',
     type: 'GET',
     dataType: 'html',
     data: {
         number: user_number,
     }
 }).done(function(res) {
     $('#demo').html(res);
 });
}

我最終

ActiveRecord :: RecordNotFound（找不到帶有'id'= date_converter的帖子）：

我認為使用Post可能是路線問題，所以我嘗試使用Get。 同樣的問題。 嘗試將其放在自己的部分中，並在“帖子”>“顯示”和相同的問題上呈現該部分。

編輯：所以我做了一些其他更改。 我保留了這條路線。 添加到ajax請求中：

beforeSend：function（xhr）{xhr.setRequestHeader（'X-CSRF-Token'，$（'meta [name =“ csrf-token”]'）。attr（'content'））}

我更新了控制器以提取當前帖子（@post = Post.find（params [：id]）），盡管我不想將其綁定到當前帖子，然后將路由更新為：

get '/posts/:id/week_date' => 'posts#week_date'

因此，當我運行它時，我得到：

ActiveRecord :: RecordNotFound（找不到帶有'id'= posts的帖子）

如果我將其更改為特定網址的ajax請求，例如：

url: '1/date_converter'

最后不是我想要的

NameError（未定義的本地變量或方法“ user_number”

綜上所述，如果我在ajax請求中使用特定的ID（這與我想要的相反），那么它甚至沒有將值傳遞給局部變量。

Answer 1

你應該使用ajax

將函數“ date_converter”移至您的控制器

def date_converter
  number = params[:number]
  blah blah blah
  if blah < 2069
   error
  els if blah > 2069
   convert
  else
   this number
  end
end

然后，定義date_converter路徑並從Rails路由中獲取操作（示例等於：users / date_converter）並為您的js創建ajax

function numberFunction() {
  dispay_value = $('check_number').val();
  $.ajax({
      url: 'users/date_converter',
      type: 'GET',
      dataType: 'html',
      data: {
          number: dispay_value,
      }
  }).done(function(res) {
      $('#demo').html(res);
  });
}