HTML-PHP, кнопка браузера и точная история страницы

Я разрабатываю веб-сайт с использованием HTML и PHP. На моей странице HTML у меня есть форма с полями, отмеченными как «ТРЕБУЕМЫЕ». Поскольку эти поля необходимы, я устанавливаю кнопку отправки формы для отключения до тех пор, пока все необходимые поля не будут заполнены. После того, как все заполнено, кнопка включена. Поведение кнопки, которая зависит от полей, отлично работает. Однако, когда пользователь отправляет форму и затем нажимает кнопку «назад» в браузере (пытается вернуться к форме), кнопка отключена, но заполняются все необходимые поля. Таким образом, он не возвращается к точной истории страницы. Это также раздражает пользователя.HTML-PHP, кнопка браузера и точная история страницы

Как я могу решить эту проблему? Ниже приведена часть моей HTML-страницы.

<!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 checkChange() 
{ 
    var title_txt = document.getElementById('title_textarea').value.replace(/^\s+|\s+$/g,""); 
    var system_and_device_txt= document.getElementById('system_and_device_textarea').value.replace(/^\s+|\s+$/g,""); 
    var finding_txt = document.getElementById('finding_textarea').value.replace(/^\s+|\s+$/g,""); 
    var implication_txt = document.getElementById('implication_textarea').value.replace(/^\s+|\s+$/g,""); 
    var recommendation_txt = document.getElementById('recommendation_textarea').value.replace(/^\s+|\s+$/g,""); 

    if(document.getElementById('service_name_select').selectedIndex != '0' && 
     document.getElementById('risk_rating_select').selectedIndex != '0' && 
     document.getElementById('root_cause_select').selectedIndex != '0' && 
     document.getElementById('impact_select').selectedIndex != '0' && 
     document.getElementById('likelihood_select').selectedIndex != '0' && 
     document.getElementById('efforts_select').selectedIndex != '0' && 
     document.getElementById('client_name_select').selectedIndex != '0' && 
     document.getElementById('project_name_select').selectedIndex != '0' && 
     title_txt != "" && 
     system_and_device_txt!="" && 
     finding_txt != "" && 
     implication_txt != "" && 
     recommendation_txt != ""   
    ) 
     document.getElementById('save_button').disabled = false; 


    else 
     document.getElementById('save_button').disabled = true; 


} 


</style> 
</head> 



<body> 
<div class="page-out"> 
<div class="page-in"> 
<div class="page"> 
<div class="main"> 
<div class="header"> 


</div> 
<div class="content"> 
<div class="content-left"> 
<div class="row1"> 


<?php 

include "AccountHolder.php"; 
$database_manager = new DatabaseManager(); 
$database_manager ->connect(); 
$db_link = $database_manager ->get_connection(); 

?> 


<form method="post" action= "save_record_page.php" > 
<fieldset style='padding:15px'> 
<legend>Insert New Data </legend> 
<p> <font color='red'> * </font> Service Name : 
<select name="service_name" id= "service_name_select" onchange="checkChange()"> 
<option value=""> -Select- </option> 

<?php 

$result = $db_link->query("SELECT * FROM servicetype_lookup "); 

while($row= $result->fetch_row()) { 
$id = $row[0]; 
$value = $row[1]; 
echo "<option value='$id'>$value</option>"; 
} 
?> 
</select> 
</p> 

<br/> 

<font color='red'>*</font> 
Title : <input type="text" name="title" id="title_textarea" oninput="checkChange()"/> 
<br/> 
<br/> 
<font color='red'>*</font> 
Risk Rating : 
<select name="risk_rating" id= "risk_rating_select" onchange="checkChange()" > 
<option value=""> -Select- </option> 
<?php 

$result = $db_link->query("SELECT * FROM riskrating_lookup "); 

while($row= $result->fetch_row()) { 
$id = $row[0]; 
$value = $row[1]; 
echo "<option value='$id'>$value</option>"; 
} 
?> 


</select> 
<br /> 
<br/> 

<font color='red'>*</font> 
Root Cause : 
<select name="root_cause" id= "root_cause_select" onchange="checkChange()"> 
<option value=""> -Select- </option> 

<?php 

$result = $db_link->query("SELECT * FROM rootcause_lookup "); 

while($row= $result->fetch_row()) { 
$id = $row[0]; 
$value = $row[1]; 
echo "<option value='$id'>$value</option>"; 
} 
?> 

</select> 
<br/> 
<br/> 


<font color='red'>*</font> 
Impact : 
<select name="impact" id= "impact_select" onchange="checkChange()"> 
<option value=""> -Select- </option> 

<?php 

$result = $db_link->query("SELECT * FROM impact_lookup "); 

while($row= $result->fetch_row()) { 
$id = $row[0]; 
$value = $row[1]; 
echo "<option value='$id'>$value</option>"; 
} 
?> 

</select> 
<br /> 
<br/> 

<font color='red'>*</font> 
Likelihood : 
<select name="likelihood" id= "likelihood_select" onchange="checkChange()"> 
<option value=""> -Select- </option> 

<?php 

$result = $db_link->query("SELECT * FROM likelihood_lookup "); 

while($row= $result->fetch_row()) { 
$id = $row[0]; 
$value = $row[1]; 
echo "<option value='$id'>$value</option>"; 
} 
?> 


</select><br/><br/> 

<font color='red'>*</font> 
Efforts : 
<select name="efforts" id= "efforts_select" onchange="checkChange()"> 
<option value=""> -Select- </option> 



<?php 

$result = $db_link->query("SELECT * FROM efforts_lookup "); 

while($row= $result->fetch_row()) { 
$id = $row[0]; 
$value = $row[1]; 
echo "<option value='$id'>$value</option>"; 
} 
?> 
</select> 
<br/> 
<br/> 

<p> <font color='red'> * </font> Client Name: 
<select name="client_name" id= "client_name_select" onchange="checkChange()"> 
<option value=""> -Select- </option> 

<?php 

$result = $db_link->query("SELECT * FROM Clients_Lookup"); 

while($row= $result->fetch_row()) { 
$id = $row[0]; 
$value = $row[1]; 
echo "<option value='$id'>$value</option>"; 
} 
?> 
</select> 
</p> 
<br/> 



<p> <font color='red'> * </font> Project Name: 
<select name="project_name" id= "project_name_select" onchange="checkChange()"> 
<option value=""> -Select- </option> 

<?php 

$result = $db_link->query("SELECT * FROM clients_projects_lookup"); 

while($row= $result->fetch_row()) { 
$id = $row[1]; 
$value = $row[2]; 
echo "<option value='$id'>$value</option>"; 
} 
?> 
</select> 
</p> 

<br/> 


<font color='red'>*</font> 
System/Device : <input type="text" name="system_and_device" id="system_and_device_textarea" oninput="checkChange()"/><br /> 


<br/> 
<font color='red'>*</font> 
Finding : <br/> 
<textarea name="finding" cols="100" rows="10" id="finding_textarea" oninput="checkChange()"></textarea> 
<br/> 
<br/> 
<font color='red'>*</font> 
Implication: <br/> 
<textarea name="implication" cols="100" rows="10" id="implication_textarea" oninput="checkChange()"></textarea> 
<br/> 
<br/> 
<font color='red'>*</font> 
Recommendation : <br/> 
<textarea name="recommendation" cols="100" rows="10" id="recommendation_textarea" oninput="checkChange()"></textarea> 
<br/> 
<br/> 
<input type="button" value="Back" onclick="history.go(-1);return true" /> 
<input type="submit" value=" Save " disabled="true" id= "save_button" /> 
<br/> 
<br/> 

<p> NOTE: <font color='red'> * </font>indicates a required field</p> 

</fieldset> 
</form> 
</div>

Edit: Мой вопрос также включает в себя функции JavaScript, которые могут взять переменную PHP в качестве параметра для того, чтобы принять решение включить или отключить кнопку.

источник

2013-06-26 Traveling Salesman

Кажется, браузер "особенность" (да, это особенность, а не ошибка ... Вздох). см. http://stackoverflow.com/questions/4594489/pressing-back-prefills-inputs-with-value-from-right-before-submit и http://stackoverflow.com/questions/6487970/disable-firefoxs-auto -fill –

<script> 
window.onload=function() { 
    var someparm = <?php echo $size; ?>; // assuming a number, if not use quotes 
    checkChange(someparm); 
} 

function checkChange(parm) { 
    document.getElementById('save_button').disabled = (parm==0) ? true : document.getElementById('service_name_select').selectedIndex < 1 || 
    document.getElementById('risk_rating_select').selectedIndex < 1 || 
    document.getElementById('root_cause_select').selectedIndex < 1 || 
    document.getElementById('impact_select').selectedIndex  < 1 || 
    document.getElementById('likelihood_select').selectedIndex < 1 || 
    document.getElementById('efforts_select').selectedIndex  < 1 || 
    document.getElementById('client_name_select').selectedIndex < 1 || 
    document.getElementById('project_name_select').selectedIndex < 1 || 
    title_txt    == "" || 
    system_and_device_txt == "" || 
    finding_txt   == "" || 
    implication_txt  == "" || 
    recommendation_txt == ""; 
} 
</script>

источник

2013-06-26 09:13:21 mplungjan

Что касается "с параметрами", вот что я пытаюсь сделать: < "(? ) submitController;" тело OnLoad => параметр является переменной PHP не JavaScript. Эта строка, которую я написал, не работает. –

Пожалуйста, ознакомьтесь с обновлением и, пожалуйста, не используйте загрузку тела, но используйте конструкцию, которую я предложил. Также вам нужен; после 'echo $ size;' – mplungjan

Отлично! Большое спасибо за полезность. Здесь я хотел бы добавить еще одну вещь: переменная someparm в вашем примере должна быть определена до написания windows.onload. Так мне удалось заставить его работать. –

Добавить onload to body or window.onload событие.

<body onload="checkChange();">

или

window.onload=function(){ 
    checkChange(); 
}

источник

2013-06-26 09:15:15 Puuskis

Как я уже писал. Не считается хорошей практикой встраивать обработчик событий – mplungjan

Спасибо. На другой странице мне нужно сделать то же самое, но функция принимает параметр. Могу ли я использовать тот же метод? –

@ TheTravellingSalesman Если я понимаю, что вы после, до тех пор, пока вы можете получить параметр откуда-то, почему бы и нет. – Puuskis

HTML-PHP, кнопка браузера и точная история страницы

ответ

Смежные вопросы