제출하지 않고 표 형식 승인

Question

APEX 3.2에서 JavaScript 유효성 검사를 실행하여 입력 된 데이터를 확인하고 표 형식의 각 행 위에 적절한 메시지를 표시 할 수 있기를 원합니다.

표 형식이고 사용자가 행을 추가/삭제할 수 있다는 점을 감안할 때 이것이 어떻게 작동할지는 모르겠습니다.

아이디어 나 제안을 감사하십시오.

감사합니다.

Answer 1

표 형식의 일부 자바 스크립트 유효성 검사를 수행하는 것은 약간 복잡하므로 수행중인 작업을 알아야합니다.

먼저, 확인하려는 요소의 ID 또는 이름을 알아야합니다. 아시겠지만 표 형식의 요소는 제출시 정점에 배열로 저장되며 apex_application.g_f01/g_f02/... 을 통해 액세스합니다. 이는 HTML 코드에 반영되며 생성 된 요소의 특성 'name'은 해당 요소에 속한 열로 설정됩니다 . id는 컬럼과 rowindex를 가지고있다. 경고하지만,이 id는 항목이 '암시 적으로'생성 될 때만 생성됩니다. 즉, apex_item 호출 (apex_item.textbox(...))을 사용하여 쿼리를 작성하지 않았습니다.

다른 점은 상태가 저장된 필드에만 배열 열이 정의된다는 것입니다. '표시 전용'으로 만 표시되는 항목은 입력 태그로 생성되지 않으며 td 태그의 텍스트로 유지됩니다.

모두 알다시피, 다음 단계는 간단해야합니다. 페이지 소스를 살펴보고 타겟팅 할 요소를 적어 두십시오. 예를 들어, 나는 직업 분야에 갔다.

<tr class="highlight-row"> 
<td headers="CHECK$01" class="data"><label for="f01_0003" class="hideMeButHearMe">Select Row</label><input type="checkbox" name="f01" value="3" class="row-selector" id="f01_0003" /></td> 
<td headers="EMPNO_DISPLAY" class="data">7782</td> 
<td headers="ENAME" class="data"><label for="f03_0003" class="hideMeButHearMe">Ename</label><input type="text" name="f03" size="12" maxlength="2000" value="CLARK" id="f03_0003" /></td> 
<td headers="JOB" class="data"><label for="f04_0003" class="hideMeButHearMe">Job</label><input type="text" name="f04" size="12" maxlength="2000" value="MANAGER" id="f04_0003" /></td> 
<td headers="HIREDATE" class="data"><label for="f05_0003" class="hideMeButHearMe">Hiredate</label><span style="white-space: nowrap;"><input type="text" id="f05_0003" name="f05" maxlength="2000" size="12" value="09-JUN-81" autocomplete="off"></span></td> 
<td headers="SAL" class="data"> 
    <label for="f06_0003" class="hideMeButHearMe">Sal</label><input type="text" name="f06" size="16" maxlength="2000" value="2450" id="f06_0003" /> 
    <input type="hidden" name="f02" value="7782" id="f02_0003" /> 
    <input type="hidden" id="fcs_0003" name="fcs" value="19BD045E01D6BA148B4DEF9DDC8B21B7"> 
    <input type="hidden" id="frowid_0003" name="frowid" value="AAuDjIABFAAAACTAAC" /> 
    <input type="hidden" id="fcud_0003" name="fcud" value="U" /> 
</td> 
</tr> 

페이지의 javascript 섹션에 다음 2 가지 기능을 추가했습니다.

validate_job은 elJob 요소 하나의 유효성 검사 만 수행합니다. 내가 사용한 유효성 검사는 단지 아주 기본적인 것입니다. 얼마나 복잡한지를 결정하는 것은 당신에게 달린 것입니다.

여기에서 같은 행의 다른 필드를 참조하려는 경우 몇 가지 작업을 수행 할 수 있습니다. ID가있는 경우 rowindex를 추출하십시오. 그것을 보유하지 않으면 부모 TR을 얻고 .children("input[name='f##'")을 사용하여 같은 행에 입력 요소를 가져옵니다. 또는 상태를 전혀 저장하지 않는 항목의 값이 필요한 경우 TR 요소를 가져온 다음 열 이름을 보유하는 headers 특성을 통해 필요한 요소가 들어있는 TD를 찾아야합니다.

function validate_job(elJob){ 
    var sJob = $v(elJob).toUpperCase(); 
    $(elJob).val(sJob); 

    //do your validations for the field job here 
    if(sJob=="MANAGER"){ 
     $(elJob).css({"border-color":"red"}); 
     alert("invalid value!"); 
     //depends what you want to do now: 
     //keep the focus on this element? Set a flag an error occured? Store the error?  
     return false; 
    } else { 
     $(elJob).css({"border-color":""}); 
     alert("value ok");     
     }; 
}; 

bind_validations onload를 호출하십시오. 행을 만들도록 허용하는 경우 클릭 이벤트를 addrow 버튼에 바인딩하고 bind_validations를 호출합니다.

function bind_validations(){ 
    //f01 : row selector 
    //f03 : ename 
    //f04 : job 
    //f05 : hiredate 
    //f06 : sal 

    //each input element with attribute name with value f04 
    //blur event is when the user leaves the field, fe tab out, or even click apply changes 
    //much like how when-validate-item behaved in forms 
    $("input[name='f04']").blur(function(){validate_job(this);}); 
}; 

다만 적절한 경고입니다. 지금까지 일부 앱에서 자바 스크립트 유효성 검사를 사용했지만, 소수의 사람들 만 사용할뿐 아니라 내부적으로 만 사용하게 될 것이라는 것을 알고있었습니다. 몇 가지 유효성 검사가있는 것은 하나의 필드였습니다. 유효성 검사가 실패했을 때 커서를 필드에 다시 집중 시켰으므로 다음 레코드로 건너 뛰고 변경할 수 없었습니다. 유효한 값이 지정되었거나 페이지를 다시로드했거나 조치를 취소했습니다. 이와 같이 설정하면 흐림 이벤트도 발생하여 필드의 유효성을 검사하므로 변경 사항 적용을 적용 할 수 없습니다.

잠재 고객이 더 커지면 iffy가 조금 더 많아집니다. 자바 스크립트가 사용 중지 된 이유는 무엇인가요?그들이 어떤 방법을 찾으면 어떡하지? 위즈 키드?

나는 여전히 즉각적인 피드백을 좋아하지만,보다 중요한 환경에서는 서버 측 유효성 검사도 사용합니다. 이렇게하려면 "함수는 오류 텍스트를 반환하는"형식의 유효성 검사가 필요합니다. 예를 들어 this page을 확인하거나 몇 가지 유용한 팁을 보려면 this one을 확인하십시오 (최소한 4.0 이상!). 또한 : apex 4.1은 표 형식의 검증에 많은 도움을줍니다! ;)