TextBox值更改时添加新列
TextBox值更改时添加新列
提问于 2019-10-12 01:10:45
我在MVC视图中有以下ImageUpload文本框字段。
for (int i = 0; i < Model.Count; i++)
{
@Html.TextBox("file", new { type = "file", @class = "form-control" })
}现在，当用户选择一个图像时，我想再添加一列来显示图像的路径。
我尝试了以下代码，但不起作用
<script type="text/javascript">
$(function ()
{
$("#file").on("input", function ()
{ // trigger when you input to textbox
if ($(this).val().length > 0)
{
<td>
@{
@Html.DisplayFor(m => imagePath)
}
</td>
}
}
}
</script>回答 1
Stack Overflow用户
发布于 2019-10-12 03:29:30
这是经过测试的示例，它在新的列中显示文件的名称，出于安全原因，浏览器将无法访问文件路径详细信息，因此您将无法显示路径(至少这是我所知道的，如果您找到什么，请随意附加一个链接)
<table>
<tbody>
@for (int i = 0; i < Model.Count; i++)
{
<tr>
<td>
@*Second parameter is the value field for texbox which is missing in oyur code*@
@Html.TextBox("file", i, new { @type = "file", @class = "form-control" })
</td>
</tr>
}
</tbody>
</table>
<script>
$(".form-control").on("change", function (event) {
var fileName = event.target.files[0].name;
$(this).parent().append('<td>' + fileName + '</td');
});
</script>引用Sam Axe "JavaScript在浏览器中运行，你通过操作DOM在屏幕上引起变化。Razor在服务器上运行并执行代码，或转换代码(通常为文本，如超文本标记语言)。因此，如果您编写用于显示新列的Razor代码，它将无法工作，因为它是在服务器端呈现的。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/58345770
复制相关文章
相似问题
腾讯云开发者
