Как загрузить частичное представление и сохранить его в переменной для использования в javascript?

Question

У меня есть prtialview, использующий модель для создания выпадающего списка. В моем главном представлении я создаю строку HTML с частичным представлением, чтобы позже использовать ее в функциях javascript.

Посмотреть:

@model SomeViewModel
@{ 
var devicesDropDown = @Html.Partial("_DropDown", (SelectList)(Model.DeviceTypes));
var devicesHtmlDropDown = MvcHtmlString.Create(devicesDropDown.ToString());
}

Но когда я хочу использовать его в javascript таким образом, это похоже на несвязанную строку, которая вызывает ошибку функции javascript.

Функция Js в нижней части страницы:

<script type="text/javascript">
   function format(d) {
       var ddl = '@( devicesHtmlDropDown)';
       return ddl;
   }
</script>

Вот как выглядит строка во время выполнения:

 var ddl = '<select class="form-control input" id="SelectedValue"  name="SelectedValue" style="width: 100%">
<option selected="selected" value="456413">1</option>
<option value="564655465">2</option>
</select>
';

Как я должен отформатировать эту строку, чтобы можно было визуализировать как статический объект HTML. И как я могу получить выбранное значение этого раскрывающегося списка для публикации в действии? Должен ли я использовать TagBuilder?

Answer 1

Мое предложение будет использовать блок скрипта для хранения вашего шаблона. Вы можете легко получить HTML оттуда по идентификатору. Блок скрипта никогда не будет отображаться напрямую, поэтому он надежно скрыт, пока вы не извлечете и не примените HTML.

<script id="ddlTemplate" type="text/html">
    @Html.Partial("_DropDown", (SelectList)(Model.DeviceTypes))
</script>

Затем, позже, вы можете получить доступ к этому HTML, как это (используя jQuery)

var template = $('#ddlTemplate').html();