Hi,
Using asp.net mvc4 razor with latest kendoUI scripts.
Kendo CDN scripts are all referenced in master layout
On a View I have a link to another view. I have wired up this link to open a jquery dialog instead. The $.get method runs the controller ActionResult which, for ajax, returns a partialview(model). This works fine. Dialog is rendered, view content shown ok.
Issue: When the dialog is opened, the Upload widget is not rendered. Only basic html file input is rendered.
In the source, there is no kendoUI markup (I saw a previous issue surrounding z-index) only the html file input tag.
Controller/Action:
View
screenshot:
http://prntscr.com/1007bl
If I skip the jQuery dialog and open the view completely, the Upload renders as normal.
Thinking along the lines of the kendo scripts are not referenced in the dialog as the html input is not being kendo'd or jQueryUI is stopping it.
Any help appreciated.
Thanks.
Using asp.net mvc4 razor with latest kendoUI scripts.
Kendo CDN scripts are all referenced in master layout
On a View I have a link to another view. I have wired up this link to open a jquery dialog instead. The $.get method runs the controller ActionResult which, for ajax, returns a partialview(model). This works fine. Dialog is rendered, view content shown ok.
Issue: When the dialog is opened, the Upload widget is not rendered. Only basic html file input is rendered.
In the source, there is no kendoUI markup (I saw a previous issue surrounding z-index) only the html file input tag.
Controller/Action:
public
ActionResult EditQuestion(
int
id = 0)
{
Question question = db.Questions.Find(id);
if
(question ==
null
)
{
return
HttpNotFound();
}
if
(Request.IsAjaxRequest()) {
return
PartialView(question);
}
return
View(question);
}
01.
@model MvcWebRole1.Models.Question
02.
@{
03.
ViewBag.Title = "EditQuestion";
04.
}
05.
@using (Html.BeginForm())
06.
{
07.
@Html.AntiForgeryToken()
08.
@Html.ValidationSummary(true)
09.
@Html.HiddenFor(model => model.QuestionID)
10.
@Html.HiddenFor(model => model.ID)
11.
12.
<
div
class
=
"editor-label"
>
13.
@Html.LabelFor(model => model.QuestionText, "Enter the question text")
14.
</
div
>
15.
<
div
class
=
"editor-field"
>
16.
@Html.EditorFor(model => model.QuestionText)
17.
@Html.ValidationMessageFor(model => model.QuestionText)
18.
</
div
>
19.
20.
<
div
class
=
"editor-label"
>
21.
@Html.LabelFor(model => model.QuestionMediaUrl, "Upload Media")
22.
</
div
>
23.
<
div
class
=
"editor-field"
>
24.
@(Html.Kendo().Upload()
25.
.Name("files")
26.
.Async(a => a
27.
.Save("EditGameUploadMedia", "Engage")
28.
.Remove("EditGameRemoveMedia", "Engage")
29.
.AutoUpload(true)
30.
)
31.
.Events(events => events
32.
.Success("onSuccess")
33.
)
34.
)
35.
<
br
/>
36.
@Html.EditorFor(model => model.QuestionMediaUrl)
37.
</
div
>
38.
39.
<
script
>
40.
function onSuccess(e) {
41.
var Response = e.response;
42.
$("#QuestionMediaUrl").val(Response.st);
43.
}
44.
</
script
>
45.
<
p
>
46.
<
hr
/>
47.
<
input
type
=
"submit"
value
=
"Save & Return"
/>
48.
</
p
>
49.
}
50.
51.
@section Scripts {
52.
@Scripts.Render("~/bundles/jqueryval")
53.
}
54.
55.
<
div
id
=
"dialog"
title
=
"Title"
></
div
>
56.
<
script
>
57.
$(document).ready(function () {
58.
$(function () {
59.
$('.modallink').click(function (e) {
60.
console.log("in");
61.
$.get($(this).prop('href'), function (response) {
62.
$("#dialog").html(response);
63.
$("#dialog").dialog({
64.
height: 400,
65.
width: 650,
66.
modal: true,
67.
buttons: {
68.
Cancel: function () {
69.
$(this).dialog("close");
70.
}
71.
}
72.
});
73.
});
74.
e.preventDefault(); // don't let it continue on
75.
return false;
76.
});
77.
});
78.
});
79.
</
script
>
screenshot:
http://prntscr.com/1007bl
If I skip the jQuery dialog and open the view completely, the Upload renders as normal.
Thinking along the lines of the kendo scripts are not referenced in the dialog as the html input is not being kendo'd or jQueryUI is stopping it.
Any help appreciated.
Thanks.