Jquery 在Rails中使用AJAX和Json响应重新加载部分视图

当我调用$.getJSON时，我想重新加载tbody元素。换句话说，我需要删除所有元素并通过Json响应放置新元素

JS

我的看法

# index.html.erb

<tbody id="position">
  <%= render :partial => "activities"%>
</tbody>

---

从您的代码中，我得到的印象是，您试图做的是生成新的HTML服务器端并将其插入到文档中。如果是这种情况，请尝试以下操作：

$.get( '/save_positions', { ids : newOrder } ).done( function( data ) {

  $( "#position" ).html( $( data ).html() );

} );

如果您真的想要返回JSON，那么您可能想要返回一个对象数组并对其进行迭代以生成新的HTML，可能需要使用诸如Mustach之类的模板引擎，例如：

没有模板引擎：

$.getJSON( '/save_positions.json', { ids : newOrder } ).done( function( data ) {

  var positions = [];

  $.each( data, function ( key, val ) {

    // generate an element
    var el = $( "<tr>" );

    // ...

    positions.push( el );

  } );

  $( "#position" ).empty().append( positions );

} );

胡子模板：

{{#positions}}

<tr id='{{activity.id}}'>
  <td>{{activity.position}}</td>
  <td>{{activity.url}}</td>
  <td>{{activity.name}}</td>
  <td>{{activity.estimated}}</td>
  <td>{{activity.used}}</td>
  <td>{{activity.created_at}}</td>
</tr>

{{/positions}}

{{{#positions}
{{activity.position}}
{{activity.url}
{{activity.name}
{{activity.estimated}}
{{activity.used}}
{{activity.created_at}}
{{/位置}

您想在服务器上生成新的HTML，返回并插入到文档中，还是想返回JSON并在JavaScript中处理以生成新的HTML？随便。。我只想重新加载表而不重新加载页面我想使用_activities.html.erb.生成新的html。。此命令正在清理表元素，但没有使用Json响应填充。。我可以不用Mustache吗？如果你在服务器上生成HTML，那么你只需要发送一个HTML响应，你不需要JSON。请尝试我的第一段代码，它使用

$.get（'/save_positions'.

），而不是代码中的

$.getJSON（'/save_positions.json'.

）。使用Chrome开发工具/Firebug/something查看响应中的内容，并确保它是您期望的HTML。谢谢JMM！！！我使用了第一个选项（HTML服务器端）…但是我更改了

'$（“#位置”）.HTML（$（数据）.HTML（））；

的

'$（“#位置”）.HTML（数据）；

好的，我不确定你返回的是什么HTML——你确定在

tbody

中没有给你一个

tbody

，例如

…

？（你可以用Chrome开发工具或Firebug来检查它。）它只返回

…

而不返回

$.get( '/save_positions', { ids : newOrder } ).done( function( data ) {

  $( "#position" ).html( $( data ).html() );

} );

$.getJSON( '/save_positions.json', { ids : newOrder } ).done( function( data ) {

  var positions = [];

  $.each( data, function ( key, val ) {

    // generate an element
    var el = $( "<tr>" );

    // ...

    positions.push( el );

  } );

  $( "#position" ).empty().append( positions );

} );

$.getJSON( '/save_positions.json', { ids : newOrder } ).done( function( data ) {

  var positions = Mustache.render( template, data );

  $( "#position" ).html( positions );

} );

{{#positions}}

<tr id='{{activity.id}}'>
  <td>{{activity.position}}</td>
  <td>{{activity.url}}</td>
  <td>{{activity.name}}</td>
  <td>{{activity.estimated}}</td>
  <td>{{activity.used}}</td>
  <td>{{activity.created_at}}</td>
</tr>

{{/positions}}