Question

我有一些javascript显示该组的成员列表（本例中为链接）如何让rails填充该列表？

我目前可以使用members

在带有html视图的浏览器中获取第45组中/groups/45的列表

我正在尝试$.get调用，但我不确定如何将结果放入列表中。大概是通过xml或json但不确定如何。

我的观点有：

  %ul#sortable
    - @members.each do |loop|
      = content_tag_for :li, loop do
        - construct_hyperlink(loop.url_address, loop.alt_text)
        = sanitize @address_url
        \- #{h @new_link_alt_text}            &nbsp;&nbsp;#{link_to 'details', link_path(loop), {"title" => loop.alt_text}}            &nbsp;&nbsp;#{link_to 'edit', edit_link_path(loop), {"title" => loop.alt_text}}

我的js有：

$(function(){
  $("a[data-show-group-members]='true'").bind('click', function() {
    var gid= $(this).data("id");
    var gname= $(this).data("name");
    var links=$.get('/groups/' + gid);
    $('<tr><td colspan="4">Members:</br><ul><li>1</li><li>2</li><li>3</li></ul>Delete the <b>'+gname+'</b> group and all its members: <b><a rel="nofollow" data-method="delete" data-confirm="Are you sure?" href=\'/groups/'+gid+'\'>Yes</a></b> <b><a href="groups" data-close-group="true">No</b></br></br>').insertAfter($(this).closest('tr'));
    $(this).html("");
  }); 
});

但我不确定如何填充UL（目前它有占位符li

我的群组控制人员：

  def show
    @group = Group.find(params[:id])
    @members = Link.find_all_by_group_id(params[:id], :order => 'position')
    respond_to do |format|
      format.html # show.html.erb
      format.xml  { render :xml => @group }
    end
  end

所以我可以使用format.xml或者我可以添加format.json但是如何调用它并输出具有组名的UL。

集团是：

id: integer, group_name: string, 
created_at: datetime, updated_at: datetime, group_description: string

显示成员和删除组的链接后，该部分正常工作这只是列出该组的成员（链接）。

我更喜欢为教育目的而避免使用框架（除了rails和jquery）的答案。

Answer 1

jQuery $ .get（）是一个异步函数，所以你需要在这里使用一个回调（它是一个替代$ .ajax（）的便捷方法，而不需要指定它是一个GET请求）。

尝试使用此格式的内容

$.get(<url, make sure to include the .xml extension>, function(<xml data>) {
    // do something with your xml data
});

这是因为服务器需要时间来响应请求（可能只有几毫秒）但你不能像在ruby这样的语言中直接将这个值分配给变量。

希望有所帮助，欢呼！

Answer 2

我最终使用的方法是ajax和json：

/app/assets/javascript/show_group_members.js.erb

$(function(){
  $("a[data-show-group-members]='true'").bind('click', function() {
    var gid= $(this).data("id");
    var gname= $(this).data("name");
    $('<tr><td colspan="4">Members:</br><ul id="group-members"></ul>Delete the <b>'+
    gname+
    '</b> group and all its members: <b><a rel="nofollow" data-method="delete" '+
    'data-confirm="Are you sure?" href=\'/groups/'+gid+'\'>Yes</a>'+
    '</b> <b><a href="groups" data-close-group="true">No</b></br></br>')
    .insertAfter($(this).closest('tr'));
    var the_links=
      $.ajax({
        type: "GET",
        url: "/groups/"+gid,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (result) {
          DisplayListItems(result);
        },
        "error": function (result) {
          var response = result.responseText;
          alert('Error loading: ' + response);
        } 
      }); 
    function DisplayListItems(list) {
      $.each(list, function(index, element) {
        var itemHTML = ["<li>", element.url_address, ' ', element.group_description, "</li>"].join('\n');
        $("ul#group-members").append(itemHTML);
      });
    } 

    $(this).html("");
  });
});

我没有必要改变路线（现有的宁静资源工作正常）或模型。

集团控制人刚刚加入了json：

format.json { render json: @members }

触发此操作的初始链接（并传入组ID - 严重）是：

%td= link_to 'Delete group with members', group, :remote => true,
:data => {:show_group_members => true, :id => group.id,:name => group.group_name}

（以上是HAML）

如何使用$ .get使用Rails查询填充列表

2 个答案: