Question

在组件的视图中，我有类似的东西：

<?php echo TestcompHelperFind::loadStates(...); ?>
<?php echo TestcompHelperFind::loadCounties(...); ?>

以上静态函数分别按州名和国家/地区加载<select>下拉列表。

课程TestcompHelperFind位于文件/administrator/components/com_testcomp/helpers/find.php。

如何根据使用AJAX选择的国家/地区加载状态下拉列表？我不确定我应该在ajax函数中提供什么URL。

Answer 1

在客户端上，您将需要一个监视国家/地区选择更改的函数，当它发生时，调用带有回调的相应URL，该回调将填充县选择。

在服务器上，您需要输出选择内容。

由于你的html输出已经有效，让我们使用这种方法。作为替代方案，您可以让您的服务器方法返回一个json对象并使用javascript来解析它并填充select。但是我们坚持使用html通信，即服务器返回select的html内容。

<强> 1。在服务器上

<强> 1.A。输出县选择

我们只需要将TestcompHelperFind::loadCounties(...);的结果返回给ajax调用。这很容易在组件的控制器中编写新方法，即组件文件夹根目录中的controller.php或其中一个子控制器（如果适用）。你可以把它放在一个有意义的地方。

在控制器内部，只需添加一个新的公共任务，例如

class SomethingController extends JController
{
    public function getCountiesHTML() {
        $input = JFactory::getApplication()->input;
        $country = $input->getCMD('filter_country');
        // load helper if necessary, then:
        echo TestcompHelperFind::loadCounties($country); 
        exit; // this will stop Joomla processing, and not output template modules etc.
    }

请注意最后的exit;，这将使Joomla仅输出组件的输出（我们的回声），而不是整个模板/模块等。

1.b向国家/地区和县添加ID选择，以便可以在客户端上操作它们;我假设filter_country和filter_county;

<强> 2。在客户端

您需要调用网址

index.php?option=com_something&action=getCountiesHTML&filter_country=UK

更改国家/地区选择时。它还需要取消任何待处理的请求以避免重叠消息。为了简单起见，我们假设您使用库来处理Ajax，我将为jQuery编写一个示例：

<script>
var xhr;
jQuery(function($) {
    $('#filter_country').change(function(){
        var filterCountry = $('#filter_country').val(); 
        if (xhr && xhr.abort) {xhr.abort();xhr=false;}
        xhr = jQuery.ajax(
                url: 'index.php', 
                data: 'option=com_something&task=getCountiesHTML&filter_country='+filterCountry, 
                success: function(data){
                    jQuery('#filter_county').replaceWith(data);
                }
        );
    });
});
</script>

要取消之前的请求，请参阅this one等专用答案。

如何在Joomla组件中使用AJAX来加载基于所选国家/地区的State字段？

1 个答案: