-1

jquery を使用して入力ボックスを動的に生成し、それをドキュメントに埋め込んでいます。私が抱えている問題は、正しい値がインスペクターに表示されているにもかかわらず、ブラウザーに無効な値が表示されることです。

さらに明確にするために、ここに画像があります： ここに画像の説明を入力

インスペクタで確認できます <input name="txtTblAmount" class="num" style="width:70px;" type="text" value="1000" tabindex="29">

値は 1000 ですが、ブラウザ ウィンドウに表示されるのは 1500 です。だれか見て教えてください。ここで何が問題なのですか?

PS: firefox でも試してみました。しかし、それでも問題は同じです。つまり、インスペクターの値が異なります。

JSコードは次のとおりです。

function addrow(itemName, itemid, godown, godownid, quantity, rate, amount, gstAmount) {

        gstAmount = typeof gstAmount !== 'undefined' ? gstAmount : '0';

        if (typeof dTable1 != 'undefined') {
            // dTable1.fnClearTable();
            //$('#ItemRows').find('a[name="btnDelItem"]').off();
            dTable1.fnDestroy();
            // $('#ItemRows').empty();
        }
        //alert($('#ItemRows tr').length);
        var strRow = '<tr id="row' + ($('#ItemRows tr').length + 1) + '">' +
             '<td class="">' +
            (($('#ItemRows tr').length + 1)) +
              '</td>' +
              '<td class="tdItemName" style="widtd: 250px">' +
               itemName +
             '<input name="hfItemId" style="width:200px;" type="hidden" value="' + itemid + '"/>' +
              '</td>' +
              '<td class="" style="widtd: 200px">' +
                godown +
                '<input name="hfGodownid" style="width:200px;" type="hidden" value="' + godownid + '"/>' +
                 '</td>' +
                 '<td class="" style="widtd: 200px">' +
                 '<input name="txtTblQuantity" style="width:200px;" class="num"  type="text" value="' + quantity + '"/>' +
                  '</td>' +
                   '<td class="" style="widtd: auto">' +
                  '<input name="txtTblRate" style="width:70px;" class="num"   type="text" value="' + rate + '"/>' +
                '</td>' +
                 '<td class="" style="widtd: auto">' +
                  '<input name="txtTblAmount" class="num"  style="width:70px;" type="text" value="' + amount + '"/>' +
                 '</td>' +
                 '<td>' +
                 '<input name="txtTblGstAmount" class="num"  style="width:70px;" type="text" value="' + gstAmount + '"/>' +
                 '</td>' +
                '<td class="ms"><div class="btn-group1"> <a class="btn btn-small" rel="tooltip" data-placement="left" data-original-title=" edit " name="btnDelItem" data-id="' + ($('#ItemRows tr').length + 1) + '"  ><i class="icon-remove"></i></a>  </div></td>' +

                '</tr>';
        console.log(strRow);
        console.log(amount);

        $('#ItemRows').append(strRow);
        //SaveNewParty($("#drpAccId option:selected").text());
        bindGrid();
        //dTable1.fnDraw();
        PopulateTotal();
        // $('#ItemRows').find('a[name="btnDelItem"]').off();
        var insertedRow = $('#ItemRows tr')[$('#ItemRows tr').length - 1];
        $(insertedRow).find('a[name="btnDelItem"]').on('click', function () {
            var row = $(this).parents('tr');
            dTable1.fnDeleteRow(dTable1.fnGetPosition(row[0]));
            $('#ItemRows tr').each(function (index) {
                $(this).find('td:nth(0)').text((index + 1));

            });

            PopulateTotal();


        })
        $('#datatable_Items').css('width', '100%');
        Populate_Events();
    }
4

2 に答える 2

1

私はちょうどあなたのコードを見て、あなたがここに示したコードに問題がないことを発見しました. 私は Afzaal Ahmad Zeeshan に同意しますが、彼の説明の仕方は常にそうであるとは限りません。私は最近同じ問題を抱えていました。何時間も頭を悩ませた後、他のjqueryコードによって値が変更されていることがわかりました。

また、jquery によって設定された値がインスペクターに表示されるとは限らないことにも注意してください。たとえば、試してみると、インスペクターで$("#inputel").val(4)値が更新されないことに注意してください。更新しました。インスペクターは、サーバーから送信された値のみを表示し、jquery などで設定した値は表示しません。

あなたが私の主張を理解してくれることを願っています！

于 2013-09-23T09:35:09.793 に答える
1

カムラン、それは重要ではありません。この値をNOT DYNAMICALLYに設定しています。はい、ここで見られます！ページの読み込み中にこの値を設定しているか、表示されていない他のコードを使用しています! よくわかりません。ここでわかりました。

画像

私の例では、入力にテキストを書いていますが、要素の検査で値の更新はありません。

widtdまた、答えではないかもしれませんが、正しい CSS プロパティではないものを使用していることがわかります。正しいものはwidthです。あなたはそれを知っています。

フォームをサーバーに送信する際に問題が発生することはないと確信しています。値は、書き込んだ値によって更新されるためです。

私はあなたのコードを見ました、あなたはフィールドを次のように書いています：

<input name="txtTblAmount" class="num"  
style="width:70px;" type="text" value="' + amount + '"/>'

私によると、問題は にありamountます。関数にもこのフィールドがあります。

function addrow(itemName, itemid, godown, 
godownid, quantity, rate, amount, gstAmount) {

それを防ぐためにできることは、amountそこの値を変更することです。変更したくない場合は、問題ありません。また、入力した値をクリックすると、フィールド自体ではsubmitなくサーバーに送信されるため、この値の違いを恐れる必要はありません。value値は、そこに書かれているからです。他にはありませんので、ご安心ください！大丈夫です。必要に応じて、現在値を変更することはできません。次に、これが地獄のコードです。ハードコードする必要があります。このような！

<div id="input">
  <input type="text" id="text" value="" onkeyup="updateVal()" />
</div>

function updateVal() {
  // start function..
  var val = $('#text').val(); // the value of field..
  // after getting the value, update the div..
  $('#input').html("<input type='text' id='text' value='" + 
  val + "' onkeyup='updateVal()' />");
}

ただし、このコードを使用すると、フィールドの現在の値が取得されることに注意してください。ただし、入力フィールドへのフォーカスが失われます。div は更新されますが、値は最新のものになります!

今、焦点を合わせ続けますか？

これを使用できます：

$('#text').focus();

ただし、これを使用している間は、フィールドに 1 つのONLY ONE単語しか表示されません。

なんで？

一度フィールドにフォーカスすると、フィールド内の単語または値が (すべて選択) 選択され、別の単語を押すと、前の単語が最新の単語に置き換えられます。この方法では、正しいフィールドを取得できません。つまり、選択したフィールドです。しかし、あなたの問題は修正されます。

ですから、カムランは私を信じてください。ハードコーディングしたくありません。それでも試してみたい場合は、私が共有したコードを使用してください。

私が共有しているコードの例は次のとおりです。

ゼロ値

値またはいくつかの単語を修正すると、この開発者ツールが表示されたときに値が自動更新されます。このような：

ここに画像の説明を入力

それだけでした。私はあなたの仕事に2つの選択肢を与えました。それでも、コードを使用せず、フィールドの値を更新するだけのオプションを使用したいと思います。残りはカムラン次第です。

編集：

1000ユーザーが入力に追加する値ではなく、値を使用したいと述べました。次に、これを使用します。

$("name='txtTblAmount'").val() == "1000");

これにより、ユーザーが追加する値が自動的に上書きされ、取得したい値に置き換えられます!

于 2013-09-22T09:15:28.713 に答える