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="$('#window').data('kendoWindow').close(); return false;" id="btnPopupCancel" class="button_popup" />
</div>
</div>
<div>
<input type="submit" name="btnWindow" value="Open Window" onclick="$('#window').data('kendoWindow').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>
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="$('#window').data('kendoWindow').close(); return false;" id="btnPopupCancel" class="button_popup" />
</div>
</div>
<div>
<input type="submit" name="btnWindow" value="Open Window" onclick="$('#window').data('kendoWindow').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>
1 Answer, 1 is accepted
0
Elena
Top achievements
Rank 1
Rank 1
answered on 06 Nov 2012, 12:41 PM
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.
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.