如何在extjs4中集成jquery代码

时间:2013-03-21 06:33:50

标签: jquery extjs4 weather

我在extjs工作。我想找到特定城市的天气。我从“http://api.wunderground.com/api/4ab310c7d75542f3/geolookup/conditions/q/IA/pune.json”中得到了参考。它通过在html文件中编写以下代码来提供与json格式的给定城市相关的所有信息 -

   <script
    src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js">

</script>

<script>
    jQuery(document).ready(function($) {
                        $.ajax({
                                    url : "http://api.wunderground.com/api/4ab310c7d75542f3/geolookup/conditions/q/IA/Pune.json",
                                    dataType : "jsonp",
                                    success : function(parsed_json) {
                                        var location = parsed_json['location']['city'];
                                        var temp_c = parsed_json['current_observation']['temperature_string'];
                                        alert("Current temperature in "
                                                + location + " is: " + temp_c);
                                    }
                                });
                    });
</script>

它的工作正常。现在我想在extjs的控制器中集成这个jquery代码。那么有人可以指导我如何在extjs中集成上面的jquery代码吗?

3 个答案:

答案 0 :(得分:2)

以下extjs代码与您的代码相同,因此您可以在控制器内部使用它。

Ext.data.JsonP.request({
    url:"http://api.wunderground.com/api/4ab310c7d75542f3/geolookup/conditions/q/IA/Pune.json",
    success : function(parsed_json) {
        var location = parsed_json['location']['city'];
        var temp_c = parsed_json['current_observation']['temperature_string'];
        alert("Current temperature in " + location + " is: " + temp_c);
    }
});

答案 1 :(得分:0)

ExtJS和jQuery之间没有冲突(两者都有自己的命名空间)。只要在app.js之前加载了jQuery,就可以在ExtJS控制器中使用jQuery。我从ExtJS 4.x开始使用带有ExtJS的jQuery,从来没有任何问题。

答案 2 :(得分:0)

在sencha touch和extjs中,所有的javascript代码都放在app.js文件或其他类js文件中。你永远不会把这样的代码放在html的脚本标签中。如果您想在应用程序加载之前调用该位置或首先将其放入应用程序启动功能中,或将其直接放在上面。

//DO YOUR AJAX CALL HERE BEFORE YOUR APPLICATION LAUNCHES

    Ext.application({
        name: 'MyApp',
        launch: function() {

            //OR INSIDE THE LAUNCH FUNCTION
        }
    });