Javascriptは2つのコントロールを検証しますが、1つのコントロールのみが有効な場合は値を保持しません。

1つのonclickから2つのコントロールを検証しています。どちらのコントロールも必須です。Javascriptは2つのコントロールを検証しますが、1つのコントロールのみが有効な場合は値を保持しません。

OnclickはvalidateLocation関数を呼び出し、validateLocation関数が有効な場合はvalidateForm関数を呼び出します。

私の問題：

ユーザーが状態を選択してクリックすると提出した場合は、Javascriptが完璧、期待通りに動作します。

しかし

ユーザーがセミナーの場所が、無の状態を選択した場合は、Javascriptを起動しますが、すでに場所のために作られた選択がクリアされます。選択したままにするにはその選択が必要なので、ユーザーはクリックを繰り返す必要はありません。

私の質問：唯一の2つの条件のいずれかが満たされた場合

がどのように値を保持するには？以下

コード：

<!DOCTYPE HTML> 
<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"> 
<title>Untitled Document</title> 

<script type ="text/javascript" language="javascript"> 
<!-- 
function validateLocation() { 
var radios = document.getElementsByName('RadioGroup1') 

for (var i = 0; i < radios.length; i++) { 
    if (radios[i].checked) { 
    validateForm(); 
    return true; 
    } 
}; 
// not checked, show error 
document.getElementById('ValidationError').innerHTML = 'Required'; 
alert("Please select a seminar location"); 
return false; 
} 
function validateForm() { 
if(document.form1.State.selectedIndex==0) 
{ 
alert("Please select a State"); 
document.form1.State.focus(); 
return false; 
} 
return true; 
}; 
--> 
</script> 
</head> 

<body> 
<div> 
<form name="form1" onSubmit="return validateLocation();"> 
<div> 
<table border="0" cellspacing="0" cellpadding="0"> 
<tr> 
<td style="text-align:right">state:&nbsp;</td> 
<td>  
    <select name="State" id="State"> 
     <option value="">Select</option> 
     <option value="AK">AK</option> 
     <option value="AL">AL</option> 
     <option value="AR">AR</option> 
    </select> 
</td> 
</tr> 
</table> 
</div> 
<div> 
<table border="0" cellspacing="0" cellpadding="0"> 
<tr> 
    <td colspan="2"><strong>Choose a seminar location</strong></td> 
</tr> 
<tr> 
    <td valign="top"> 
     <input type="radio" name="RadioGroup1" value="Fayetteville Senior Center" id="RadioGroup1_0"> 
     </td> 
    <td><strong>Location One</strong></td> 
</tr> 
<tr> 
    <td valign="top"> 
     <input type="radio" name="RadioGroup1" value="Springdale Holiday Inn" id="RadioGroup1_1"> 
     </td> 
    <td><strong>Location Two</strong></td> 
</tr> 
<tr> 
    <td valign="top"> 
     <input type="radio" name="RadioGroup1" value="The Riordan Hall" id="RadioGroup1_2"> 
     </td> 
    <td><strong>Location Three</strong></td> 
</tr> 
</table> 
<div id="ValidationError" name="ValidationError"></div> 
</div> 
<div> 
<input type="submit" name="button" id="button" value="Submit"> 
</div> 
</form> 
</div> 
</body> 
</html>

出典

2012-03-19 mduschak

は、私は少しそれがより論理的な取得するには、スクリプトを変更した：

<script type ="text/javascript" language="javascript"> 
function validateLocation() { 
    var radios = document.getElementsByName('RadioGroup1') 

    for (var i = 0; i < radios.length; i++) { 
     if (radios[i].checked) { 
     return true; 
     } 
    }; 

    // not checked, show error 
    document.getElementById('ValidationError').innerHTML = 'Required'; 
    alert("Please select a seminar location"); 
    return false; 
} 

function validateState() { 
    if(document.form1.State.selectedIndex==0) 
    { 
    alert("Please select a State"); 
    document.form1.State.focus(); 
    return false; 
    } 
    return true; 
} 

function validateForm() { 
    if (!validateState() || !validateLocation()) return false; 
    return true; 
}; 
</script>

あなただけに、同様formタグでのonSubmitハンドラを変更する必要が

：

...onSubmit="return validateForm();"...

次に、両方の検証が成功するまで、フォームは検証され、送信されません。

、

歓声、ダニエル

私が探していたまさに

出典

2012-03-19 20:19:38 Daxcode

に役立ちます願っています。あなたの助けをありがとう！ – mduschak

Javascriptは2つのコントロールを検証しますが、1つのコントロールのみが有効な場合は値を保持しません。

答えて

関連する問題