一页上有多个提交按钮但可区分(jquery)

时间:2014-04-27 23:32:55

标签: php jquery forms submit

我正在尝试编写一个代码,以便以后存储项目' - 一个将项目的url作为隐藏输入的按钮,在提交时调用一个php脚本来执行db中的存储。我更喜欢php,对面向对象的任何知识都很少,但是我需要使用jquery来调用php脚本而不需要移动到那里

问题是当我在一个页面上有多个表单时如何分配x和y变量

我只能写下面的

 $("form").bind('submit',function(e){
   e.preventDefault();

      var x =  $("input[type=hidden][name=hidden_url]").val();
      var y =  $("input[type=hidden][name=hidden_title]").val();



   $.ajax({
   url: 'save_storage.php?url='+x+'&tit='+y,
   success: function() {
    alert( "Stored!");
     location.reload();
   }
});

});

如果您有类似......

的话,它可以正常工作
<form method="post" action="#">
 <input type="hidden" id="hidden_url"  name="hidden_url" value="<?php echo $sch_link; ?>"/>
 <input type="hidden" id="hidden_title" name="hidden_title" value="<?php echo $sch_tit; ?>"/>
 <input type="submit" id="send-btn"  class="store" value="Store" />
</form>

..一旦在页面上,我已经有大约50个。

这些是通过for循环生成的我想我可以使用$ i作为标识符,但是如何告诉jquery只分配实际点击的表单/提交的变量?

2 个答案:

答案 0 :(得分:1)

您必须查找隐藏字段以仅查看当前表单。在事件处理程序中,this将引用正在提交的表单。这只会找到与该表单中给定选择器匹配的输入。

$("form").bind('submit',function(e){
  e.preventDefault();

  var x =  $(this).find("input[type=hidden][name=hidden_url]").val();
  var y =  $(this).find("input[type=hidden][name=hidden_title]").val();

  $.ajax({
    url: 'save_storage.php',
    data: {
      url: x,
      tit: y
    },
    success: function() {
      alert( "Stored!");
      location.reload();
    }
  });
});

正如@Musa所说,为data调用提供$.ajax密钥以传递字段值也更好。

答案 1 :(得分:1)

在表单提交处理程序中,您可以通过this变量访问表单元素。在搜索适当的输入以传递给AJAX数据时,您可以使用它来为选择器提供一些上下文。

这是:

$("form").bind('submit',function(e) {
    e.preventDefault();

    // good practice to store your $(this) object
    var $this = $(this);

    // you don't need to make your selector any more specific than it needs to be
    var x = $this.find('input[name=hidden_url]').val();
    var y = $this.find('input[name=hidden_title]').val();

    $.ajax({
        url: 'save_storage.php',
        data: {url:x, tit: y},
        success: function() {
            alert( "Stored!");
            location.reload();
        }
    });
});

此外,每页的ID必须是唯一的,因此请从输入中删除id属性。