ajax - 我希望我的选择下拉列表自动用Grails网站中的Ajax填充

Question

我正在尝试在Groovy Grails中创建“选择依赖项下拉列表”。我希望我的新用户从选择下拉列表中选择他们的国家/地区，省和electrolDistrict。我已经尝试过ajaxdependancyselection插件，但是我只能让这个国家出现。 ProvState和ElectoralDistricts不会显示在下拉列表中。也许我应该改用对象图构建器或节点构建器。任何建议都很好。谢谢。，

Answer 1

嘿，我把这个插件放在一起了，所以如果您需要帮助，请告诉我，对不起，直到现在为止还没有看到这个问题。

如果您可以共享这3个类的域类信息:
国家/地区，省和省/自治区/直辖市/直辖市/自治区，那么我可以帮助您汇总需要做的事情。

首先，他们之间的依赖性如何

    country  : String name, static hasMany = [states:provestate]
    provstate: String ???, 
static belongsTo = [ Country ] 
or ? static belongsTo = [ Country:country ],
 static hasMany= [district: electrolDistrict] 

    electrolDistrict : 
 String ???,
 static belongsTo = [ provstate ] 
or ? static belongsTo = [ state:provstate ],

还有:
https://github.com/vahidhedayati/ajaxdependancyselectexample

在“国家/地区” View 下看一下，这里有一些示例扩展了3种选择。

就个人而言，尽管此解决方案都能很好地工作，但我发现使用remoteFunction在密集表上更快，

这是我认为需要以某种方法合并到插件中的另一种方法，它仅基于两个选择框，但是您只需将第二个选择扩展到第三个选择，只需添加一个远程功能即可。 。

<div class="smallform">




<div id=SelectCountry class="fieldcontain ${hasErrors(bean: furnitureDonationInstance, field: 'country', 'error')} required">
    <label for="country">
        <g:message code="testcity.country.label" default="Choose Country" />
        <span class="required-indicator">*</span>
    </label>
    <g:select id="country" name="country" from="${com.myprofessions.radpost.Globe.list()}" optionKey="iso"  optionValue="country" required="" value="${params.country}" class="many-to-one"
        noSelection="['null': 'Please choose Country']"
        onchange="${remoteFunction (
        controller: 'selector',
        action: 'findCities',
        params: "'id=' + this.value",
        update: 'cityId'
    )}"
    />
</div>


<div id=SelectCity1 class="fieldcontain ${hasErrors(bean: furnitureDonationInstance, field: 'City', 'error')} required">
    <label for="country">
        <g:message code="testcity.city.label" default="Choose Country" />
        <span class="required-indicator">*</span>
    </label>
    <div id="cityId">
<g:select name="city" id="cityId1" optionKey="id" optionValue="city" from="[]" 
noSelection="['null': 'Please choose Country 11']" />
</div>
</div>

现在有一个名为 _cities.gsp 的单独模板，当被 Controller 的findCities操作调用时，该模板包含并替换cityId div内部内容

<g:select name="city" from="${cities}" optionValue="city" optionKey="id" noSelection="['null': 'Please choose city']"/>

在这里，您将像上面一样添加另一个onChange并为下一项重复该过程

SelectorController:

def findCities() { 
            def s=params.id
            String domclass1= (s.substring(0,1).toUpperCase())
            String domclass2=s.substring(1,s.length())
            String domclass=domclass1+domclass2.toLowerCase()
            Class domainClass = grailsApplication?.domainClasses.find { it.clazz.simpleName ==domclass+'Cities' }?.clazz
            def cities=loadCities(domainClass)
            render(template: 'cities', model:  [cities: cities])
        }
@Cacheable("RADPOST-CITY")
        def loadCities(def domainClass) {
            if (domainClass) {
            def cities=domainClass?.findAll()
            return cities
            }
        }

最终将结果汇总在一起并返回到城市模板

我在另一个插件中使用了domainClass etc cos，因此可以替换所有provstate？.findAll()等等。

我认为速度差异取决于ajaxdependancyselection插件如何捕获每个项目以及使用javascript在select下拉列表中重新创建options元素。

哦，顺便说一句，它传递的是iso，然后将其添加到domclass +'Cities'城市中，并创建AoCities或AuCities等，以便进行监视并根据您的实际domainClass进行修改，或者如上所述，删除所有对上课并直接调用