html表單在表單提交後保持禁用狀態

在我的下面的代碼中。總共有8個文本框用div封裝，ID從fa1到fa8。html表單在表單提交後保持禁用狀態

FA1和FA2被設定使用添加\刪除按鈕（addfa和removefa）來添加和刪除其它的div以及還使用hidden輸入元件使用來跟蹤計數默認顯示
其value（默認值3）
添加按鈕獲取禁用一旦它顯示所有隱藏的div（即在countfa = 9），而remove布敦得到啓用一旦有3名或更多的文本框（即countfa值4個或更多）
FA3至FA8設置爲display:none和使用上述添加\刪除ID來顯示它們
我需要保持沿着數據文本框，其後形式提交輸入由用戶。

問題，我面對：我使用的是PHP代碼隱藏輸入元素來更新根據用戶的DIV ID選擇它的value depednds形式提交後。我看到，儘管表單提交後有3個或更多文本框，但刪除按鈕處於禁用狀態。我已檢查隱藏的輸入value是否正在使用新值進行更新，並且我看到它正在更新，但仍然將刪除按鈕處於禁用狀態。任何想法爲什麼它不顯示在啓用狀態。

我的html代碼：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html> 
<body> 
<form id="main" name="main" action="#text" method="post" > 

<div id="fa1"> 
<input class="textbox" id="tbox1" name="tbox1" type="text" value="<?php if(isset($_POST['tbox1'])) { echo htmlentities ($_POST['tbox1']); }?>" /></span> 
</div> 

<div id="fa2"> 
<input class="textbox" id="tbox2" name="tbox2" type="text" value="<?php if(isset($_POST['tbox2'])) { echo htmlentities ($_POST['tbox2']); }?>" /></span> 
</div> 

<div id="fa3" style="<?php if(empty($_POST['tbox3'])) { echo "display:none;"; } else { echo "display:block;"; } ?>"> 
<input class="textbox" id="tbox3" name="tbox3" type="text" value="<?php if(isset($_POST['tbox3'])) { echo htmlentities ($_POST['tbox3']); }?>" /></span> 
</div> 

<div id="fa4" style="<?php if(empty($_POST['tbox4'])) { echo "display:none;"; } else { echo "display:block;"; } ?>"> 
<input class="textbox" id="tbox4" name="tbox4" type="text" value="<?php if(isset($_POST['tbox4'])) { echo htmlentities ($_POST['tbox4']); }?>" /></span> 
</div> 

<div id="fa5" style="<?php if(empty($_POST['tbox5'])) { echo "display:none;"; } else { echo "display:block;"; } ?>"> 
<input class="textbox" id="tbox5" name="tbox5" type="text" value="<?php if(isset($_POST['tbox5'])) { echo htmlentities ($_POST['tbox5']); }?>" /></span> 
</div> 

<div id="fa6" style="<?php if(empty($_POST['tbox6'])) { echo "display:none;"; } else { echo "display:block;"; } ?>"> 
<input class="textbox" id="tbox6" name="tbox6" type="text" value="<?php if(isset($_POST['tbox6'])) { echo htmlentities ($_POST['tbox6']); }?>" /></span> 
</div> 

<div id="fa7" style="<?php if(empty($_POST['tbox7'])) { echo "display:none;"; } else { echo "display:block;"; } ?>"> 
<input class="textbox" id="tbox7" name="tbox7" type="text" value="<?php if(isset($_POST['tbox7'])) { echo htmlentities ($_POST['tbox7']); }?>" /></span> 
</div> 

<div id="fa8" style="<?php if(empty($_POST['tbox8'])) { echo "display:none;"; } else { echo "display:block;"; } ?>"> 
<input class="textbox" id="tbox8" name="tbox8" type="text" value="<?php if(isset($_POST['tbox8'])) { echo htmlentities ($_POST['tbox8']); }?>" /></span> 
</div> 

<?php 
if(isset($_POST['countfa'])){ 
$valueid = $_POST['countfa']; 
?> 
<input type="hidden" id="countfa" name="countfa" value="<?= $valueid ?>" readonly> 
<?php 
}else{ 
    ?> 

<input type="hidden" id="countfa" name="countfa" value="3" readonly> 
<?php 
} 
?> 
<button type="button" onClick="AddNewFa();" id="addfa" > + Add New FA </button> 
<button type="button" onClick="RemoveNewFa();" id="removefa" disabled="disabled"> - Remove FA</button> 

<input id="generate" type="submit" name="script" value="create my symcli script" /> 

</form> 
</body> 
</html>

和我的javascript代碼：

function AddNewFa() 
{ 
var facount = parseInt($('#countfa').val(),9) ; 
document.getElementById("test1").innerHTML = facount; 
    if(facount < 10) 
{ 
     facount = facount+1; 
     document.getElementById("test2").innerHTML = facount; 
      for(i=3;i<10;i++) 
       { 
        if(i<facount) 
         $('#fa'+i).slideDown("fast"); 
        else 
         $('#fa'+i).slideUp("fast"); 
       } 
    $('#countfa').val(facount); 
} 
    if(facount >=9) 
    { $('#addfa').attr('disabled','disabled');} 
    if(facount >=4) 
    { $('#removefa').removeAttr("disabled");} 
} 


function RemoveNewFa() 
{ 
var facount = parseInt($('#countfa').val(),10) ; 
document.getElementById("test3").innerHTML = facount; 
    if(facount >3) 
{ 
     facount = facount-1; 
     document.getElementById("test4").innerHTML = facount; 
      for(i=3;i<10;i++) 
       { 
        if(i<facount) 
         $('#fa'+i).slideDown("fast"); 
        else 
         $('#fa'+i).slideUp("fast");     
       } 
       $('#countfa').val(facount); 
      }   
     if(facount <=3) 
      { $('#removefa').attr('disabled','disabled');} 
     if(facount <=8) 
      { $('#addfa').removeAttr("disabled");  } 
    }

我對這個注意設置一個PHP FIDDLE：在PHP小提琴添加按鈕不能正常工作表單提交後。但我在實際網站上看到它工作正常。刪除按鈕仍然不起作用

來源

2013-10-07 acr

你說他們在表單提交後仍然被禁用 - 你是否在下面的HTML部分中錯過了一個PHP條件，以便在頁面顯示時實際刪除「禁用」部分？ '' –

我相信你的按鈕顯示的原因是因爲你必須啓用/禁用它們的代碼被放置在每個項目的click處理程序中。

你應該將下面的代碼：

if(facount >=9) 
{ $('#addfa').attr('disabled','disabled');} 
if(facount >=4) 
{ $('#removefa').removeAttr("disabled");}

進一個單獨的功能，即

function CheckButtons() { 
    var facount = parseInt($('#countfa').val(),9) ; 
    if(facount >=9) 
    { $('#addfa').attr('disabled','disabled');} 
    if(facount >=4) 
    { $('#removefa').removeAttr("disabled");} 
    if(facount <=3) 
    { $('#removefa').attr('disabled','disabled');} 
    if(facount <=8) 
    { $('#addfa').removeAttr("disabled");} 
}

而且形式提交運行後調用此函數。你也應該調用從單擊處理此功能（以減少複製的代碼）

$(document).ready(function() { 
    CheckButtons(); 
});

來源

2013-10-07 14:04:19 Nunners

我試過這種方法..但之後，兩個按鈕都不起作用。 – acr

你是否也重新填充表單提交的facount變量？如果不是，那麼它所檢查的值將不等於您所看到的項目數量。 – Nunners

我也已經根據你的代碼糾正了我的「CheckButtons（）」函數的代碼是正確的。 – Nunners

你需要做的是有一個文件準備檢查，看起來看到，如果你有2個以上的輸入框可見。如果是這樣，請刪除禁用的屬性。問題是當你提交表單時，你的html被重置並且remove按鈕被設置爲禁用。

來源

2013-10-07 14:04:36 jhnlsn

html表單在表單提交後保持禁用狀態

回答

相關問題