2013-10-22 2 views
-2

동적 이름으로 PHP를 사용하여 동적으로 생성 된 5 개의 텍스트 필드를 추가합니다 .how javascript.here를 사용하여 해당 필드의 유효성을 검사 할 수 있지만 작은 샘플 코드는 있지만 실제 코드는 다릅니다. 내가 다음과 같은 코드를 사용하여 그러한 유효성 검사를 수행하도록 도와주세요. 도와주세요 ....자바 스크립트를 사용하여 동적으로 생성 된 텍스트 필드의 유효성을 검사하는 방법

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<script> 
function validate() 
{ 
//help me to write validation code here. 
} 
</script> 
</head> 
<body> 
<form method="post" action="##" name="test" onsubmit="return validate()"> 
<?php 
$i=0; 
while($i<5) 
{ 
echo "<input type='text' name='count$i'>" 
$i++; 
} 
echo "<input type='submit' value='ok'>"; 
?> 
</form> 
</body> 
</html> 
+0

시도해 보셨습니까? –

+0

모든 입력의 유효성을 검사하거나 유효성을 검사하려는 모든 입력에 클래스를 추가하고 유효성을 검사하면됩니다. – Timmetje

+2

어떤 브라우저를 지원할 예정입니까? 그리고 의도적으로 jquery를 사용하지 않습니까? –

답변

0

요소를 클래스에 추가하십시오. 요소에 클래스를 추가하는 목표는 동적으로 추가 한 요소 만 잡아 유효성 검사의 유형을 설명하면 내가 확실하게 대답을 편집합니다 JS

에서
<script> 
function validate() 
{ 
    var elems = document.getElementsByClassName('validate-it'); 
    for(var i=0; i<elems.length; i++) { 
     // Validate here 
     // Code here depends on the type of validation you wants 
    } 
} 
</script> 

while($i<5) 
{ 
    echo "<input class='validate-it' type='text' name='count$i'>" 
    $i++; 
} 

를 유효성을 검사 할 것입니다 당신은 수행하기를 원합니다. 호프가 도움이 되었기를 바랍니다 ...

0

IMHO는 스크립트의 페이지 요소에 기능상 목표를 부여하기보다는 CSS 서식 지정을위한 요소를 표시하는 것이 더 적합합니다.

ID를 할당하는 것이 좋습니다. getElementById 함수를 사용하여 javascript를 선택하고 요소를 탐색 한 다음 유효성 검사 함수 인 validateField()를 실행하십시오. 대략 또한이

function validateField(fieldToValidate) { 
    //Here you can perform your validation against fieldToValidate.value (for text inputs) 
} 


var frm = document.getElementById("myForm"); 
for (var i=0; frm.elements[i]; i++) 
{//Cycle through all input tags, of text type, inside the form 
    if (
     frm.elements[i].tagName=="INPUT" 
     && 
     frm.elements[i].getAttribute("type")=="text") 
     ) 
    { 
     validateField(frm.elements[i]); 
    } 
} 

같은 것을, 당신은 동적으로 생성 된 요소의 이름은 (X 숫자 인 상태 countX을) 당신의 예에서와 같이, 주어진 이름 지정 규칙을 따르는 것이 알고 당신은 단지 동적 유효성을 검사 할 경우 - 생성 된 입력 필드, 텍스트 입력 필드 인 경우에만 확인할 수 있습니다. 필드에 이름 대신 특정 ID를 지정하여 동일한 이름을 사용하지 말아야하며 사용자가해서는 안되는 것의 유효성을 확인하는 것이 좋습니다.

PHP 측

<form method="post" action="##" id="myForm" name="test" onsubmit="return validate()"> 
<?php 
$i=0; 
while($i<5) 
{ 
echo "<input type='text' id='txtField$i'>" 
$i++; 
} 
?> 

JS 측

function validateField(fieldToValidate) { 
    //Here you can perform your validation against fieldToValidate.value (for text inputs) 
} 


var frm = document.getElementById("myForm"); 
var currentField; 
for (var i=0; currentField = document.getElementById("txtField"+i); i++) 
{//Cycle through all txtField* starting IDs elements 
    validateField(currentField); 
} 
0

당신은 (특별한 내용과 범위? 문자열? 등의 수) 상세한 검증 유형의 이름을하지 않았다, 그래서 이것은 일반적이다 유효성 검사 중 스켈레톤 :

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>test</title> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"/> 
    <script type="text/javascript"> 
     function validate() 
     { 
      var allInputsOk = true; 
      var inputs = document.getElementsByTagName("input"); 
      for (var inpx in inputs) { 
       if (inpx.substring(0, 5) == "count") { 
        // it's one of the inputs named "count..." 
        var inpIdx = inpx.substr(5); 
        var inpObj = document.getElementsByName(inpx)[0]; 
        var inpVal = inpObj.value; 
        allInputsOk &= validateSingleInput(inpIdx, inpVal); 
        if(!allInputsOk) break; 
       } 
      } 
      return allInputsOk; 
     } 
     /* 
     * Tests the value of the input named "countX" 
     * @return true if "value" is valid for input "count<index>", false else 
     */ 
     function validateSingleInput(index, value) { 
      var inputValueNumber = Number(value); // in case to test for numeric inputs 
      var inputValueString = String(value); // in case to test for string inputs 
      // your validation test here ... return true or false 
      return true; // dummy 
     } 
    </script> 
</head> 
<body> 
    <form method="post" action="#" name="test" onsubmit="return validate()"> 
     <?php 
     $i=0; 
     while($i<5) 
     { 
     echo "<input type='text' name='count$i'>"; 
     $i++; 
     } 
     echo "<input type='submit' value='ok'>"; 
     ?> 
    </form> 
</body> 
</html> 
관련 문제