0

私は、magento ストアの 1 つで「SKU による注文」システムを開発しています。これは、必要な SKU と数量を簡単に入力するだけです。

次の機能を使用して、そこに「別の sku を追加」オプションを追加しました。

function adicionarCampos(){
    var str = $('tabs-wrapper-cod').insert( '<div class="enc-cod-tab"><span class="enc_cod_02_home">Código: <input type="text" name="cod[]" value="" class="form_carrinho_cod required-entry" /></span><span class="enc_cod_04_home">Qt: <input type="text" name="qt[]" value="" class="form_carrinho_qt required-entry validate-number" /></span></div>' );
}

この機能は、ユーザーが別の SKU を入力するための別の「タブ」を追加します。参照用のメインファイルは次のとおりです。

<div id="enc-cod-conteudo" title="Encomendar por código">
    <div class="enc-por-codigo">
        <p class="sub-enc-cod">Nunca foi tão simples encomendar por código!</p>
        <div class="quick-order">
            <form action="<?php echo htmlspecialchars($_SERVER["PHP_SELF"]);?>" method="POST">
                <div id="tabs-wrapper-cod">
                    <div class="enc-cod-tab"><span class="enc_cod_02_home">Código: <input type="text" name="cod[]" value="" class="form_carrinho_cod required-entry" /></span><span class="enc_cod_04_home">Qt: <input type="text" name="qt[]" value="" class="form_carrinho_qt required-entry validate-number" /></span></div
                </div>
        </div>
        <div class="actions_carrinho">
            <div class="adicionar-cod" onclick="adicionarCampos();"><span>Adicionar código</span></div>
            <button style="padding-left: 6px;" type="submit" title="Adicionar" class="button btn-update"><span><span>Adicionar ao carrinho</span></span></button>
        </div>
        </form>
    </div>
</div>
</div>

ご覧のとおり、追加された入力には同じ ID "sku" が割り当てられます。ここでわかるように、検証スクリプトが探しているものは次のとおりです。

jQuery(document).ready(function(){
jQuery('#sku').keyup(sku_check);
});

function sku_check(){   
var sku = jQuery('#sku').val();
if(sku == "" || sku.length < 7){
jQuery('#sku').css('border', '1px #CCC solid');
jQuery('#tick').hide();
jQuery('#nome_do_produto').hide();
} else {
jQuery.ajax({
   type: "POST",
   url: "scripts/verificar_cod.php",
   data: 'sku='+ sku,
   cache: false,
   success: function(response){
if(response.length > 0){
    console.log(response);
    jQuery('#sku').css('border', '1px #090 solid');
    jQuery('#tick').fadeIn();
    jQuery('#cross').hide();
    jQuery('#nome_do_produto').html(response);
    jQuery('#nome_do_produto').fadeIn();
    jQuery('#codigo_inexistente').hide();
    } else {
    jQuery('#sku').css('border', '1px #C33 solid');
    jQuery('#cross').fadeIn();
    jQuery('#tick').hide();
    jQuery('#nome_do_produto').hide();
    jQuery('#codigo_inexistente').fadeIn();
         }
    }
    });
}
}

これが正しい方法ではないことはわかっていますが (ID は本質的に一意である必要があります)、いわば JavaScript は私の「ビーチ」ではなく、追加入力に一意の ID を与える方法に行き詰まっています。さらに、検証スクリプトは、増分されたすべての ID を探す必要があります。

私の質問は、そのような問題にアプローチする最善の方法は何ですか? JavaScriptを介してインクリメントを検討する必要がありますか? もしそうなら、どのように?

4

1 に答える 1