PHP，Javascript，select and alert

Question

你好，我是Javascript新手，目前正在嘗試更新另一個開發人員代碼。對於複選框和文本字段的混合，我有一個非常簡單的問題。

我的第一個Javascript工作原理是：它表示如果在postsitesurvey中沒有輸入任何信息，則提示必須填寫。下一步我堅持下去。該員工有2個可見選項，1個隱藏。剩下的部分？我希望如果他檢查是的話，那麼必須填寫下一個帶有領域的字段，如果不是，那麼他可以繼續並提交表格。任何幫助，將不勝感激。

echo "<form id=\"myForm\" name=\"myForm\" method=\"post\" action=\"edit.php? 
action=upbill2\" onsubmit=\"return validateForm()\">"; 
echo "<table width=\"100%\" border=\"0\" cellspacing=\"5\" cellpadding=\"0\" 
class=\"table2\">"; 

echo "<div class=\"col-sm-6\">"; 
echo "<b>Post Site Survey</b>"; 
Echo "&nbsp&nbsp&nbsp"; 
echo "<textarea style=\"width:70%\" name=\"postsitesurvey\" 
id=\"postsitesurvey\" value=\"$postsitesurvey\" />"; 
echo $postsitesurvey; 
echo "</textarea>"; 
echo "</div>"; 

echo "<div class=\"col-sm-6\">"; 

echo "<b>Was There Equipment Left Over?</b>"; 
Echo "&nbsp&nbsp&nbsp"; 
echo "<input name=\"eq_left\" type=\"checkbox\" id=\"eq_left_yes\" 
value=\"1\""; 
if ($eq_left == "1") { echo " checked=\"checked\" "; } 
echo "/> &nbsp&nbsp&nbspYes "; 

Echo "&nbsp&nbsp&nbsp"; 

echo "<input name=\"eq_left\" type=\"checkbox\" id=\"eq_left_no\" 
value=\"2\""; 
if ($eq_left == "2") { echo " checked=\"checked\" "; } 
echo "/> &nbsp&nbsp&nbspNo "; 
echo "</div>"; 

echo "<input name=\"eq_left\" type=\"checkbox\" id=\"eq_left_empty\" 
value=\"\" style=\"display:none;\" checked"; 
if ($eq_left == "") { echo " checked=\"checked\" "; } 
echo "</div>"; 

echo "<div class=\"col-sm-6\">"; 
echo "<b>Left with?</b>"; 
Echo "&nbsp&nbsp&nbsp"; 

echo "<input style=\"width:45%\" name=\"eq_poc_\" type=\"text\" 
id=\"eq_poc\" value=\"$eq_poc\" placeholder=\"Name of customer\""; 

echo "</div>"; 
echo "&nbsp&nbsp&nbsp or"; 
Echo "&nbsp&nbsp&nbsp"; 
echo "<input name=\"eq_poc\" type=\"checkbox\" id=\"chkNo\" value=\"MCS\""; 
if ($eq_poc == "MCS") { echo " checked=\"checked\" "; } 
echo "/> &nbsp&nbsp&nbspMCS"; 

echo "</div>"; 

echo "<br>"; 

echo "<div class=\"col-sm-12 text-center\">"; 
echo "<input name=\"st_id\" type=\"hidden\" id=\"st_id\" value=\"3\" />"; 
echo "<input name=\"job_id\" type=\"hidden\" id=\"job_id\" value=\"$job_id\" />"; 
echo "<input type=\"submit\" name=\"Submit\" value=\"Submit\" class=\"btn btn-primary\"/>"; 
echo "</div>"; 
echo "</table>"; 
echo "</form>"; 
} 

---- ---- JAVASCRIPT

function validateForm() { 
var x = document.forms["myForm"]["postsitesurvey"].value; 
if (x == "") { 
    alert("Post site survey must be filled out"); 
    return false; 
} 

Answer 1

我刪除了分心的東西，你可以copypaste你的問題，然後我會刪除這個帖子...

<?php 
    $checked_1 = ($eq_left == "1") ? 'checked="checked"' : ''; 
    $checked_2 = ($eq_left == "2") ? 'checked="checked"' : ''; 
    $checked_3 = ($eq_left == "") ? 'checked="checked"' : ''; 
    $checked_4 = ($eq_poc == "MCS") ? 'checked="checked"' : ''; 
?> 


<form id="myForm" name="myForm" method="post" action="edit.php?action=upbill2" onsubmit="return validateForm()"> 

    <b>Post Site Survey</b> 
    <textarea name="postsitesurvey" id="postsitesurvey" value="$postsitesurvey" /> 
     <?=$postsitesurvey?> 
    </textarea> 

    <b>Was There Equipment Left Over?</b> 
    <input name="eq_left" type="checkbox" id="eq_left_yes" value="1" <?=$checked_1?>/> 
    <input name="eq_left" type="checkbox" id="eq_left_no" value="2" <?=$checked_2?>/> 
    <input name="eq_left" type="checkbox" id="eq_left_empty" value="" style="display:none;" <?=$checked_3?>/> 

    <b>Left with?</b> 
    <input name="eq_poc_" type="text" id="eq_poc" value="$eq_poc" placeholder="Name of customer"/> 
    <b>or</b> 
    <input name="eq_poc" type="checkbox" id="chkNo" value="MCS" <?=$checked_4?>/><b>MCS</b> 

    <input name="st_id" type="hidden" id="st_id" value="3" /> 
    <input name="job_id" type="hidden" id="job_id" value="<?=$job_id?>" /> 
    <input type="submit" name="Submit" value="Submit" class="btn btn-primary"/> 
</form> 

Answer 2

我覺得像這樣的東西會爲你工作。我將您的複選框更改爲單選按鈕，並刪除了eq_left = ""。您還有兩個名爲「eq_poc」的字段。你不可以做這個。我刪除了一個，但你可能想考慮一個不同的選項或解釋你想要做的更好一點。

我還添加了toggleHide()函數來顯示或隱藏客戶名稱字段。

警報消息可能很煩人，所以我刪除了它們，並添加了一個<div>以將錯誤消息以紅色顯示在頁面上。

另一件需要注意的是，我添加了required屬性到你的textarea。這允許瀏覽器通知用戶他們沒有填寫必填字段。然而，這樣做，不會在頁面上顯示紅色的錯誤信息。所以，根據你想實現它的方式，你可能想刪除必需的屬性。

下面的代碼將自行工作，一旦您滿意，請刪除頂部用於測試的兩行，並查看它是否適用於從其他代碼傳遞的變量。

<?php 

     //The two lines below are for testing purposes only. Once you are done testing, you can remove them to implement it with the rest of your code. 
     $eq_left = "1"; 
     $eq_poc = ""; 

    $checked_yes = ($eq_left == "1") ? 'checked="checked"' : ''; 
    $checked_no = ($eq_left == "2") ? 'checked="checked"' : ''; 
?> 
<html> 
<script> 

function toggleHide() { 
     var equipment_left = document.getElementById('eq_left_yes').checked; 

     if (equipment_left){ 
      document.getElementById('leftwith').style.display = 'block'; 
     } 
     else { 
      document.getElementById('leftwith').style.display = 'none'; 
     } 

} 

function validateForm() { 
     var message = ""; 
     var postsitesurvey = document.getElementById('postsitesurvey').value; 
     if (postsitesurvey == "") { 
      message = "Post site survey must be filled out"; 
     } 
     else if (equipment_left && eq_poc == ""){ 
      var equipment_left = document.getElementById('eq_left_yes').checked; 
      var eq_poc = document.getElementById('eq_poc').value; 
      message = "Customer name must be filled in"; 
     } 

     if (message != ""){ 
      document.getElementById('message').textContent = message; 
      return false; 
     } 


     return true; 
} 
</script> 
<style> 
.formfield { 
     font-weight: bold; 
} 
#leftwith { 
     display: none; 
} 
#message { 
     color: red; 
} 
</style> 
</body> 
<form id="myForm" name="myForm" method="post" action="edit.php?action=upbill2" onsubmit="return validateForm()"> 

<div class="formfield">Post Site Survey</div> 
<textarea name="postsitesurvey" id="postsitesurvey" value="$postsitesurvey" required="required" /><?php echo $postsitesurvey ?></textarea> 

<div class="formfield">Was There Equipment Left Over? 
     <input name="eq_left" type="radio" id="eq_left_yes" value="1" onclick="toggleHide()" <?php echo $checked_yes ?> /> Yes 
     <input name="eq_left" type="radio" id="eq_left_no" value="2" onclick="toggleHide()" <?php echo $checked_no ?> /> No 
</div> 

<div class="formfield" id="leftwith"> 
Left with? 
<input name="eq_poc_" type="text" id="eq_poc" value="<?php echo $eq_poc ?>" placeholder="Name of customer"/> 
</div> 
<input name="st_id" type="hidden" id="st_id" value="3" /> 
<input name="job_id" type="hidden" id="job_id" value="<?php echo $job_id ?>" /> 
<div id="message"></div> 
<input type="submit" name="Submit" value="Submit" class="btn btn-primary"/> 
</form> 
<script> 
     toggleHide(); 
</script> 
</body> 
</html>