Question

设置。

我正在使用MVC 5，我创建了一个以viewmodel形式发送数据的视图。

在此视图中，我将List对象渲染为堆叠div，如下所示。

正如您将看到的，我正在显示隐藏字段，以便viewModel在提交时将数据发送回控制器。

<div class="row item-row">
    <div class="small-4 columns">
        objType
    </div>
    <div class="small-6 columns">
        <input id="object_0__Id" name="object[0].Id" type="hidden" value="999999">
        <input id="object_0__Reference" name="object[0].Reference" type="hidden" value="myRef">myRef
        <input id="object_0__RecordChanged" name="object[0].RecordChanged" type="hidden" value="NoChange">
    </div>
    <div class="small-2 columns remove-item">
        <button class="button tiny expand centre button-gray" onclick="javascript: RemoveItem(999999);">Remove</button>
    </div>
</div>
<div class="row item-row">
    <div class="small-4 columns">
        objType
    </div>
    <div class="small-6 columns">
        <input id="object_1__Id" name="object[1].Id" type="hidden" value="000001">
        <input id="object_1__Reference" name="object[1].Reference" type="hidden" value="myRef">myRef
        <input id="object_1__RecordChanged" name="object[1].RecordChanged" type="hidden" value="NoChange">
    </div>
    <div class="small-2 columns remove-item">
        <button class="button tiny expand centre button-gray" onclick="javascript: RemoveItem(000001);">Remove</button>
    </div>
</div>

好的，所以javascript函数RemoveItem是：

function RemoveItem(id)
{
    event.preventDefault();

    var element = $(event.target).closest('.item-row');

    $(element).closest('DeedReference_0__RecordChanged').val('Deleted');   ***** This is what I am trying to do.

    $(element).hide();
}

从上面看，当我点击说RemoveItem（00001）时，变量元素包含以下内容：

<div class="small-4 columns">
    objType
</div>
<div class="small-6 columns">
    <input id="object_0__Id" name="object[0].Id" type="hidden" value="000001">
    <input id="object_0__Reference" name="object[0].Reference" type="hidden" value="myRef">myRef
    <input id="object_0__RecordChanged" name="object[0].RecordChanged" type="hidden" value="NoChange">
</div>
<div class="small-2 columns remove-item">
    <button class="button tiny expand centre button-gray" onclick="javascript: RemoveItem(000001);">Remove</button>
</div>

我需要更新的值是object [0] .RecordChanged，但此时此刻，我不知道索引值。所以我打算在选择器上使用两端，但是无法让它工作。

我到目前为止：

$(event.target).closest('.item-row').children()[1]

但是这给了我div，因为我尝试过：

$(event.target).closest('.item-row').children()[1].Find('Id*"__RecordChanged"')
$(event.target).closest('.item-row [id*="RecordChanged"]')
$(event.target).closest('.item-row:[id*="RecordChanged"])

使用变量

$(element [id*="RecordChanged"])
$(element [id$="RecordChanged"])

更新

修正了代码中的错误，表明我正在查看错误的索引。

此外，如果我单击RemoveItem（000001）的删除按钮，我正在尝试更新值object_0__RecordChanged。

Answer 1

将视图模型更改为具有索引属性。然后更改将HTML.EditorFor置于foreach循环中，使我能够在渲染之前填充index属性。

然后代码改为：

function RemoveItem(id)
{
    event.preventDefault();

    var element = $(event.target).closest('.item-row');

    $(element).closest('DeedReference_0__RecordChanged').val('Deleted');   ***** This is what I am trying to do.

    $(element).hide();
}

为：

function RemoveItem(id)
{
    event.preventDefault();
    var recordChanged = '#object_' + id + '__RecordChanged';
    $(recordChanged).val('Deleted');
    var element = $(event.target).closest('.item-row');
    $(element).hide();
}

更简单！

jquery选择子元素

1 个答案: