将表单字段附加到网址

时间:2012-06-05 12:08:06

标签: jquery forms

我正在尝试将文本输入字段中的值(数量)附加到网址。当然我不能让这个工作。

我得到的是:

<form class="formProduct" id="formProduct" action="#" method="post">
<input type="text" name="quantity" id="formProductQuantity" value="{{ product.stock.minimum }}" /> // text field with quantity
<a class="button blue opener" href="" title="{{ 'Add to cart' | t }}"><span>{{ 'Add to cart' | t }}</span></a> // submit button
</form>

<script>
 var addUrl = "http://shop.com/cart/add/123456/?quantity="; // 123456 is the product id

asset("#formProduct");

function asset(product){

    $(product + " input#formProductQuantity").val("1");
    $(product + " #formProductQuantity").keyup(function () {
         var val = $(product + " input#formProductQuantity").first().val();
    });

    $(product + " .opener").click(function() {
           var val = $(product + " input#formProductQuantity").first().val();

              // Go to page
              window.location.href = addUrl + val;

    });
 }
 </script>

所以我尝试传递表单中填写的数量以传递给http://shop.com/cart/add/123456/?quantity=100。 我在这个论坛上找到了上面的代码,但我无法让它工作。

任何帮助更多欢迎

更新

好的,在这里我得到了所有的帮助。任何评论或修改仍然是受欢迎的。功能代码如下所示:

<script type="text/javascript">
 var addUrl = "http://shop.com/cart/add/123456/?quantity="; // 123456  is the product id

 jQuery(document).ready(function(){
  asset("#formProduct");
  });
 function asset(product){

jQuery(product + " input#formProductQuantity").val("1");
jQuery(product + " #formProductQuantity").keyup(function () {
     var val = jQuery(product + " input#formProductQuantity").first().val();
});

jQuery(product + " .opener").click(function(event) {
  event.preventDefault();
   $.get($(this).attr('href'), function(data, status) {
       var val = jQuery(product + " input#formProductQuantity").first().val();

          // Go to page
          window.location.href = addUrl + val;
  $( "#dialog" ).dialog( "open" );
          return false;

  });
 })}

3 个答案:

答案 0 :(得分:3)

您正在尝试将Javascript添加到提交按钮,以便它将通过Javascript运行,但表单仍将被提交,因此不会发生window.location.href。你需要做的是添加

  

返回false;

到您的asset()函数的末尾:

$(product + " .opener").click(function() {
    var val = $(product + " input#formProductQuantity").first().val();

    // Go to page
    window.location.href = addUrl + val;
    return false;
});

这将阻止表单提交,允许您的window.location.href根据需要重定向。

答案 1 :(得分:1)

我认为你可以使用get方法提交表单,它会通过url发送你的数据

答案 2 :(得分:1)

你很亲密。如果你想在#formProductQuantity中使用val,那么使用:

var val = $("#formProductQuantity").val();

var addUrl = "http://shop.com/cart/add/123456/?quantity=" + val
top.location = addUrl

更新函数中的href: {{&#39;加入购物车&#39; | t}} //提交按钮

在你的功能中添加:

$(".opener").attr("href", "http://shop.com/cart/add/123456/?quantity=" + val );

现在锚定了并准备好了...然后当他们点击锚点时,我们走了:-)你也可以添加target =&#34; _blank&#34;在新页面中打开网址。