1

動的に作成された入力項目をループする JQuery Min Max Validation について質問があります。私のphpページには、DB内のデータをループする動的テーブルがあります。時々、3 つの入力項目 (セル) を持つテーブルがあり、時には 6 つまたは 12 の入力項目があります。jqueryを使用すると、データの最小値と最大値を検証することがわかりましたが、最初の入力項目に対してのみ機能します。すべての入力項目をループして同じ最小最大検証を取得するにはどうすればよいですか?

ここで JQuery コード:

    $(document).ready(function(){
        $("input").click(function(){

                var enteredValue = $("input:#value_one").val();
                var min=1;
                var max = 3;
                var num = parseInt(enteredValue);

                if (min > num || max < num) {
                    alert('Number ' + num + ' is not a number between ' + min + ' and ' + max);
                    return false;
                }
        });
    });

PHP HTMLコードの一部:

    foreach($datas as $idactivite=>$dat){
        $totalactiv=0;
        $nbdiviseur=0;
        foreach($dat as $dd){
            $totalactiv+=$dd["note"];
            $nbdiviseur++;
        }
        $mamoyactiv=$totalactiv/$nbdiviseur;
        $position=3;
        $mamoyactiv = substr($mamoyactiv, 0, $position);
        $moyenneverticale[$idactivite]=$mamoyactiv;

// Here the input Item who loops through the DB Query to get them values:       

        $htmldroit.="<td id='myguaNote' bgcolor='$bgcolor' align='center'>

        <input name='".$idactivite."_".$idagent."' id='value_one' maxlength='1' class='grand' value='".$dat[$idagent]["note"]."' ></td>";

        $totalfamille+=$dat[$idagent]["note"];
        $TabRes[$ind] += $dat[$idagent]["note"];
        $TabObj[$ind] = "&nbsp;";
        $TabResColor[$ind]=0;

        $ind++;
    }

誰かアイデアはありますか？

事前にTHX

4

6 に答える 6

0

実際にクリックされた入力フィールドを実際に選択していないと思います。

var enteredValue = $("input:#value_one").val()と置き換えます

 var enteredValue = $(this).val();

からのコールバック関数はclick、クリックされた DOM 要素への参照をthisキーワードに保持します。それをラップし$()てjQueryオブジェクトにし、最後val()にそれを呼び出します。

フィドル

編集： ボタンクリックで複数の入力フィールドを検証するには、ヘルパークラスを使用しましたvalidate。検証したいすべての入力フィールドにこのクラスがあると仮定すると、いくつかのコードをバインドして、クリック時にボタンを送信できます。

$("#submitButton").click(function(){
    $(".validate").each(validateField);
});

最初に、クラスを持つすべての要素が選択され、このコレクションで関数ハンドルを引数として取るvalidatejQuery のeach()を呼び出します。この関数 (validateFieldこの場合) は、入力引数 (インデックスと要素、詳細についてはドキュメントを参照してください。「for in」ループの奇妙な for を考えている場合は、そう遠くない.) を受け取る必要があります。
検証コードをこの関数に移動し、単純に置き換えまし$(this)た$(element)

フィドル

于 2012-09-04T09:12:44.217 に答える
0

いくつかのヒント

動的データを操作している場合は、単純な「クリック」機能を使用せず、代わりに.on (jQuery 1.7+を使用)を試してください。

 $('document').on('click', 'input', function(){

   var enteredValue = $(this).val();
   //your rest of code
});
于 2012-09-04T09:13:27.360 に答える
0

|| if (min > num || max < num) {

への変更

// For a number not between min and max
if (num < min || num > max) {

// For a number between min and max
if (num >= min && num <= max) {

テスト用：

        <script>

        function test(){

            $html = document.getElementById("msg");

            num = 100;
            min = 10;
            max = 100;

            if (num < min || num > max) {
            $html.innerHTML = "Num is not between min and max";
            return;
            }

            if (num >= min && num <= max) {
            $html.innerHTML = "Num is between min and max";
            return;
            }

        }

        </script>
        <body onload="test()">
        <div id="msg" style="border:1px solid #000000; height:100px">Answer has not been found!</div>
        </body>
于 2012-09-04T09:14:52.277 に答える
0

.on()を探しているように思えますが、これはページの変更に合わせて最新の状態に保ちますが、クリックはページが作成されたときの状態にすぎません。試す：

$("input").on("click",function(){
于 2012-09-04T09:15:11.307 に答える
0

変数をどこかに挿入するために使用される動的な量の要素を作成するときの良い習慣は次のとおりです。

  1. 識別のための一意の ID を指定します。
  2. CSS クラスを使用します。クラス スタイルは繰り返されることを意図していますが、ID はそうではありません。

したがって、1 から 100 までの多数の入力を生成する場合、

for ($i = 1; $i <= 100; $i++)
{
    $IdAndName = "input" . $i;
    echo("<input type='text' id='" . $IdAndName . "' name='" . $IdAndName . "' class='myStyle'/><br>\n");
}

これで、input1 から input100 までの ID を持つ HTML 要素ができました。

次に、JQuery クリック イベントをそのまま使用し、$(this).val() を使用してクリック時にその値を取得できます。

于 2012-09-04T09:21:29.440 に答える
0

これを試して

//========== 配列の最小値を見つけるためのプロトタイプ=========================

        Array.prototype.min = function() 
        {
            return Math.min.apply(null, this)
        }

//============= Jquery スクリプト================================ ==================

            $selector=$("input");  //Your selector which is cursoring your inputs
            $aryVal=new Array;     //Define an Array
            $selector.each(function() //Iterate to all the input
            {
                $aryVal.push(this.value); //push the value to array
            });

            var min = Math.min.apply(null, $aryVal);  //Getting min value from array
            alert(min);
于 2012-09-04T09:20:38.000 に答える