Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

368
Views
How to create Jquery FileUpload with ASP.NET C# included CRUD (not MVC)

Hi I have saw a lot of documents on the google search and found many pages to discuss php / python (like jQuery File Upload Demo) etc.. However I didn't see anything about ASP.NET for C# or VB(not MVC),so anyone can help me to give me any slim clue, Hopefully give me full example code or reference URL that it is included CRUD, by the way I will be continuing search and try to deal with this issue

Ps: CRUD means to create/read/update/delete

I have tried this sample but I had get some error messages as following pictures

Console
enter image description here

NetWork
enter image description here

over 4 years ago · Santiago Trujillo
3 answers
Answer question

0

Let's establish a common understanding.

  • CRUD = create read update delete
  • jquery fileupload -> file upload

Not sure what kind of CRUD operation do you require from jquery fileupload. Can you elaborate further on your requirement?

If you want some reference on how to use the plugin, perhaps this tutorial here - aspnet web form and jquery file upload will help.

Hope this helps.

over 4 years ago · Santiago Trujillo Report

0

You can use this code for C# ASP.NET

JS Function

function SaveFiles() {

        var fileInput = document.getElementById('fileInput');
        var file = $("#fileInput").val();

        if (file.length > 0) {
            var fd = new FormData();
            var xhr = new XMLHttpRequest();
            xhr.open('POST', '/Admin/UploadImage');
            xhr.setRequestHeader('Content-type', 'multipart/form-data');

            //Appending file information in Http headers
            xhr.setRequestHeader('X-File-Name', fileInput.files[0].name);
            xhr.setRequestHeader('X-File-Type', fileInput.files[0].type);
            xhr.setRequestHeader('X-File-Size', fileInput.files[0].size);
            xhr.setRequestHeader['X-File-FileName', 1];
            xhr.setRequestHeader['X-File-Id', id];

            //Sending file in XMLHttpRequest
            xhr.send(fileInput.files[0]);
            xhr.onreadystatechange = function (data) {

                if (xhr.readyState == 4 && xhr.status == 200) {

                    alert("Image Uploaded Successfully...");

                }
            }
        }
    }

C# Code

public JsonResult UploadImage()
        {
            string fileName = Request.Headers["X-File-Name"];
            string fileType = Request.Headers["X-File-Type"];
            int fileSize = Convert.ToInt32(Request.Headers["X-File-Size"]);

            System.IO.Stream fileContent = Request.InputStream;
            System.IO.FileStream fileStream = System.IO.File.Create(Server.MapPath("~/UploadImg/" + fileName));
            fileContent.Seek(0, System.IO.SeekOrigin.Begin);

            //Copying file's content to FileStream
            fileContent.CopyTo(fileStream);
            fileStream.Dispose();

            string FileName = Server.MapPath("~/UploadImg/" + fileName);

            //Here you can code for insert in database

            return Json(FileName);
        }
over 4 years ago · Santiago Trujillo Report

0

I have found my question and I've tried to fix my problem as following steps.
1. To modify url at the main.js

$(function () { 
    'use strict';
    // Initialize the jQuery File Upload widget:
    $('#fileupload').fileupload({
        url: 'server/******/'   // to your cs location
    });

2.To check all Css and JQuery that are address is okay to get script

over 4 years ago · Santiago Trujillo Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!