`

动态加载select内容 不显示 error

jqm 
阅读更多
最近在做jqm开发过程中需要做一个地址选择器,做成异步加载形式。在web浏览器下一切正常,可是一放到手机上需要异步加载的数据总是获取不到,急呀。
html部分代码

<div data-role="fieldcontain">
   <label for="province" class="select">省</label>
   <select name="stateProvinceGeoId" id="province" data-native-menu="false">
   <option value="">请选择:</option>
   <#list provinceGeoList?if_exists as provinceGeo>
   <option value="${provinceGeo.geoId?if_exists}"
    <#if provinceGeo.geoId==(postalAddress.stateProvinceGeoId)?default("")>selected</#if> >${provinceGeo.geoName}</option>
   </#list>
   </select>
</div>
<div data-role="fieldcontain">
   <label for="city" class="select">市</label>
   <select name="cityGeoId" id="city" data-native-menu="false">
        <option value="">请选择:</option>
   </select>
   </label>
</div>

<div data-role="fieldcontain">
   <label for="county" class="select">显:</label>
   <select name="countyGeoId" id="county" data-native-menu="false">
   <option value="">${uiLabelMap.PleaseChoose}</option>
    </select>
</div>
======================================================================
js部分代码
$("#province").change(function() {
   var provinceValue = $("#province").val();
   var city = $("#city");
   getGeoSelect("PROVINCE", provinceValue, city);
   var county = $("#county");
   county.empty();
   $("<option value=''>${uiLabelMap.PleaseChoose}                 </option>").appendTo(county);
        county.selectmenu("refresh");
    });

    $("#city").change(function() {
        var cityValue = $("#city").val();
        var county = $("#county");
        getGeoSelect("CITY", cityValue, county);
    });

    function getGeoSelect(geoTypeParameter, geoIdParameter, oSelect) {
       
       $.ajax({
            url:"<@ofbizUrl>getgeo</@ofbizUrl>" ,
            type:"GET",
            data:"geoTypeParameter="+geoTypeParameter+"&geoIdParameter="+geoIdParameter,
            contentType: "application/json",           
            success:function (data,status){
                alert(status);
                $.each(data.geoList, function(i, item) {
                    var optionKeyValue = "<option value=" + item.geoId + ">" + item.geoName + "</option>";
                    $(optionKeyValue).appendTo(oSelect);
                });
                oSelect.selectmenu("refresh");
            },
               error:function (){
                alert("error");
            }
        });
}
以上代码在浏览器中执行没有问题,但是一到手机上就获取不到数据, 异步请求后error函数总是执行,百思不得其解。无奈只好逛论坛了,终于有所收获呀。
http://forum.jquery.com/topic/dynamically-generated-listview在这个帖子里我找到了解决的办法。

I solved this by doing an synchronous load using the .ajax() method instead, otherwise refreshing the listview will not work because it is not loaded (if done async)


Here's some sample code which worked for me.


$.ajax({ url: "get-new-list-url.php",
async: false,
success: function(data) {
//alert("Loaded content...");
       $("#isearch-results").html(data);
$("#search-results-list").listview("refresh");
     },
error: function(response, error) {
//alert("Error: " + response + " : " + error)
$("#search-results").html("Unable to load search results.");
}
});


Hope that helps..

根据这个我把我的ajax请求加上async: false, 问题终于解决了。
浪费这么久时间就为了这一句话呀.....无语  留存记录以备后用。
 
分享到:
评论

相关推荐

    jQuery实现动态加载select下拉列表项功能示例

    本文通过一个使用jQuery实现的示例,详细讲解了如何动态加载select元素中的下拉列表项,从而允许根据不同的业务场景或用户交互来加载不同的数据项。 ### 知识点一:静态与动态下拉列表的区别 在传统的Web页面设计...

    listbox动态加载item

    首先,我们要明确动态加载的基本思路:根据用户操作或特定事件,如滚动、搜索或分页,向服务器发送请求,获取部分数据并将其添加到ListBox中。这种技术通常与Ajax(异步JavaScript和XML)相结合,利用JavaScript进行...

    jquery Ajax实现Select动态添加数据

    在本案例中,我们将深入探讨如何使用jQuery和Ajax技术来实现在Select元素中动态添加数据,这通常用于实现交互式的用户界面,如联动下拉菜单。 首先,背景情况是这样的:传统的Select元素通常在页面加载时就包含了...

    C#,winform,listView动态插入数据

    为了能够动态地向`ListView`中添加数据,我们需要完成以下步骤: 1. **创建新的WinForms项目**:打开Visual Studio,创建一个新的Windows Forms App (.NET Framework)项目。 2. **添加ListView控件**:在工具箱中...

    AJAX 动态加载后台数据 绑定select的方法

    现在,让我们根据所提供的内容,详细说明如何动态加载后台数据并绑定到select元素的过程: 首先,需要一个select元素,并且为其赋予一个唯一的ID,以确保在JavaScript中可以准确无误地选取到它。在HTML代码中,它...

    qt TableView显示数据库表中的数据

    这将允许你定制数据的加载、显示和编辑行为,比如处理复杂的数据结构或自定义数据格式。 7. **信号与槽**:Qt的信号和槽机制使得在数据改变时更新UI变得简单。当查询结果发生变化时,可以连接模型的`dataChanged()`...

    ajax实现动态从数据库模糊查询显示到下拉框中(ajax方法返回Dataset的例子

    在Web开发中,Ajax(Asynchronous JavaScript and XML)技术被广泛用于实现页面...这个过程不仅提高了用户体验,还降低了服务器与客户端之间的通信成本,因为只有在用户输入时才会发起请求,而不是一次性加载所有数据。

    ajax 返回结果拼装到 select

    在Web开发中,Ajax(Asynchronous JavaScript and XML)是一种创建动态网页的技术,允许在不刷新整个页面的情况下,与服务器交换数据并更新部分网页内容。在本篇讨论中,我们将聚焦于如何利用Ajax获取服务器返回的...

    SelectTime

    例如,你可以改变日期和时间的显示格式,设置选择范围,甚至自定义每个单元格的显示内容。此外,颜色、字体、大小等视觉元素都可以进行定制,以确保选择器与应用的整体设计风格保持一致。 为了更好地理解如何使用...

    Q694264 C# ajax读取后台接口,填充给select下拉框

    在C#后端开发中,我们经常需要与前端进行数据交互,以便动态更新页面内容。在本场景中,用户提出了一个问题:如何使用AJAX技术从C#后台接口获取数据,并将这些数据填充到HTML的select下拉框中。这是一个常见的前端与...

    在element-ui的select下拉框加上滚动加载

    为了解决这个问题,我们可以实现一个滚动加载功能,即在用户滚动到下拉框底部时动态加载更多数据。本文将详细介绍如何在Element-UI的`&lt;el-select&gt;`下拉框中实现滚动加载。 首先,滚动加载的核心在于监听滚动事件并...

    jquery ajax函数调用xml文件select表单全国城市

    总的来说,结合jQuery的AJAX功能和XML数据格式,我们可以轻松地实现动态加载和显示数据,这对于构建交互性强、响应快速的网页应用是非常有用的。在这个实例中,我们学会了如何从XML文件获取数据,并将其呈现为HTML的...

    jquery select动态加载选择(兼容各种浏览器)

    动态加载选择器的基本思路是通过Ajax请求获取数据,然后遍历数据并创建新的`&lt;option&gt;`元素插入到`&lt;select&gt;`中。 以下是一个简单的步骤来实现jQuery select动态加载: 1. **创建HTML结构**: 首先,我们需要一个空...

    ERROR 1222 (21000): The used SELECT statements have a different number of columns

    总之,理解`UNION`操作的规则,并仔细检查你的`SELECT`语句,确保它们在列数和数据类型上匹配,是避免“ERROR 1222 (21000)”的关键。通过遵循这些原则和建议,你可以有效地解决这类问题,并编写出更稳定、更高效的...

    Select模型

    - 如果`select()`函数调用失败,会返回`SOCKET_ERROR`错误代码。 - 如果将等待时间设置为0(即`tv_sec`和`tv_usec`均为0),则`select()`函数会在检查完套接字描述符后立即返回,这可用于探测所选套接字的状态。但是...

    在一个JSP页面里面根据条件动态的加载另一个jsp页面

    在这个场景中,我们讨论的是如何在一个JSP页面上根据特定条件动态地加载另一个JSP页面,这个新加载的页面通常会显示从数据库(例如Oracle)中检索到的数据。这通常涉及到前端技术如jQuery和Ajax,以及服务器端的处理...

    PHP+mysql 数据库连接,添加数据,显示数据

    本教程将围绕"PHP+mysql 数据库连接,添加数据,显示数据"这一主题展开,讲解如何通过PHP操作MySQL数据库,实现数据的添加和展示。 首先,我们来看`conn.php`,这是用来建立PHP与MySQL数据库连接的文件。在PHP中,...

    C--网络编程SELECT函数用法详解

    以下是一个简单的使用`select`函数接收网络数据并写入文件的例子: ```c++ #include &lt;sys/select.h&gt; #include #include int main() { int sock; FILE* fp; fd_set fds; struct timeval timeout = {3, 0}; // ...

Global site tag (gtag.js) - Google Analytics