MVCでdrp選択した変更イベントのラベル値を変更する方法

Question

以下のコードがあり、選択したロールのラベルテキストベースを変更したいと思います。

私はラベルのテキストで[管理]を選択した場合たとえば、私は「管理者名」を必要とするなど

私はコードの下に使用しますが、私は働いていません。

<div class="editor-field"> 
    @Html.DropDownListFor(model => model.RoleID, new SelectList(ViewBag.RoleLsit, "Id", "RoleName"), "Select Category", new { onchange = "SelectedIndexChanged()" }) 
</div> 

<div>   
    @Html.LabelFor(model => model.RoleName) 
    @Html.EditorFor(model => model.RoleName) 
    @Html.ValidationMessageFor(model => model.RoleName) 
</div> 


<script type="text/javascript"> 

function SelectedIndexChanged() { 

    var sub = document.getElementsByName("RoleName"); 
    sub.value = "Selected Role Name"; 

} 

おかげ

Answer 1

あなたのjsのは、あなたのビューである場合は、@Html.IdForを使用して要素を見つけることができます。

function SelectedIndexChanged() { 
    //find the label 
    var label = document.querySelector('label[for="@Html.IdFor(m => m.RoleName)"]'); 

    //get the dropDown selected option text 
    var dropDown = document.getElementById("@Html.IdFor(m => m.RoleId)"); 
    var selectedText = dropDown.options[dropDown.selectedIndex].text; 

    //set the label text 
    label.innerHTML=selectedText 

} 

ところで、jQueryを見てみると、「面白い」オプションになる可能性があります。 あなたは、単に、その後、new { onchange = "SelectedIndexChanged()"削除でき

$('#@Html.IdFor(m => m.RoleId)').change(function() { 
    $('label[for="@Html.IdFor(m => m.RoleName)"]').text($(this).children('option:selected').text()); 

}); 

Answer 2

機能のSelectedIndexChanged（）{

document.getElementsById("RoleName").InnerHtml="Role name goes here"; 

} このHTMLヘルパーをレンダリングするときので、あなたは、名前の代わりにIDによって要素を取得使用する必要があります強く型付けされたバインドされた属性は、そのコントロールのIDになります。あなたのケースではロール名はIDになります