2012-08-08 148 views
0

在jquery mobile中,我为产品创建了一个单独的页面。它使用phonegap从查询Local Sq-lite数据库动态加载。下面的代码工作正常,并显示带有复选框的产品列表。但是,如果我单击一个复选框,则会选中所有复选框。还有一些本地复选框显示在屏幕上。如何正确显示此复选框列表并获取提交时检查复选框的值?单击复选框点击选择Jquery mobile中的所有复选框

$('#productspage').live('pageinit',function(event){ 
    loadProducts(); 
}); 

// Load Products for Products page 
function loadProducts() 
{ 
    var db=window.openDatabase("salesorder", "1.0", "SalesOrder", 1048576); 
    if(db!=null) 
    { 
     db.transaction(queryProductsTable, errorPT); 
    } 
    else 
    { 
     alert("table not exists"); 
    } 
} 


function queryProductsTable(tx) 
{ 
    tx.executeSql('SELECT * FROM products', [], queryProductsSuccess, errorPT); 
} 

function errorPT(err) { 
    alert("Error processing SQL: "+err.code); 
} 

//Query products and append to products_list 
function queryProductsSuccess(tx, results) { 
    var len = results.rows.length; 
    $("#products_list").empty(); 
    for (var i=0; i<len; i++){ 
      var product_id=results.rows.item(i).productid; // Returns null 
      var product_name=results.rows.item(i).productname; 
      var product_price=results.rows.item(i).unit_price; 
      var product_stock=results.rows.item(i).qtyinstock; 
      $("#products_list").append("<input type='checkbox' name='products_check' id='"+product_id+"' value='"+product_name+"' price='"+product_price+"' stock='"+product_stock+"' class='custom'><label for='"+product_id+"'>"+product_name+"</label>"); 
     } 
     $("#products_list").trigger("create"); 
} 

回答

1

你给每个复选框命名。将行号追加到名称中,以获得唯一的名称。

+0

我修改了每个复选框的唯一标识符,但没有工作。我在屏幕上看到了一个不需要的本机复选框显示。所有复选框的工作取决于此本机复选框。 – Ramprasad 2012-08-09 05:59:45

+0

我解决了这个问题...在queryProductsSuccess(tx,results)函数产品id返回“null”。所以这个复选框不能正确呈现也无法选择。在产品ID问题进行更改后,它工作正常。 – Ramprasad 2012-08-09 07:34:29