Simplemodal複選框和輸入字段

我有一個問題，實際上是兩個，關於eric martins的簡單模態。我試圖做的是，當有人點擊一個按鈕時，模式會彈出並顯示該特定產品的不同變體。這是複選框，所以你可以選擇一個顏色「綠色」紅色等不只是紅色或綠色。此外，還有輸入字段，您可以填寫所需顏色的數量。所以1或20或100萬等...Simplemodal複選框和輸入字段

到目前爲止好....現在問題是，我需要發送填充數據和檢查複選框回到服務器。我其實不知道該怎麼做。

因此： 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和走到這一步，如果有人給我一些意見，我會很高興。

Thx。

來源

2012-07-31 Meules

由於您正在使用表單，因此當您使用method =「post」提交表單時，它將爲您的輸入字段發送表單key = name value = value的鍵值對。例如：

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

在您的文章，你將有[「量」] = 1

在表單動作=導致表格提交時請求發送到該URL。

來源

2012-07-31 23:37:48

Simplemodal複選框和輸入字段

回答

相關問題