Элемент отображения бритвы MVC, который может быть отредактирован javascript

Я работаю со столом, который хотел бы иметь текст на экране, но также иметь этот текст, обновленный javascript.Элемент отображения бритвы MVC, который может быть отредактирован javascript

Я могу создать текстовое поле только для чтения и редактировать javascript, но, скорее всего, у меня есть текст на экране. Вот образец, который имеет DisplayFor, который отображает текст и текстовое поле readonly, которое показывает тот же текст.

@for (var i = 0; i < Model.ProjectSubmissions.Count; i++) 
{ 
    <tr> 
     <td> 
      @Html.DisplayFor(modelItem => Model.ProjectSubmissions[i].ChapterNumber) 
     </td> 
     <td>     
      @Html.TextBox("recordsToSort[" + i + "].ChapterNumber", Model.ProjectSubmissions[i].ChapterNumber, new { @id = "recordsToSort[" + i + "].ChapterNumber", @class = "SortOrder", @readonly = "readonly" }) 
     </td> 
    </tr> 
}

Мой Javacript можно редактировать в текстовом поле, как это:

$(".sortable-table tr").each(function (index, element) { 
    var hiddenInput = $(element).find(".SortOrder").first(); 
    hiddenInput.val(index); 
});

Могу ли я написать JavaScript, который будет обновлять Displayfor? Или я должен использовать другой элемент, чем DisplayFor, который может обновить javascript?

UPDATE:
Я хотел бы закончить с чем-то вроде этого (я хотел бы сохранить скрытый .SortOrder элемент.):

@for (var i = 0; i < Model.ProjectSubmissions.Count; i++) 
{ 
    <tr> 
     <td> 
      <span id="@Html.Id("recordstosort[" + i + "].ChapterNumber")" class="SortOrderDisplay">@Model.ProjectSubmissions[i].ChapterNumber</span> 
      @Html.Hidden("recordsToSort[" + i + "].ChapterNumber", Model.ProjectSubmissions[i].ChapterNumber, new { @id = "recordsToSort[" + i + "].ChapterNumber", @class = "SortOrder" }) 
     </td> 
    </tr> 
}

И JavaScript, как это:

$(".sortable-table tr").each(function (index, element) { 
    var hiddenInput = $(element).find(".SortOrder").first(); 
    hiddenInput.val(index); 

    var displayInput = $(element).find(".SortOrderDisplay").first(); 
    if (displayInput !== 'undefined') { 
     displayInput.text = index; 
    } 
});

Но это не работает.

источник

2016-02-17 M Kenyon II

'displayFor' только бритвой помощник, который будет генерировать HTML из шаблона перед отправкой в браузер. После загрузки страницы в браузере вы можете изменить этот HTML-код с помощью JavaScript, независимо от того, как он был сгенерирован. – wf4

Вы можете использовать текст jQuery вместо val.

@for (var i = 0; i < Model.ProjectSubmissions.Count; i++) 
{ 
<tr> 
    <td class="SortOrder"> 
     @Html.DisplayFor(modelItem => Model.ProjectSubmissions[i].ChapterNumber) 
    </td> 
</tr> 
}

Тогда Javascript будет

$(".sortable-table tr").each(function (index, element) { 
    var hiddenInput = $(element).find(".SortOrder").first(); 
    hiddenInput.text(index); 
});

источник

2016-02-17 15:55:38 scoon1329

Хорошо, это может сработать, но у меня все еще есть проблемы. Я обновил код в своем основном сообщении, но он работает неправильно. –

текст - это функция, такая как val, поэтому замените «displayInput.text = index;» с "displayInput.text (index);" – scoon1329

Javascript может использоваться, чтобы обновить любой элемент, который вам нравится. Самый простой способ - создать диапазон с свойством id, а затем использовать document.getElementById.innerText для установки текста.

Вы можете легко заменить @Html.DisplayFor на <span id="@Html.IdFor(m => m.ProjectSubmissions[i].ChapterNumber)"></span>.

Это только пример, и есть несколько способов изменить текстовую клиентскую сторону.

источник

2016-02-17 15:49:14 MartijnK

Элемент отображения бритвы MVC, который может быть отредактирован javascript

ответ

Смежные вопросы