目标是正确的表单输入值Ajax和PHP - Target correct form input value Ajax and PHP

Target correct form input value Ajax and PHP

本文关键字：Ajax PHP 输入表单目标 | 更新日期: 2023-09-26

我有一个这样的脚本：

  $(function() {
     $(".btn_bookmark").click(function() {
   var name = $("input.???").val(); 
   base_url = '<?php echo base_url() ?>';
    $.ajax({
            url: base_url+"bookmark/bookmark_item/"+name,
            success: function() {
                    // do something on success
            }
         });
    return false;
    });
});

我的表单在PHP循环中，如下所示：

foreach($page->result() as $row){
   echo '<form name="" method="post" action="">';
   echo '<input type="hidden" name="'$row->name'" id="'.$row->id.'" size="30" value="'.$row->val.'" />';
   echo '<input type="submit" name="submit" class="btn_bookmark" id="submit_btn" value="Bookmark" />';
   echo '</form>';
}

问题是每个表单隐藏的输入名称、id和值与MySQL数据库不同/动态。那么，我该如何为输入选择正确的值呢？

而不是抓取var name = $("input.???").val();

你可以像这样获取隐藏的输入：

$(this).parent().find('input[type=hidden]').val();

这将获取触发事件的元素的父级(在本例中为表单(，然后获取该父级的隐藏输入子级。

$(".btn_bookmark").click(function() {
    var name = $(this).prev().val();
    base_url = '<?php echo base_url() ?>';
    $.ajax({
            url: base_url+"bookmark/bookmark_item/"+name,
            success: function() {
                    // do something on success
            }
         });
    return false;
    });
});

通过这种方式，您将获得上一个元素，即隐藏的元素。

实现与您的不同，但它应该可以工作。

试试这个：

foreach($page->result() as $row){
   echo '<form name="" method="post" action="">';
   echo '<input type="hidden" name="'$row->name'" id="bkmark'.$row->id.'" size="30" value="'.$row->val.'" />';
   echo '<input type="submit" name="submit" class="btn_bookmark" id="submit_btn" value="Bookmark" onClick="bookmarkThis(''#bkmark' . $row->id . ''');" />';
   echo '</form>';
}

你的js将是：

$(function() {
     boomarkThis = function(someId) {
         var name = $(someId).val();
         base_url = '<?php echo base_url() ?>';
          $.ajax({
                url: base_url+"bookmark/bookmark_item/"+name,
                success: function() {
                        // do something on success
                }
             });
        return false;
        });
     }