<input>
을 렌더링하는 자동 완성 JSF 사용자 정의 구성 요소를 작성했으며 텍스트를 입력하면 서버에 ajax 요청을 보냅니다. 결과는 으로 <select>
과 <option>
태그로 표시됩니다.jquery 모달 대화 상자 및 크롬 브라우저에서 동적 내용에 대한 변경 이벤트가 발생하지 않습니다.
내가 <custom:autocomplete id="findTeam"/>
이있는 경우 구성 요소는 다음과 같은 구조 를 렌더링 :
<span id="findTeam>
<input id="findTeam_input"/>
<select id="findTeam_listbox">
<option ...>
</select>
</span>
을 나는 항목이 가 목록에서 선택했을 때 알 수 있도록 <select>
에 대한 변경 이벤트를 바인딩 jQuery를 사용 . 이것은 일반적으로 작동하지만, 변경 이벤트는 크롬 브라우저 (v15.0.874.106 m)를 사용할 때 jquery UI 1.8.16 모달 대화 상자에서 구성 요소를 사용할 때 이 실행되지 않습니다. 대화 상자가 모달이 아니고 IE8의 경우 모달 대화 상자에서 제대로 작동하면 잘 작동합니다. 따라서 <select>
이 렌더링되고 내가 옵션 중 하나를 클릭하면 아무 일도 일어나지 않습니다 - 표시되어 있지만 아무 것도 선택할 수 없습니다.
js 콘솔에 오류가 표시되지 않고 다음에 무엇을 시도해야할지 잘 모르겠습니다. 여기 은 서버에서 아약스 응답의 샘플입니다) (대신 .bind의) (.live 사용하여 내가 해봤
<?xml version='1.0' encoding='UTF-8'?>
<partial-response>
<changes>
<update id="findTeam">
<![CDATA[
<script>
jQuery(function($){
com.corejsf.ajaxSetup("mojarra.ab('findTeam',event,'change',0,'addButton')");
$('#findTeam').hover(com.corejsf.compFocusSet,com.corejsf.compFocusClear);
});
</script>
<span id="findTeam">
<input id="findTeam_input" type="text" name="findTeam_input" autocomplete="off" value="tea" />
<script>
jQuery(function($){
$('#findTeam_input').bind('keydown','#findTeam_listbox',com.corejsf.inputKeydown);
$('#findTeam_input').bind('blur','#findTeam',com.corejsf.compBlur);
$('#findTeam_input').bind('keyup',{id:'#findTeam',minChars:3},com.corejsf.inputKeyup);
$('#findTeam_input').bind('mousedown','#findTeam',com.corejsf.inputClick);var cid='#findTeam_input';
$(cid).focus().focus().click();$(cid).val($(cid).val());
});
</script>
<select id="findTeam_listbox" name="findTeam_listbox" size="10" style="position: absolute">
<option value="cfdb36cd-ebfa-49b9-941e-2a74d7b82aef">Team 5</option>
<option value="a206fbbc-552d-4b7b-b2d3-dc1a50f98667">Team 6</option>
<option value="bc5f9f1d-ef76-452f-9101-bff703efbf38">Team 7</option>
<option value="2a43ff65-d170-45a7-9bf0-ec237d51603d">Team 8</option>
<option value="7112ca7d-75ea-4957-a830-7ef7b54e18f5">Team 9</option>
</select>
<script>
jQuery(function($){
$('#findTeam_listbox').position({my:'left top',at:'left bottom',of:$('#findTeam_input'),collision:'fit'});
$('#findTeam_listbox').dropShadow({left:4,top:4,blur:1});
$('#findTeam_listbox').bind('change',com.corejsf.listClick);
$('#findTeam_listbox').bind('blur','#findTeam',com.corejsf.compBlur);
});
</script>
</span>
]]>
</update>
<update id="javax.faces.ViewState">
<![CDATA[8331589387080754551:-7156357472895110486]]>
</update>
</changes>
</partial-response>
하지만, 도움이되지 않습니다이이 보안의 일부 종류의 수 크롬 규제? 어떤 제안을 주셔서 감사합니다.
나는 dialogopen 이벤트 처리기에서 다시 바인딩을 시도했지만 여전히 아무 일도 발생하지 않습니다. 나는 dialogopen 핸들러 (호출되는)와 listClick() 핸들러 (그렇지 않은) 모두에 경고를했습니다. 어떤 아이디어? 생각해 보면 대화 상자가 열려있을 때 findTeam_listbox가 존재하지 않습니다. 일부 텍스트가 입력에 입력되고 일부 결과가 서버에서 반환되는 경우에만 나타납니다. change 이벤트는 select 태그가 렌더링 된 후에 바인딩됩니다. 귀하의 회신에 감사드립니다. – Oversteer