4

複数の行を持つテーブルがあります。各行には、製品フィールド、グレード フィールド、ファミリ フィールドがあります。

次に、使用可能なサイズごとにいくつかのチェックボックスがあります。

テーブルの行は次のようになります。

<table class="authors-list" border=0 id="ordertable">
 <tr>
     <td style="font-size:10px;"><a class="deleteRow"> <img src="<?php echo base_url() ?>application/assets/images/delete2.png" /></a></td>
     <td ><input type="text" id="product1" name="product1" class="rounded"/></td>
     <td ><input type="text" size='5' id="qty1" name="qty1" class="rounded"/></td> 
     <td class="tdcheckbox">
      <input type="checkbox"  id="h09_1" name="h09_1" class="rounded"/>
      <input type="text"  id="line_1_09" name="line_1_09" value="">
      <input type="text"  id="size_1_09" name="size_1_09" value="09">

    </td> 
     <td class="tdcheckbox">
      <input type="checkbox"  id="h12_1" name="h12_1" class="rounded"/>
      <input type="text"  id="line_1_12" name="line_1_12" value="">
      <input type="text"  id="size_1_12" name="size_1_12" value="12">
    </td> 
     <td class="tdcheckbox">
      <input type="checkbox"  id="h15_1" name="h15_1" class="rounded"/>
      <input type="text"  id="line_1_15" name="line_1_15" value="">
      <input type="text"  id="size_1_15" name="size_1_15" value="15">
    </td> 
    <td><input type="text" name="cubespercheck_1" id="cubespercheck_1" value="0" size=5></td>
    <td><input type="text" name="skufamily_1" id="skufamily_1"></td>
    <td><input type="text" name="skugrade_1" id="skugrade_1"></td>
 </tr>
</table>
<input type="button" id="continue" value="continue">

製品フィールド以外のすべてのフィールドは最終結果で非表示になります。

背景を説明すると、私の製品コードは次のようになります。 3811460S5 38114 は幅と高さ 60 は長さ Cr はグレードです。

私がしたいことは、ボタンをクリックすると、jquery がすべてのテーブル セルをループする必要があることです。CHECKED チェックボックスがあり、製品が入力されている場合、jquery は次のようにフィールドを結合する必要があります。

この結果は、現在の td 入力に入力する必要がありますline。これで、各セルに正確な SKU が表示されます (チェックされ、製品が入力されている場合のみ)

skufamily、size、および grade は事前に入力されているため、jquery をループしてフィールドに参加させるだけで済みます。

ここで再生するフィドルです。http://jsfiddle.net/QS56z/

私は次の概念を試しましたが、コードを完全に釘付けにすることはできません。

    function createcodes() {
$("table.authors-list").find('input[type="checkbox"][name^="h"]:checked').each(function () {
 if (<checkbox is checked>)
      document.getElementById(input[type="skufamily").value + 
      document.getElementById(input[type="size").value +
      document.getElementById(input[type="skugrade").value

        });

これは正しいとはほど遠いので、私を正しい道に導くことができれば幸いです。

いつもありがとうございます。

4

1 に答える 1

4

あなたのフィドルを更新しました。このコードはそれを行うべきだと思います。

$("#continue").click(function(){
    $("table#ordertable > tbody > tr").each(function(){
        var productVal = $('td:eq(0) input', this).val();
        if(productVal.length > 0){
            //get the code portion
            var trimmedProductVal = productVal.substring(0, productVal.length - 2);
            var productCode = productVal.substring(productVal.length-2, productVal.length);
            //get the checked items
            $('td.tdcheckbox', this).each(function(){
                var currentCell = this;
                $("input[type='checkbox']:checked", this).each(function(){
                    //concatenate the value
                    var valueToSet = $('input[type="text"]:eq(1)', currentCell).val();
                    valueToSet = trimmedProductVal + valueToSet + productCode;
                    //set the text value
                    $('input[type="text"]:eq(0)', currentCell).val(valueToSet);
                });;
            });
        }
    });
});
于 2013-04-23T14:44:07.967 に答える