My project is a MVC c# Asp.NET project. I want to check if an attachment has been loaded, if there is an attachment it shows the div that contains the attachment. If there is no attachment, I want to show the div where you can upload an attachment. How to change the Javascript code for this?
My code in the view:
<tr>
<th colspan="1" style="background-color:lightsteelblue">
Attachments:
</th>
<th colspan="11">
<div id="ifAttachment" style="display: none">
<input type="file" name="ImageFile2" />
</div>
<div id="ifNOAttachment" style="display: none">
@{
var Files2 = (ViewBag.Files as string[]);
if (Files2 != null && Files2.Any())
{
foreach (var file in Files2)
{
<br />
@Html.ActionLink(file, "DownloadFile2", new { fileName2 = file })
<br />
}
}
else
{
<label>No File(s) to Download</label>
}
}
</div>
</th>
</tr>
For the Div /JS code:
<script type="text/javascript">
$(function () {
$("#ifAttachment").change(function () {
if ($(this).val() == "Y") {
$("#showsomething").show();
}
});
});
You already have the logic in there to render HTML conditionally. I don't even think you need Javascript for this. You just have to move some divs around.
I like to organize my variables outside my HTML.
@{var Files2 = ViewBag.Files as string[]}
You would then use the if check you already have in your code to conditionally render the HTML elements.
<tr>
<th colspan="1" style="background-color:lightsteelblue">
Attachments:
</th>
<th colspan="11">
@if (Files2 != null && Files2.Any())
{
foreach (var file in Files2)
{
<br />
@Html.ActionLink(file, "DownloadFile2",
new { fileName2 = file })
<br />
}
}
else
{
<label>No File(s) to Download</label>
<div>
<input type="file" name="ImageFile2" />
</div>
}
}
</th>
</tr>
Hopefully that works for you!