越是深入学习,发现问题越来越多,今天就来说说joomla的ajax应用.由于笔者也是初步使用,文章中难免有一些错误,希望了解的朋友不厉赐教.本文joomla还是1.5版本,ajax采用的是最流行的jquery1.72版本,提交方式采用get方式,返回格式html,此处不使用json,关于json以后再说.在使用中发现,joomla并不能很好应用ajax,而且关于ajax的文章屈指可数,就是有也是英文的,我是看不懂,所以这里我也是进行一些测试,ajax操作一般就是为了页面局部刷新,不需要跳转页面而实现的一种目前流行的方法.好了多余的话不说了,还是用代码来说明一切.
这里的这个例子是点击左边导航分类,右边以ajax方式列出分类下所有文章.原来的项目中并非是这样,二十通过复选和模拟单选颜色,每选择一次都会ajax返回数据,为了简单期间,个人就用个简单例子来实现,不过最终这个组件还是失败了,我就不得不说一句,如果你的ajax返回数据中有javascript代码或者外部导入js文件,那么ajax返回部分中的js效果应用全部失灵.所以凡是用到脚本的,你就不要用ajax了,我查过资料,ajax返回数据是过滤js的.这和我joomla中应用不谋而合,一个点小图看大图怎么也不起作用,原来是ajax返回在作怪,当然,通过eval函数可以实现执行javascript,不过稍微复杂一点的都不行.所以joomla中ajax适合返回普通数据,只要不包含javascript就好.
上面说到的第一点就是ajax的html返回方式中不能执行javascript.那么第二点就是joomla返回数据中会包含所有信息,而不是需要的部分,一般这里都是一个组件,如果你想返回的数据只有组建部分,不包含左边导航,上边菜单以及其他非组建本身的数据.那么你可以在ajax提交地址的时候连接这样一个参数"&tmpl=component",这个参数连接到ajax提交结尾即可,注意用+,这里是javascript,不使用.哦,还有一种就是把index.php?option=com_set换成indexe2.php?option=com_set这种形式,这样就不用上边的代码就是多加一个2,我们在joomla根目录发现index2.php就是只加载组建,这样返回的数据就适合ajax形式了.不过还是不能只需要<div>数据</div>这种形式.因为还有头标记.目前我也不知道如何去掉.求高手赐教.
$.get("index.php?option=com_golist&controller=ajax&task=show&styles="+str+"&rel="+str1+"&types="+str2+"&tmpl=component",function(data){
$('#right').html(data);
});
以上就是ajax的get方式提交数据,这里的数据处理都在task=show的show方法,这里的com_golist是一个组件,styles是一个复选数组,rel是一个单选模拟值,types也是复选框,后边就是只返回组建数据,而不需要其他模块.这些str,str1,str2都是数据,通过jquery就可以取到.返回值就是show方法处理,至于怎么处理,这不是我需要说的,你只需要用php的get方法接收即可,然后想做什么都可以,这里给一张数据图
看见没有,不管是点击上边复选,还是模拟控件单选颜色,都会列出相应数据,由于是ajax提交,所以你看不到页面跳转.最后把数据data在id是right的div里面显示出来.好了,joomla里面使用ajax非常方面,哦,不要忘记加载jquery文件哦.
上边的ajax方式适合提交返回数据没有javascript执行的数据.如果使用了javascript,那就需要使用普通的表单提交.下次专门讲解表单get提交.关于post表单提交我想网上资料非常多.joomla的教程网上很多,不过笔者介绍的内容基本上都是自己在使用过程中的总结,如果你有更好的方法,欢迎交流.谢谢读到本文的朋友,joomla使用者可以关注我,本博客长期更新joomla和php以及jquery方面知识的个人体会.
无代码 无真相
下载这三个模块 由于只有部分代码,所以并不能直接使用,需要你改动,下载:https://files.cnblogs.com/logoove/mod_types3.zip
(本文原创首发 by Yoby)