如何在动态添加行后刷新JQuery移动表 [英] How to refresh JQuery mobile table after a row is added dynamically

问题描述

我基于我从服务器获取的JSON字符串向JQ Mobile表添加行。

I am adding rows to a JQ Mobile table based on a JSON string that I am getting from the server.

刷新后第一次进入页面时，没有添加任何样式，但是之后每次都能正常工作。

The first time I go to the page after a refresh, none of the styling is added, however everything works fine everytime after that.

有没有办法像列表视图一样刷新/初始化表？

Is there a way to refresh/initialize a table as you can for listviews?

下面的代码是我在哪里添加行：

The code below is where I am adding the rows:

$.each(result, function() {
    var imgString;

    if(result[i]["status"] == 'Y') {
        imgString = '<img src= images/checkMark.png height=\"40\" width=\"40\" align=\"middle\">';
    } else {
        imgString = '';
    }

    $('#pickupTable > tbody:last').append('<tr><td class=\"tableRow10\">' +  imgString + 
      '<td class=\"tableRow80\"><a><button class=\"selectPickup\" pickupCode = \"'+ 
      result[i]["id"] + '\"> '+ result[i]["address"] +'</button></a></td></tr>');
    i++;
});

$('#pickupTable > tfoot:last').append('<tr><td colspan="5">Total Pick Ups: ' 
  +result.length + '</td></tr>');

推荐答案

我建议你使用.trigger（'create' ）;并刷新页面，jQM文档：

I would suggest you use .trigger('create'); and refresh the page, jQM Docs:

• http://jquerymobile.com/demos/1.0.1/docs/pages/page-scripting.html

• http://jquerymobile.com/demos/1.0.1/docs/pages/page-scripting.html

增强新标记
页面插件调度一个pagecreate事件，大多数小部件都用它来自动 - 初始化自己。由于引用了小部件插件脚本
，它会自动增强
它在页面上找到的小部件的任何实例。

Enhancing new markup
The page plugin dispatches a pagecreate event, which most widgets use to auto-initialize themselves. As long as a widget plugin script is referenced, it will automatically enhance any instances of the widgets it finds on the page.

但是，如果您通过
Ajax生成新标记客户端或加载内容并将其注入页面，则可以触发create事件到
处理$ b $中包含的所有插件的自动初始化b新标记。这可以在任何元素上触发（甚至是页面
div本身），为您节省了手动初始化每个插件
（listview按钮，选择等）的任务。

However, if you generate new markup client-side or load in content via Ajax and inject it into a page, you can trigger the create event to handle the auto-initialization for all the plugins contained within the new markup. This can be triggered on any element (even the page div itself), saving you the task of manually initializing each plugin (listview button, select, etc.).

例如，如果通过Ajax加载了一个HTML标记块（比如登录表单）
，则触发create事件以自动转换
它包含的所有小部件（输入）这个例子中的按钮）到
增强版本中。此方案的代码为：

For example, if a block of HTML markup (say a login form) was loaded in through Ajax, trigger the create event to automatically transform all the widgets it contains (inputs and buttons in this case) into the enhanced versions. The code for this scenario would be:

$( ...new markup that contains widgets... ).appendTo( ".ui-page" ).trigger( "create" );

这篇关于如何在动态添加行后刷新JQuery移动表的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！