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事件後如何添加輸入文本框？

回答

相關問題