У меня есть форма для того, чтобы люди вводили имя пользователя, если имя пользователя принято, оно даст им 3 варианта альтернатив с соседними с ними переключателями. Я пытаюсь иметь функцию onclick, которая примет соответствующий переключатель, и поместит значение этого в текстовое поле. Я использую ASP.NET MVC 3. Вот представление, с которым я работаю:
@{
ViewBag.Title = "ChangeUsername";
}
<script type="text/javascript">
function setText(target) {
var txt = document.getElementById(target);
var temp = txt.value;
var tf = document.getElementById("uName_change");
tf.value = temp;
}
</script>
@using (Ajax.BeginForm("ChangeUsername", "User", new AjaxOptions() { InsertionMode = InsertionMode.Replace, UpdateTargetId = "change_name" }, new { uniqueUserId = @Model.UserGuid }))
{
<div class="form_section">
<h3>Update Username:
</h3>
<div class="form_item">
<div class="frm_label">
<label for="username">
@AdminResource.CurrentUserName
</label>
</div>
<div class="item">
<p>@Model.UserName</p>
</div>
</div>
<div class="form_item">
<div class="frm_label">
<label for="username">
@AdminResource.UserName
</label>
</div>
<div class="item">
@Html.EditorFor(model => model.NewUsername, new { id = "uName_change" }) @Html.ValidationMessageFor(model => model.NewUsername)
@if (Model.AlternateUsernames != null && Model.AlternateUsernames.Count() != 0)
{
<p>
<strong>Suggested usernames:</strong><br />
@foreach (var username in Model.AlternateUsernames)
{
<input type="radio" name="un" id="un_Change" value="@username" onclick="setText(target);" />@username<br />
}
</p>
}
</div>
</div>
<div class="form_item">
<div class="frm_label">
<label for="password">
</label>
</div>
<div class="item">
<input type="submit" name="submit" value="Update Username" class="btn_primary" />
</div>
</div>
</div>
@Html.HiddenFor(model => model.UserGuid)
@Html.HiddenFor(model => model.UserName)
}
Все работает так, как должно, за исключением части javascript, чтобы добавить значение альтернатив текстовому полю. Что я делаю неправильно на javascript? Или это факт, что "AlternateUsernames" - это элемент списка?
Если я правильно понял,
передайте this
функции, чтобы идентифицировать выбранное радио следующим образом
<input type="radio" name="un" id="un_Change" value="@username" onclick="setText(this);" />@username<br />
И измените функцию
function setText(radio) {
var txt = document.getElementById('target'); // where target is the id of the text field in which you want to display the selected option
txt.value= radio.value;
}
Примечание: вы установили id
для переключателей внутри цикла, что делает ваш HTML недействительным.
target
замените его идентификатором текстового поля, в котором вы хотите отобразить выбранный параметр.