0

エリック・マーティンのシンプルなモーダルに関して、実際には2つの質問があります。私がやろうとしているのは、誰かがボタンをクリックすると、モーダル ポップアップが表示され、その特定の製品のさまざまなバリエーションが表示されるということです。これはチェックボックスなので、赤や緑だけでなく、「緑」赤などの色を選択できます。さらに、その特定の色に必要な量を入力できる入力フィールドがあります。1、20、100万など...

これまでのところ、問題はありません....問題は、入力されたデータとチェックボックスをサーバーに送り返す必要があることです。私は実際にそれを行う方法がわかりません。

1）チェックボックスが実際にチェックされているかどうかを確認するにはどうすればよいですか？2) 入力フィールドから値を取得するにはどうすればよいですか? 3) このデータをサーバーに送信するにはどうすればよいですか?

私が持っているものは次のとおりです。

$('.opener').click(function (event) {

 var url = $(this).attr("href")+'/?format=json';

 $('#formVariants').modal({ 

 onShow:function(dialog) {      

   $.getJSON(url, function(data) {           

     var contentHtml = '';

     $.each(data.product, function(index, product){

       var image = 'http://cdn.webshopapp.com/i/' + image_id_convert(data.product.image) + '/160x120x2/image.jpg';

       contentHtml = 
         '<img src="'+image+'"/>' +
         '<div class="variantsContainer">' +  
         '<h3>' + data.product.fulltitle + '</h3>';
       });

     $.each(data.product.variants, function(index, variant){

       //var variantId = ;
       //  " selected="selected"> - €0,00
       contentHtml = contentHtml + 
         '<div class="variants">' + 
         '<label><input type="checkbox" name="variant" value="' + variant.id + '"/>' + variant.title + '</label> ' +
         '<label style="float:right; margin-right:10px;">Aantal: <input type="text" name="quantity" id="formProductQuantity" value="1" /></label>';

       contentHtml = contentHtml +   
         '</div>';

     });

     $('#formProduct .formProductContent').html(contentHtml);

   });

 }
 });
 return false
 })

私のHTML

    <div id="formVariants">
  <div class="formVariantsContent">
    <form class="formProduct" id="formProduct" action="{{ ('cart/add/' ~ product.vid ) | url }}" method="post">
      <div class="formProductContent"></div>
      <a class="button button grey simplemodal-close"><span>{{ 'Annuleren' | t }}</span></a>
      <a class="button blue opener" href="#" title="{{ 'Add to cart' | t }}"><span>{{ 'Add to cart' | t }}</span></a>
    </form>
  </div>
</div>

私はjqueryにかなり慣れていないので、ここまで来ました。誰かがアドバイスをくれたら嬉しいです。

どうも。

4

1 に答える 1

1

フォームを使用しているため、method="post" で送信すると、入力フィールドに key=name value=value という形式のキーと値のペアが送信されます。例えば：

<input type="text" name="quantity" id="formProductQuantity" value="1" />

あなたの POST には ['quantity'] = 1 があります

フォーム action= では、フォームが送信されたときにリクエストがその URL に送信されます。

于 2012-07-31T23:37:48.643 に答える