Upload not submiting when placed in Kendo Window

2 posts, 0 answers
  1. Elena
    Elena avatar
    6 posts
    Member since:
    Oct 2012

    Posted 06 Nov 2012 Link to this post

    I have a Kendo Upload, that works fine, when placed on the page.
    But when I place it in the Kendo Window, it select files, but the submit does not work.

    Here is the sample code:
    <!DOCTYPE>
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head><title></title><meta HTTP-EQUIV="CACHE-CONTROL" content="NO-CACHE" /><link rel="shortcut icon" href="#" /><link href="Styles/kendo.common.min.css" rel="stylesheet" type="text/css" /><link href="Styles/kendo.default.min.css" rel="stylesheet" type="text/css" />
        <script type="text/javascript" src="Scripts/jquery-1.8.2.min.js"></script>
        <script type="text/javascript" src="Scripts/kendo.web.min.js"></script>
        <script type="text/javascript">
        $(document).ready(function () {
            var window = $("#window");
            if (!window.data("kendoWindow")) {
                window.kendoWindow({
                    width: "350px",
                    title: "File Upload"
                });
            }
            $("#fileUpload").kendoUpload();
            $("#fileUpload1").kendoUpload();
        });
        </script>
    </head>
    <body>
        <form method="post" action="TestPage.aspx" id="form1" enctype="multipart/form-data">
    <div class="aspNetHidden">
    <input type="hidden" name="__VIEWSTATE" id="__VIEWSTATE" value="/wEPDwUKLTU2NzAwMTA3NQ9kFgICAw8WAh4HZW5jdHlwZQUTbXVsdGlwYXJ0L2Zvcm0tZGF0YWRkRF2FJe9qQk/psOU7/27cqENC3FQa7GHlIdCqprbX5OE=" />
    </div>
    <div class="aspNetHidden">
    <input type="hidden" name="__EVENTVALIDATION" id="__EVENTVALIDATION" value="/wEdAAVduTrSFUP8gzeDnFOHumnJceeJO6RlDfckB6avcjnXt/vSeQRRtBIN1u+3s4mXdj6SqBPM9UD7WcfqYssU0cb3zfg78Z8BXhXifTCAVkevd7EjaSByG/FbMlhkMZSAG2utYhE7cAx1EvHHj4GryZaV" />
    </div>
        <div id="window" style="display:none">
        <div class="popup_body">
            <ol>
                <li>
                    <div>
                        <span id="lblSelectFile">Select file</span><br />
                        <input type="file" name="fileUpload" id="fileUpload" />
                   </div>
                </li>
            </ol>
        </div>
        <div class="popup_footer">
            <input type="submit" name="btnPopupOK" value="Submit" id="btnPopupOK" class="button_popup" />  //this is not working
            <input type="submit" name="btnPopupCancel" value="Cancel" onclick="$(&#39;#window&#39;).data(&#39;kendoWindow&#39;).close(); return false;" id="btnPopupCancel" class="button_popup" />
        </div>
    </div>
        <div>
            <input type="submit" name="btnWindow" value="Open Window" onclick="$(&#39;#window&#39;).data(&#39;kendoWindow&#39;).open(); return false;" id="btnWindow" /> <br />


            <input type="file" name="fileUpload1" id="fileUpload1" />
            <input type="submit" name="Button1" value="Submit" id="Button1" class="button_popup" />//this working fine



        </div>
        </form>
    </body>
    </html>

  2. Elena
    Elena avatar
    6 posts
    Member since:
    Oct 2012

    Posted 06 Nov 2012 Link to this post

    Solved.
    By default, Kendo Window is created outside the <form>...</form> tags, so no submit is avalable there.
    Adding appendTo: "#form1" to window initialization makes the window create in form, so submit is working fine.
Back to Top