请教如何扩展ext的textfield组件,做成类似combo的组件,当textfield中的内容超出了显示范围,文本框中出现一个按钮比如“...”,点击这个按钮弹出层,现实文本框中的完整信息,哪位有过类似的扩展,请赐教

解决方案 »

  1.   

    那要看懂EXTJS的源代码才行啊!
    如果用js做的话,应该是这样,
    <html>
    <head>
    <script>
    function dd(){
    var v=document.createElement("div");
    v.id="tf";
    v.style.width="100px";
    v.style.height="20px";
    v.style.border="1px solid red";
    v.style.zIndex=1000;
    v.style.overflow="hidden";
    v.style.position="relative";
    v.innerText="caaaddddddddddddddddddddddddddddddddddddd";
    v.value=v.innerText;
    document.body.appendChild(v);
    if(v.scrollWidth>v.offsetWidth)
    {
      var vv=document.createElement("div");
    vv.style.width="20px";
    vv.style.height="20px";
    vv.style.position="absolute";
    vv.style.zIndex=2000;
    vv.style.right=0;
    vv.style.top=0;
    vv.style.border="1px solid blue";
    vv.innerText="...";
    vv.style.backgroundColor="#e8ddff";
    vv.style.cursor="hand";
    vv.onclick=function(){
    alert(document.getElementById("tf").value);
    };
      v.appendChild(vv)
    }
    }
    </script>
    </head>
    <body onload="dd();">
    </body>
    </html>
      

  2.   

    Extjs 有个triggerField控件,是textField的子类,combo的父类,你在onTriggerClick方法中弹出内容就可以了,至于内容没超出的,你找一下afterRender事件,在这个事件里面,你把按钮隐藏就可以了,this.trigger.hide();应该很简单的。连扩展都不需要做!