RadListView - 更新文本字段值

Posted 2023-04-13

【中文标题】RadListView - 更新文本字段值

【英文标题】：RadListView - Update a textfield value

【发布时间】：2019-02-01 16:09:19

【问题描述】：

我在 RadListView 中有一个产品列表，每个产品都有一个数量选择器。用户可以按 + - 按钮来增加或减少数量，也可以在文本字段中输入。所有这些控件都在工作，并且数据在 observable 中更新，但不在屏幕上。文本字段中显示的值不会在屏幕上更新。代码如下：

<StackLayout col="1" orientation="horizontal" class="qtySelect bg-secondary">
    <Label class="mdi qtyButtons" text="&#xe15c;" pid=" id " tap="qtyDecrease" />
    <TextField text=" quantity " keyboardType="Number" verticalAlignment="top" class="qtyText" />
    <Label class="mdi qtyButtons" text="&#xe147;" pid=" id " tap="qtyIncrease" />
</StackLayout>

JS

function findById(pid)
    var index;
    products.forEach (function(elem, i) 
        if(elem.id == pid)
            index = i;
        
    );
    return index;


exports.qtyDecrease = function(args)
    var index = findById(args.object.pid);
    console.log(index);
    var product = products.getItem(index);

    if(product.min_order < product.quantity)
        product.quantity = parseInt(product.quantity)-1;
    else
        Toast.makeText("Minimum quantity of "+product.min_order+" is required for this product.").show();
    products.set(index, product);


exports.qtyIncrease = function(args)
    var index = findById(args.object.pid);
    console.log(index);
    var product = products.getItem(index);

    product.quantity = parseInt(product.quantity)+1;
    products.set(index, product);

如果我将项目滚动出视图并返回，我可以看到更新后的值。我在列表上尝试了refresh() 方法，但这会使列表滚动到顶部，这是不可取的。

那么我怎样才能只对那个元素强制刷新呢？

编辑：完整代码

<lv:RadListView row="1" items=" products " id="productList">
    <lv:RadListView.listViewLayout>
        <lv:ListViewGridLayout scrollDirection="Vertical" spanCount="2" />
    </lv:RadListView.listViewLayout>

  <lv:RadListView.itemTemplate>
    <GridLayout rows=" width+', auto' " class="borders">
      <fresco:FrescoDrawee row="0"   decodeWidth=" width " decodeHeight=" width " imageUri=" image " placeholderImageUri="~/images/loading.jpg" failureImageUri="~/images/loading.jpg" progressiveRenderingEnabled="true" id=" 'product'+id " tap="selectItem" />
      <StackLayout row="1" class="card-content bg-white">
        <label text=" name " class="bold" />
        <Label text=" 'Net Weight: '+netWeight+' gms' " class="h6 text-black" />
        <GridLayout columns="auto,auto">
            <Label col="0" text="Qty: " class="h6 text-black" />
            <StackLayout col="1" orientation="horizontal" class="qtySelect bg-secondary">
            <Label class="mdi qtyButtons" text="&#xe15c;" pid=" id " tap="qtyDecrease" />
            <TextField text=" quantity " keyboardType="Number" verticalAlignment="top" class="qtyText" />
            <Label class="mdi qtyButtons" text="&#xe147;" pid=" id " tap="qtyIncrease" />
          </StackLayout>
                </GridLayout>
        <Button text=" addToCartText " class="btn trans-white" padding="0" pid=" id " tap="addToCart" />
      </StackLayout>
    </GridLayout>
  </lv:RadListView.itemTemplate>
</lv:RadListView>

JS

const screenWidth = settings.getNumber("screenWidth");
var boxWidth = screenWidth/2;
var page;
var prodSearchCriteria;
var productRadList;
var productsVM;
var products;
var numProductsView;

function loadProducts(criteria)
    http.request(
        url: config.apiUrl+"products.php",
        method: "POST",
        headers:  "Content-Type": "application/json" ,
        content: JSON.stringify(
            auth: config.apiAuth,
            criteria: criteria
        )
    ).then(function(request)
        var response = JSON.parse(request.content);

        productsVM.set("numProducts", response.data.length);
        productsVM.set("minWeight", response.min_weight);
        productsVM.set("maxWeight", response.max_weight);
        productsVM.set("designs", response.designs);

        products.length = 0;
        for (var i = 0; i < response.data.length; i++) 
            products.push(
                id: response.data[i].id,
                image: config.siteUrl+"/product_img/"+response.data[i].image,
                name: response.data[i].name,
                netWeight: response.data[i].net_weight,
                width: boxWidth,
                min_order: response.data[i].min_order,
                quantity: response.data[i].min_order,
                addToCartText: "Add to Cart"
            );
        
        productIdsString = productIdsString.slice(0, -1);
        numProductsView.resetNativeView();
    , function(error)
        console.log(JSON.stringify(error));
    );


exports.onLoaded = function(args) 
        page = args.object;
        prodSearchCriteria = page.navigationContext;
        if("filters" in prodSearchCriteria)
         else 
            prodSearchCriteria.filters = ;
        

        productsVM = new observableModule.fromObject(
            userAvatar: settings.getString("userAvatar"),
            userEmail: settings.getString("userEmail"),
            cartNumProducts: settings.getNumber("cartNumProducts"),
            cartNetWeight: settings.getNumber("cartNetWeight"),
            cartFineWeight: settings.getNumber("cartFineWeight"),
            cartLabor: settings.getNumber("cartLabor"),
            numProducts: 0,
            minWeight: 0,
            maxWeight: 0,
            designs: []
        );
        products = new observableArrayModule.ObservableArray();

        page.bindingContext = productsVM;
        productsVM.set("products", products);

        numProductsView = view.getViewById(page, "numProducts")
        productRadList = view.getViewById(page, "productList");

        loadProducts(prodSearchCriteria);

【参考方案1】：

尝试将数量变化包装在setTimeout() 10 毫秒内

【参考方案2】：

您是否尝试再次手动绑定数据（在增加 - 减少功能和文本字段的更改事件中）？

【讨论】：

嘿，重新绑定数据是什么意思？我还分享了更多与加载和绑定产品信息相关的代码。

我的意思是再次绑定完整数据 "productsVM.set("products", products);"顺便说一句，您是否尝试更改任何其他组件，例如标签？只有文本字段或任何通过 loadProduct() 绑定的组件有问题吗？