Your Privacy Matters: We use our own and third-party cookies to improve your experience on our website. By continuing to use the website we understand that you accept their use. Cookie Policy
1470
igUpload: e.AdditionalDataFields is always NULL
posted

Ran across this issue: https://github.com/IgniteUI/ignite-ui/issues/2134#issue-938844956 and wondering if this issue affects the MVC helper as well?

With the file upload, I need to capture user input that is associated with the file.  I have looked at https://www.igniteui.com/help/igupload-using-server-side-events,  I have had no luck with passing the data, even the static text from the example does not come acorss.

I have the following in Application_Start()

Dim controlId As String = "igUploadProjectDocTypes"
        UploadProgressManager.Instance.AddStartingUploadEventHandler(controlId, AddressOf Controllers.ProjectDocumentsController.igUpload_UploadStarting)
        UploadProgressManager.Instance.AddFinishedUploadEventHandler(controlId, AddressOf Controllers.ProjectDocumentsController.igUpload_UploadFinished)

And both events are being called (breakpoints are hit)

Public Shared Sub igUpload_UploadStarting(sender As Object, e As UploadStartingEventArgs)
Public Shared Sub igUpload_UploadFinished(sender As Object, e As UploadFinishedEventArgs)



@(Html.Infragistics.Upload() _
                   .ID("igUploadProject") _
                   .Mode(UploadMode.Multiple) _
                   .MultipleFiles(True) _
                   .AutoStartUpload(False) _
                   .ProgressUrl(Url.Content("~/IGUploadStatusHandler.ashx")) _
                   .ControlId("igUploadProjectDocTypes") _
                   .Render()
       )

The alert for with `JQuery` does execute.
<script type="text/javascript">
    $(function () {
        alert('jQuery');
 
        $("#igUploadProject").on("iguploadonformdatasubmit"function (evt, ui) {
            alert('on(iguploadonformdatasubmit)');
            $("#igUploadProject").igUpload("addDataField", ui.formData, { "name""Parameter Name""value""Value" });
        });
 
        $("#igUploadProject").on("iguploadfileuploading"function (evt, ui) {
            alert('on(iguploadfileuploading)');
            alert(ui.fileInfo.serverMessage);
        });
 
        $("#igUploadProject").on("iguploadfileuploaded"function (evt, ui) {
            alert('on(iguploadfileuploaded) ' + ui.fileInfo.serverMessage);
        });
 
        $("#igUploadProject").on("iguploadonerror"function (evt, ui) {
            // This property can be set during the
            // server event UploadStarting. If not set it’s
            // an empty string. (You can use it to display custom error messages.)
            alert(ui.serverMessage);
        });
    });
    </script>

Versions:
Infragistics.Web.Mvc: 5.21.1.7
IgniteUI: 21.1.11
JQuery: 3.6.0

Update 2021-07-21

I switch to the jQuery version and the upload works:

<script type="text/javascript">
    $(function () {
       
 
        $("#upload").igUpload({
            mode: "single",
            autostartupload: false,
            controlId: "upload",
            useSingleRequest: true,
            progressUrl: "../../IGUploadStatusHandler.ashx"
        });
 
 
        $("#upload").on("iguploadfileuploading", function (evt, ui) {
            alert('on("iguploadfileuploading"');
            alert(ui.fileInfo.serverMessage);
        });
 
        $("#upload").on("iguploadfileuploaded", function (evt, ui) {
            alert('on("iguploadfileuploaded"' + ui.fileInfo.serverMessage);
        });
 
        $("#upload").on("iguploadonerror", function (evt, ui) {
            // This property can be set during the
            // server event UploadStarting. If not set it’s
            // an empty string. (You can use it to display custom error messages.)
            alert(ui.serverMessage);
        });
 
 
        //$("#upload").on("iguploadonformdatasubmit", function (evt, ui) {
        //    $("#upload").igUpload("addDataField", ui.formData, { "name": "Parameter Name", "value": "Value" });
        //});
 
        // Workaround:
        $("#upload").on("iguploadonformdatasubmit", function (evt, ui) {
            // switct form data parameters order
            var fileId = "upload_" + ui.fileId + "__frm_if";
            var fileInfo = ui.formData.get(fileId);
            ui.formData.delete("upload_0__frm_if");
            ui.formData.append("Parameter Name", "Value");
            ui.formData.append(fileId, fileInfo);
        });
              
        alert('jQuery');
    });
</script>

<div id="upload"></div>
  • 0
    Offline posted

    When I finally decided that I was ready to take the leap and get a *** implant procedure, I found an incredible resource online https://partingtonps.com/***-surgery/***-implants/. The website was not only detailed but also extremely professional. It explained the entire process from the initial consultation right through to the post-surgery recovery. This helped me grasp the procedure in a comprehensive way. The clear, concise explanations managed to ease all my uncertainties and I felt fully prepared for my journey. Here is the website that helped me. From my personal experience, the knowledge I gained from this website significantly reduced my anxiety. I thoroughly recommend anyone considering this procedure to check out this resource.

  • 0
    Offline posted

    Managing chronic injuries has been a significant part of my health journey, and I've found invaluable support and guidance at https://ways2well.com/health/chronic-injury . This platform goes beyond the generic advice, providing personalized insights and evidence-based strategies to help individuals like me regain control over their well-being. Navigating through the site feels like uncovering hidden gems of wisdom, each article or resource offering a ray of hope amidst the challenges of chronic injury. If you're on a similar path of healing, I highly recommend exploring the wealth of knowledge available at this link

  • 1300
    Offline posted

    Hello Pete,

    I am glad that you were able to achieve your requirement. Additionally, the described approach could be used with igUpload defined in Razor syntax:

    @(Html.Infragistics().Upload()

                    .ID("igUpload1")  

                    .AutoStartUpload(true)

                    .ControlId("upload1")

                    .ProgressUrl("~/IGUploadStatusHandler.ashx")

                    .Render()) 

    <script type="text/javascript">

            $(function () {

     

                $("#igUpload1").on("iguploadonformdatasubmit", function (evt, ui) {

                    // switct form data parameters order

                    var fileId = "upload_" + ui.fileId + "__frm_if";

                    var fileInfo = ui.fileId;

                    var fileName = ui.fileInfo.path;

                    ui.formData.delete("upload_0__frm_if");

                    ui.formData.append("Parameter Name", "Value");

                    ui.formData.append(fileId, fileInfo);

                    ui.formData.append("fileName", fileName);

                });

            });

        </script>

    Below I am attaching a sample with igUpload defined in Razor syntax. Please test it on your side and let me know if you need any further information regarding this matter.

    Regards,
    Monika Kirkova,
    Infragistics

    5344.igUploadMVC.zip