将下拉列表值传递给Grails中的jquery

我正在修改注册表单，并且希望使用jQuery来简化表单。将下拉列表值传递给Grails中的jquery

该网站的用户可以是Teachers,Donors或两者。 Teachers有Donors不需要的字段，反之亦然。因此，我没有在所有领域填写表格并通过询问他们的教学等级来混淆国际用户，而是实施了一个下拉列表，以便用户可以选择他们的角色，并通过append()方法查看唯一的必填字段。

这是迄今为止我已经建立了形式：

<g:formRemote name="register" url="[controller:'user', action:'register']" onSuccess="showFields()"> 
    <dl> 
     <dt>User name</dt> 
     <dd><g:textField name="username" value ="${user?.username }"/></dd> 

     <dt>Password</dt> 
     <dd><g:passwordField name="password" value = "${user?.password }"/></dd> 

     <dt>Repeat Password</dt> 
     <dd><g:passwordField name="passwordRepeat" value = "${user?.passwordRepeat }" /></dd> 

     <dt>Account Type</dt> 
     <dd> 
      <g:select name="role" from="${['Teacher', 'Donor', 'Both'] }"/> 
     </dd> 
    </dl> 



    <input type="submit" value="Register" /> 
</g:formRemote>

和脚本是

<script type="text/javascript"> 
    $('#role').change(function(){ 
     var user = $('#role option:selected').text(); 

     alert(user); 

     if (user == 'Teacher'){ 

     } else if (user == 'Donor'){ 

     } else { 

     } 

    }); 
</script>

用Firebug，我已经验证了选择列表中的ID role，但该功能不会触发。事实上，无论我做什么选择，它都完全被忽视。

这是怎么发生的？

来源

2012-04-16 Jason

是$（document）.ready内的脚本？ – 2012-04-16 20:36:59

@SimonEdström，你的建议是解决方案。如果您将其作为答案提交，我会接受它。 – Jason 2012-04-16 20:55:17

谢谢，我发布了一个答案。这可能是基本的你，但我试图解释，所以其他人可以理解发生了什么...... – 2012-04-16 21:47:10

问题是脚本在DOM加载之前执行。所以当你试图绑定事件处理器时，元素不存在。

所以你需要做的是将完整的函数包装在文档就绪事件中，它将在加载完整的DOM之后尝试绑定更改事件处理程序。

$(document).ready(function(){ 
    $('#role').change(function(){ 
     var user = $('#role option:selected').text(); 

     alert(user); 

     if (user == 'Teacher'){ 

     } else if (user == 'Donor'){ 

     } else { 

     } 
    }); 
});

或者您可以简单地在页面底部添加脚本。这不是推荐，但FYI ...

来源

2012-04-16 21:46:23

你需要做的：

$("[name='role']").change(function() {

您选择使用#name id属性，使用你选择的是有角色的名称属性的元素上面的代码。

来源

2012-04-16 20:35:59 mattytommo

@Jason说，他检查了萤火虫和* id *的作用。 – 2012-04-16 20:37:50

是的，但从标记它不是:)。我怀疑他可能会混淆他在Firebug中看到的内容:) – mattytommo 2012-04-16 20:40:06

问题是我没有$（document）.ready内的函数。所以没有被调用，因为没有明确的函数调用。 – Jason 2012-04-16 20:56:31

将下拉列表值传递给Grails中的jquery

回答

相关问题