So ändern Sie Label-Wert auf drp ausgewählt Änderungsereignis in MVC

Question

Ich habe unter Code und ich möchte Etikett Text Basis für ausgewählte Rolle ändern.

Zum Beispiel, wenn ich Admin dann in Etikett Text auswählen muss ich „Admin-Name“ usw.

ich unten Code verwenden, aber ich funktioniert nicht.

<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"; 

} 

Dank

Answer 1

Sie könnten Ihre Elemente mit @Html.IdFor, wenn Ihr js Ihrer Ansicht nach können.

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 

} 

By the way, ein ein jQuery könnte eine "interessante" Option Hinsehen sein. Sie könnten einfach entfernen Sie die new { onchange = "SelectedIndexChanged()", dann

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

}); 

Answer 2

Funktion SelectedIndexChanged() {

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

} Sie von id Element erhalten anstelle des Namens verwenden sollten, weil, wenn Sie diesen html Helfer macht Die stark typisierten gebundenen Attribute werden zur ID dieses Steuerelements. Also in Ihrem Fall Rollenname wird die ID sein