我们正在尝试为我的 MVC3 应用程序制作一个 SVG 生成的单选按钮控件。理想情况下,控件将是一个局部视图,我们将传入一个模型,该模型将包含有关如何使用 Razor 生成 SVG 的数据。
我们尝试将 SVG 正常写入 Razor,但除了编译错误,我们什么也得不到。
我们如何使用 MVC3 Razor 生成 SVG?
错误是:Expression Must Return a Value To Render
编辑:错误不是来自局部视图,但是当我们调用 @Html.RenderPartial("SvgRadioButtonControl", ((IResponseLabeledItem)Model).ResponseOptions) 时,它会给出错误。
@using SmartQWeb.Models.Entities
@model IEnumerable<ResponseOption>
<svg
xmlns:svg="http://www.w3.org/2000/svg"
xmlns="http://www.w3.org/2000/svg"
version="1.1"
width="300"
height="400"
id="radio">
<script type="application/ecmascript"><![CDATA[
var innerCircleExpandedSize = 11;
function ResponseOptionClicked(evt) {
console.log('Response option clicked');
// Remove circle in enabled element
var enabledElem = document.getElementsByClassName('enabled')[0];
if (enabledElem != undefined) {
console.log('Removing a inner circle');
enabledElem.getElementsByClassName('response-innercircle')[0].setAttribute('r', 0);
enabledElem.className.baseVal = enabledElem.className.baseVal.replace('enabled', 'disabled')
}
// Add circle in radio button
console.log('Adding a inner circle');
evt.currentTarget.getElementsByClassName('response-innercircle')[0].setAttribute('r', innerCircleExpandedSize);
evt.currentTarget.className.baseVal = evt.currentTarget.className.baseVal.replace('disabled', 'enabled');
}
]]></script>
<g id="base">
@{
int iteration = 1;
}
@foreach (ResponseOption option in Model)
{
<g id="response-never" class="response-option disabled" transform="translate(50,@{ (iteration++ * 1).ToString(); })" onclick="ResponseOptionClicked(evt)" fill="#ffffff">
<circle class="response-outercircle" r="18" stroke="#000000" stroke-width="3" stroke-miterlimit="4" stroke-opacity="1" stroke-dasharray="none" />
<circle class="response-innercircle" r="0" fill="#000000" stroke="#000000" />
<text x="40" y="6.5" font-size="1.5em" fill="blue" class="response-text">@option.Label</text>
</g>
}
</g>
</svg>