ซ่อนข้อความอินพุตเมื่อสูญเสียโฟกัสด้วย p:inplace

แบบฟอร์มของฉันดูเหมือนว่า:

        <p:inplace>  
            <h:inputText id="description" value="#{cc.attrs.description}" /> 
        </p:inplace> 

เมื่อผู้ใช้คลิกเข้าไปในข้อความของ p:inplace inputText จะปรากฏขึ้นเพื่อแก้ไขค่า

ฉันจะซ่อน inputText หรือ p:inplace ได้อย่างไรเมื่อผู้ใช้คลิกที่อื่นหรือการควบคุมตัวเองเสียโฟกัส

ขอบคุณ.


person Briefkasten    schedule 05.10.2013    source แหล่งที่มา


คำตอบ (1)


ใช้เหตุการณ์ blur บน inputText โดยส่งค่ารหัสไปให้:

<p:inplace widgetVar="basic_#{cc.id}">
    <p:inputText value="#{cc.attrs.description}" id="description">
        <p:ajax event="blur" oncomplete="basic_#{cc.id}.hide();" />
    </p:inputText>
</p:inplace>
person Xtreme Biker    schedule 05.10.2013
comment
คำตอบนี้จะดีกว่าหากคำนึงถึงข้อเท็จจริงที่ว่านี่เป็นส่วนหนึ่งขององค์ประกอบคอมโพสิตและสามารถรวมได้หลายครั้งในมุมมองเดียวกัน และอาจทำให้เกิดการชนกันในชื่อ widgetVar วิธีแก้ไขคือ: รวมบางสิ่งที่ไม่ซ้ำกัน เช่น #{cc.id} หรือมากกว่านั้นในชื่อวิดเจ็ต var เช่นนั้น widgetVar="basic_#{cc.id}" และอ้างอิงเช่นนั้น oncomplete="basic_#{cc.id}.hide()" - person BalusC; 06.10.2013
comment
@BalusC จริงนะ! ฉันไม่เห็นว่ามันเป็นคอมโพสิต ... อัปเดต ;-) - person Xtreme Biker; 07.10.2013