0

商品のリストがあり、各行に「カートに追加ボタン」があります。スクリプトは、art.codeとアイテム数を挿入し、応答を返す最初の行で正常に機能します。リストのさらに下にある別の記事を押すと、スクリプトが機能しません。別の質問のどこかでIDが一意である必要があることを読みましたが、それをスクリプトに実装する方法が本当にわかりません。


<form method='post' action='search.php'>
 <input type='hidden' id='cartart' name='cartart' value='".$artno."' />
 <input id='cartantal' type='number' name='cartantal'value='".$number."' />
 <input type='submit' name='submit' id='submit' value='add'/>
 </form>

<span id='result'></span>

等々...


$(function() {
    $("#submit").click( function(){

        var namn = $('#cartart').val();
        var antal = $('#cartantal').val();

        $.ajax({
            url: "search.php",
            type: "POST",
            data: 'gui_artkod=' + namn + '&gui_antal=' + antal,

            success: function(result){
                $("#result").html(result);
            }
        });
        return false;
    });
  });

4

2 に答える 2

1

コードにある問題は、同じIDを持つ複数のフォームがあることです。IDは常に一意である必要があります(そのため、IDと呼ばれます)。

すべてのIDをクラスに変更します。

<form method='post' action='search.php'>
 <input type='hidden' class='cartart' name='cartart' value='".$artno."' />
 <input class='cartantal' type='number' name='cartantal'value='".$number."' />
 <input type='submit' name='submit' class='submit' value='add'/>

JavaScript:

$(function() {
  $(".submit").click( function(){  //use class selector

    var namn = $(this).parent().find('.cartart').val();  //finds the parent of the clicked button  and search for a class called cartart and gets the value 
    var antal = $(this).parent().find('.cartantal').val();

    $.ajax({
        url: "search.php",
        type: "POST",
        data: 'gui_artkod=' + namn + '&gui_antal=' + antal,

        success: function(result){
            $("#result").html(result);
        }
    });
    return false;
  });
});
于 2012-12-04T09:56:47.130 に答える
0

IDセレクターの代わりにクラスを使用してみてください。

HTMLの変更:送信ボタンにクラスを追加しました

<form method='post' action='search.php'>
 <input type='hidden' id='cartart' name='cartart' value='".$artno."' />
 <input id='cartantal' type='number' name='cartantal'value='".$number."' />
 <input type='submit' name='submit' class='addToShoppingCart' value='add'/>
 </form>

Javascriptの変更:送信ボタンのセレクターを変更しました。

$(function() {
    $(".addToShoppingCart").click( function(){

  ...rest remains same
});

を使用してさらに改善することもできます.on()。こちらのドキュメントを確認してください: http: //api.jquery.com/on/

于 2012-12-04T09:53:07.700 に答える