<div>
append the field to the formData object before the ajax call:<br />

<pre><code class="code-10 nolinks" id="code-20-42848827-1"><span>...</span>
<span>         for (var i = 0; i &lt; totalFiles; i++) {</span>
<span>           var file = document.getElementById(&quot;imageUploadForm&quot;).files[i];</span>
<span>           formData.append(&quot;imageUploadForm&quot;, file);</span>
<span>         }</span>
<span></span>
<span>         formData.append(&quot;firstname&quot;, $(&quot;#firstname&quot;).val() );</span>
<span></span>
<span>         $.ajax({</span>
<span>           type: &quot;POST&quot;,</span>
<span>           url: '/Home/Upload',</span>
<span>           data: formData,</span>
<span>           dataType: 'json',</span>
<span>           contentType: false,</span>
<span>           processData: false</span>
<span>         }).done(function(data) {</span>
<span>           alert('success');</span>
<span>           console.log(data);</span>
<span>         }).fail(function( xhr, status, errorThrown ) {</span>
<span>             alert('fail');</span>
<span>         });</span>
</code></pre>
</div>


<div>
thanks but how to call each parameter in the mvc controller?
</div>


<div>
I am not a .Net developer, however, I did some searching and here's what I found. &nbsp;You can retrieve the files using:<br />

<pre><code class="code-1 nolinks" id="code-20-42850270-1"><span>HttpPostedFileBase file = Request.Files[i];</span>
</code></pre>
see <a href="http://ajeeshms.in/articles/upload-files-using-ajax-in-asp-net-mvc/" rel="ugc">http://ajeeshms.in/article<wbr />s/upload-f<wbr />iles-using<wbr />-ajax-in-a<wbr />sp-net-mvc<wbr />/</a><br />
<br />
As for the non-file data, try retrieving the values from Request.Form:<br />

<pre><code class="code-1 nolinks" id="code-20-42850270-2"><span>Request.Form(&quot;firstname&quot;)</span>
</code></pre>
</div>


<div>
that won't work to me because it accepts more than 1 files from the upload.<br />
how to append upload file just like the following?<br />
<br />
formData.append(&quot;firstname<wbr />&quot;, $(&quot;#firstname&quot;).val() );
</div>


ITsolutionWizard

<div>
how to call my file on mvc controller?
</div>


<div>
<div class="content wysiwyg-content">
<a href="https://stackoverflow.com/questions/32470906/how-to-upload-a-image-in-asp-net-mvc-using-ajax-request" rel="ugc">https://stackoverflow.com/questions/32470906/how-to-upload-a-image-in-asp-net-mvc-using-ajax-request</a><br />
<br />
I use above codes to upload a file. but if I want to add a parameter from &lt;input type=&quot;text&quot; id=&quot;firstname&quot;&gt; to ajax like below. How can I do that? Basically, I upload the image but I also want to update the database behind.<br />
<br />
<br />
type: &quot;POST&quot;,<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;url: '/Home/Upload',<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;data: formData, document.getelementid(&quot;fir<wbr />stname&quot;).v<wbr />alue,<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;dataType: 'json',<br />
&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;contentType: false,
</div>
</div>


https://stackoverflow.com/questions/32470906/how-to-upload-a-image-in-asp-net-mvc-using-ajax-request

I use above codes to upload a file. but if I want to add a parameter from <input type="text" id="firstname"> to ajax like below. How can I do that? Basically, I upload the image but I also want to update the database behind.


type: "POST",
           url: '/Home/Upload',
           data: formData, document.getelementid("firstname").value,
           dataType: 'json',
           contentType: false,

mvc, ajax upload with data

The successor to Active Server Pages, ASP.NET websites utilize the .NET framework to produce dynamic, data and content-driven web applications and services. ASP.NET code can be written using any .NET supported language. As of 2009, ASP.NET can also apply the Model-View-Controller (MVC) pattern to web applications

ASP.NET

Databases are organized collections of data, most commonly accessed through management systems including schemas, tables, queries and processes that allow users to enter and manipulate the information or utilize it in other fashions, such as with web applications or for reporting purposes.

Databases

Asynchronous JavaScript and XML (AJAX) is a group of interrelated Web development techniques used on the client-side to create asynchronous Web applications. With AJAX, web applications can send data to and retrieve from a server asynchronously (in the background) without interfering with the display and behavior of the existing page. HTML and CSS can be used in combination to mark up and style information. The Document Object Model (DOM) is accessed with JavaScript to dynamically display and allow interaction with the information presented.