すべての行が追加された後にテキストエリアを無効にする方法

Question

ユーザーは行を追加できますが、各行には番号が付けられています。ユーザーは、実際に行を追加する前に、追加したい行の数だけテキストボックスに数値を入力します。以下は、追加された行の数がユーザーが入力した数を超える場合、行の追加を停止するコードです。

if (qnum > <?php echo (int)@$_POST['textQuestion']; ?>) { 
    return; 
} 

例：ユーザーがテキストボックスに数5に入力された場合、ユーザは別の行を追加しようとした場合、その後、ユーザは、5行を追加することができ、ユーザがさらに追加することができないので、次に何行が追加されません5行以上。

これで正常に動作します。

if (qnum > <?php echo (int)@$_POST['textQuestion']; ?>) { 
     $('#questionTextArea').attr('disabled', 'disabled'); 
    return; 
} 

問題があることである。しかし、私は何をしたい追加された行の数が限界に会ったとき、私はそれが一番上にテキストエリアを無効にしたいので、私は、以下これにコードを変更したことです上記のコードを実行すると、正しくないテキストエリアがすぐに無効になります。何が起こるべきなのかは、追加することが許可されている最大のテーブル行を追加することができ、ユーザがその制限に達したときにテキストエリアを無効にすることです。誰もこれを達成する方法を知っていますか？

以下

それはテーブルの行を追加して機能である：

以下

function insertQuestion(form) { 

      if (qnum > <?php echo (int)@$_POST['textQuestion']; ?>) { 
      $('#questionTextArea').attr('disabled', 'disabled'); 
    return; 
} 

    var $tbody = $('#qandatbl > tbody'); 
    var $tr = $("<tr class='optionAndAnswer' align='center'></tr>"); 
    var $qid = $("<td class='qid'>" + qnum + "</td>"); 




    $tr.append($qid); 
    $tbody.append($tr); 

    $(form).find('.numberOfQuestions').val(qnum); 

    ++qnum; 


} 

私は無効にしたいテキストエリアである：それはあなたが良いと記載されたコードの束を持って

<table id="question"> 
<tr> 
    <td rowspan="3">Question:</td> 
    <td rowspan="3"> 
     <textarea id="questionTextArea" rows="5" cols="40" name="questionText"></textarea> 
    </td> 
</tr> 
</table> 

Answer 1

が、一緒にうまくフィットしていないようです。

insertQuestion（）はいつ呼び出されますか？これを引き起こすのは何ですか？

この行$(form).find('.numberOfQuestions').val(qnum);はclass numberOfQuestionsを参照していますが、そのクラスはどこにも使用されていませんか？

この行：var $tbody = $('#qandatbl > tbody');はID qandatblのオブジェクトを参照していますが、どこにも定義されていません。

完全なコードサンプルを提供してください。私はあなたを助けてくれるでしょう。

Answer 2

これは、jQueryの.keyup（）イベントハンドラを使用して実行できます。

次の関数は、許容される改行数を超える要素が含まれていると、要素を無効にします。

function limitRows() { 
    var $this = $(this); 
    var allowedRows = parseInt($this.attr("rows")); 
    $this.prop("disabled", $this.val().split("\n").length > allowedRows); 
} 

$("#questionTextArea").keyup(limitRows); 

あなたはそのようにのようなPHPとrows属性を移入することができます。

<textarea id="questionTextArea" 
    rows="<?php echo (int)@$_POST['textQuestion']; ?>" 
    cols="40" name="questionText"></textarea> 

ここで働くの例を参照してください：注意のhttp://jsfiddle.net/e4SNa/

STRONG WORD ....

をユーザーが自分の最後の行に入力して誤って押されている場合ので、私はこのアプローチに対して助言します"enter"を押すと、フィールドは無効になり、間違いを修正する機会はありません。