YUI JavaScript - 选择onchange事件后如何添加输入文本框？

如何在带有YUI库的选择框中的onchange事件之后插入额外的输入文本框？YUI JavaScript - 选择onchange事件后如何添加输入文本框？

需要使用YUI，并使用PEAR Quickforms库创建表单。

什么我还没有是这样的：

$form->addElement('select', 'names', "Choose Name", $options, array('style'=>'width:300px', 'onchange' => 'name_changed(this.value);')); 

$js = 
<<<EOS 
<script type="text/javascript"> 
    function name_changed(name) { 
     alert('name is changed'); 
    } 
</script> 
EOS; 

$form->addElement('static', 'jsembed', '', utf8_encode($js));

如果我更改选项的选择框警报弹出，这个工程进行测试。

现在我需要检查选择的选项，如果这等于'新'，应该出现一个文本输入框以在选择框下输入新名称。

我的问题是，我不知道做的正确，输入的名称也传递给提交的quickform数据。

所以我用$ form-> addElement（'input'，...）创建了元素，并复制了这个html的源代码。在选项更改事件我已经试过在正确的位置与此插入原始的html代码：

var htmlContent = '<div id="fitem_id_dbname" class="fitem fitem_ftext"><div class="fitemtitle"><label for="id_dbname">Create new DB </label></div><div class="felement ftext" id="yui_275"><input size="60" name="dbname" type="text" value="" id="id_dbname"></div></div>'; 
document.getElementsByClassName('fcontainer clearfix').innerHTML = htmlContent;

但是，这并不工作，有没有出现输入字段在浏览器中。

有人能告诉我该怎么做对吗？非常感谢！

来源

2013-04-27 Danny Archer

你应该发布你的解决方案作为答案 – juandopazo 2013-04-28 15:31:23

我现在做了，谢谢你的通知。 – 2013-04-29 11:52:28

我现在解决了这个问题对我来说...

'style'=>'display:none'

...在quickform的TextInput元素，并使用属性...

document.getElementById('id of the input element').style.display = 'block';

...这就是所谓的onchange事件。

来源

2013-04-29 11:51:53

YUI JavaScript - 选择onchange事件后如何添加输入文本框？

回答

相关问题