Ruby-Sinatra:以表单输入为参数的异步调用方法

我目前正在尝试构建一个小部件，它将根据用户名检索艺术家列表。

Ruby方法需要一个用户名参数，然后进行API调用以检索实际的字符串数组。

网页有一个输入字段，用户可以在其中填写他/她的用户名。我的目标是立即调用ruby方法并显示艺术家列表。我的问题是能够使用实际的表单输入作为参数。我认为使用params[：user]会相对容易，就像在Sinatra post方法中一样。唉，事实证明不是。

我尝试了JS方法和在：onkeyup之后直接调用该方法。

Javascript：

userChanged = function() {                  
    var user = document.getElementById("username");
    if (user.value.length != 0){                
    artists = #{RFCore::get_artists(:name => params[:user]).to_json};
    art_list.innerHTML = artists
    };
};

：onkey-up

:onkeyup => "art_list.innerHTML = #{RFCore::get_artists(:name => params[:user])[0]}"

我已经用我能想到的所有变体替换了params[：user]，比如"#{user}"和user。

返回的错误是"#{user}"和user的未定义方法[]' for params[:user] and undefined local variable or method user'。

也许有一个简单的解决方案；但这种感觉开始蔓延到我身上——我的做法一开始就错了。我对实现这一目标的任何其他方式持开放态度。

据我所知，您正在动态生成该JavaScript。因此，当您的Ruby代码生成它时，它会在您生成JavaScript代码时评估RFCore::get_artists表达式，而不是在用户与网页交互时。

如果是这样的话，我建议：

使用jQuery。它让你的生活更轻松
当有一些用户交互（例如按键）时，使用Ajax与服务器通信，以获取艺术家列表

下面是一个小型Sinatra应用程序，它演示了这种方法：

require 'sinatra'
get '/' do
  <<html
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
function userChanged()
{
  $.get('/get-artists',
        {username: $('#username').val()},
        function(data){
          $('#artists').html(data);
        });
}
</script>
User: <input id="username" type="text">
<button onclick="userChanged();">Look up</button>
<div id="artists"/>
html
end
get '/get-artists' do
  "Generate here list for user #{params[:username]}"
end

请注意，上面的代码只是一个示例。生成的HTML都是错误的，没有使用模板语言，等等。

相关内容

最新更新

热门标签：