show fileupload when checkbox is clicked

Garima Bansal

2y855ASP.NET

I am working in asp.net MVC , i face issue when checkbox is clicked then fileupload shows otherwise not shown

How can i solve this issue?

4 Replies

Know the answer? Post it — somebody with the same question will find it here.

Vishal Joshi2y ago
Accepted answer
Hello Garima,

As it's in foreach loop. it will create duplicate IDs enclcheck for check box control.

I would suggest making it by class instead of id.

Also, you need to handle textboxfor/file upload control hide and show by class name. otherwise, it will work for only a particular ID (i.e. upfile3)

Thanks

Vishal Joshi
0

Garima Bansal2y ago

i used it fro one of the fileupload

but not works.

Actually i have multiple fileupload, below is the code can you help me out

@foreach (var item in Model.ensredetailslist)
{
    
        
            @if (item.ischecked)
            {
                

            }
            else
            {
                
            }
        
        @if (item.ensuretypes == 1)
        {

            
                @item.ensurenames            
                @Html.ActionLink("Fillup", "form1a", "pdfgeneration", new { @id = @item.ensuretypes, @desc = @item.ensurenames, @applnno = @Model.applnno }, htmlAttributes: new { style = "background-color: #5f9ea0; color: #FFF" })
            
        }
        else if (item.ensuretypes == 2)
        {
            
                @item.ensurenames            

                @if (item.ischecked)
                {
                    
                        View     
                        Delete
                    
                }
                else
                {
                    @Html.TextBoxFor(model => model.approveddocument, new { type = "file", name = "files", id = "upfile3" })

                }

                @Html.HiddenFor(model => item.ensuretypes, new { id = "enclotype3" })
                
            
        }
        else if (item.ensuretypes == 3)
        {
            
                @item.ensurenames            

                @if (item.ischecked)
                {
                    
                        View     
                        Delete
                    
                }
                else
                {
                    @Html.TextBoxFor(model => model.approveddocument, new { type = "file", name = "files", id = "upfile7" })

                }
                @Html.HiddenFor(model => item.ensuretypes, new { id = "enclotype7" })
                

            
        }
        else if (item.ensuretypes == 4)
        {
            
                @item.ensurenames            
                @if (item.ischecked)
                {
                        View     
                        Delete
                    
                }
                else
                {
                    @Html.TextBoxFor(model => model.approveddocument, new { type = "file", name = "files", id = "upfile1" })

                }
               
                @Html.HiddenFor(model => model.enclosurenames, new { id = "ensdesc1" })
                @Html.HiddenFor(model => item.ensuretypes, new { id = "enclotype1" })

                
            
        }

Amit Kumar2y ago
Hi Garima,

You can do it using two ways.

1) Server Side

2) Client client (Jquery)

I suggest please go with cleint side.

use this code. It will help you.

suppose your check box is
and file upload is

use below jquery code it will work for you.

$("#isCheck").on('change', function() {
if ($("#isCheck").is(':checked'))
$("#myfile").css("display", "block");
else {
$("#myfile").css("display", "none");
}
});
0
Garima Bansal2y ago
Here is the code
0