子要素を選択するjquery

Question

セットアップ。

私はMVC 5を使用しており、ビューモデルの形式で送信されたデータを含むビューを作成しました。

このビューでは、以下のように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"]) 

UPDATEを使用して

私が間違ったインデックスを見ていたことを示唆していたコードのバグを修正しました。

また、RemoveItem（000001）の削除ボタンをクリックすると、object_0__RecordChangedの値を更新しようとしています。

Answer 1

インデックスモデルをインデックスプロパティに変更しました。次に、foreachループ内でHTML.EditorForを配置して、レンダリングされる前にインデックスプロパティを設定できるようにしました。

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(); 
} 

はるかに簡単

は、その後のコードを変更しました！