Jquery - 获取父元素的数据 ID

Jquery - Getting a parent element's data-id

本文关键字：数据 ID 元素 获取 Jquery      更新时间：2023-09-26

一直在查看以前提出的问题，但找不到太多帮助。

我有以下 html 代码，它通过数据 id 发送到以下模式，当用户提交表单时，我创建了一个（'#edit-form'）.submit 函数，该函数需要通过前面提到的数据 ID 发送。

这是我的代码

按钮打开模式>>

<button type="button" class="edit-group" title="Edit Group" data-id="<?php echo $group->id ?>" data-name="<?php echo $group->groupName ?>">Edit Group</button>

模态内部的表单：

<form class="form-horizontal" id="edit-template-form">
    <div class="modal-body">
        <div class="form-group">
            <label for="edit-group-name" class="col-sm-2 control-label">Group name</label>
        <div class="col-sm-10">
            <input type="text" name="groupName" class="form-control" id="edit-template-name" placeholder="New Group Name">
        </div>
    </div>
    <input type="hidden" id="edit-template-id">
    </div>
    <div class="modal-footer">
        <button type="button" class="md-close" data-dismiss="modal">Cancel</button>
        <button type="submit" class="btn btn-primary btn-flat">Save Changes</button>
    </div>
</form>

Jquery

$('#edit-template-form').submit(function (e) {
    e.preventDefault();
    var data = {
        id: $(this).parent().val($(this).data('id')),
        name: $('#edit-template-name').val()
    };
    console.log(data);
    return false;
});

this关键字是指数据对象本身而不是#edit-template-form。因此，在使用变量之前存储变量this，如下所示：

$('#edit-template-form').submit(function (e) {
    e.preventDefault();
    var form = $(this);
    var data = {
        id: form.parent().val(form.data('id')),
        name: $('#edit-template-name').val()
    };
    console.log(data);
    return false;
});
相关文章：