Hi,
I have an error on returning popup kendo window in javascript call from controller in kendo upload.
The scenario is I have a kendo window main popup where inside of it is kendo upload control.
during processing of uploading and validation of excel file, Im creating error list gathered from excel data
and returning all that lists as popup kendo window from controller (javascript call).
The problem is, the popup kendo window with the list of string is not functioning but returning as javascript file to upload.
I don't know what's the conflict between the main kendo window, kendo upload and the new kendo window that I called as error list window which
is not popping-up.
See my code below...
VIEW:
<script>
$(document).ready(function () {
var iProcess = true;
var dialog = $("#ImportDetails").data("kendoWindow");
dialog.center();
$("#btnImportCancel").kendoButton({
click: function (e) {
dialog.close();
}
});
var lookup = $("#ComboLookupTable").data("kendoComboBox");
$("#files").kendoUpload({
async: {
saveUrl: "Lookup/UploadFile",
removeUrl: "remove",
autoUpload: false,
value: 'Import'
},
localization: {
select: "Select a file",
uploadSelectedFiles: "Import"
},
multiple: false,
select: function (e) {
var kendoWindow = $("<div />").kendoWindow({
title: "Replace Lookup Table Data?",
height: 130,
width: 280,
resizable: false,
modal: true,
animation: {
open: {
effects: "fade:in",
duration: 500
},
close: {
effects: "slide:right fadeOut",
duration: 500
}
},
visible: false
});
kendoWindow.data("kendoWindow")
.content($("#delete-confirmation").html())
.center().open();
kendoWindow
.find(".delete-confirm,.delete-cancel")
.click(function () {
if ($(this).hasClass("delete-cancel")) {
iProcess = false;
e.preventDefault();
kendoWindow.data("kendoWindow").close();
dialog.close();
}
else {
kendoWindow.data("kendoWindow").close();
}
})
},
upload: function (e) {
e.data = { additional: $("#ComboLookupTable").val() };
},
success: function (e) {
var delay = 1500;
setTimeout(function () {
e.preventDefault();
dialog.close();
}, delay);
},
error: function (e) {
var err = e.XMLHttpRequest.responseText;
alert(err);
}
});
});
function showErrorMsgsJson(messages, windowName) {
showErrorMsgs($.parseJSON(messages), windowName);
}
function showErrorMsgs(messages, windowName) {
var results = "";
if (messages.length > 0) {
results += "<ul class='list-group'>";
$.each(messages, function (i, n) {
//results += "<span>" + (i + 1) + ". " + n + "</span><br/>";
results += "<li class='list-group-item'>" + (i + 1) + ". " + n + "</li>";
});
results += "</ul>";
var formattedMessages = '<div style="height:305px; margin: 2px 2px 15px 2px; padding: 10px 10px; border:1px solid lightgray; ">' + results + '</div>'
var closeButton =
'<div style="text-align:center;">' +
' <button id="btnCloseMessages" type="button" class="k-button" onclick="closeWindow(\'' + windowDialog + '\');"> Close </button>' +
'</div>';
$("#" + windowName).data(kendoWindow).content(formattedMessages + closeButton).center().open();
}
}
</script>
from my CONTROLLER:
<HttpPost>
Public Function UploadFile(ByVal files As HttpPostedFileBase, ByVal additional As String) As ActionResult
Dim data = (New ExcelReader()).ReadExcel(files)
For Each datarow In data.DataRows
ent.Add(New ViewModel.FuelEfficiencyViewModel.Create With {.VehicleClass = datarow(0).ToString, _
.FuelEfficiencyValue = If(datarow(1) <> Nothing, Convert.ToDecimal(datarow(1)), 0), _
.CreatedBy = Session(LocalConstant.Ses_UserID), _
.CreatedDate = Now.Date})
Next
'Validation here
Dim _messages As List(Of String) = _fuelefficiencyRepository.ValidateEntity(ent)
If _messages.Count = 0 Then
_fuelefficiencyRepository.Create(ent)
Return Content("")
Else
'THIS IS WHERE THE ERROR OCCUR, new kendo window dialog is not popping-up but js file is occuring.
Return JavaScript("showErrorMsgsJson('" & _messages.ToJSON() & "','windowDialog')")
'NOTE, showGridErrorMsgs is javascript function to call new popup kendo window, see code above
End If
End Function
I hope you could help me on this to pop-up new kendo window. See attached error image.
I have an error on returning popup kendo window in javascript call from controller in kendo upload.
The scenario is I have a kendo window main popup where inside of it is kendo upload control.
during processing of uploading and validation of excel file, Im creating error list gathered from excel data
and returning all that lists as popup kendo window from controller (javascript call).
The problem is, the popup kendo window with the list of string is not functioning but returning as javascript file to upload.
I don't know what's the conflict between the main kendo window, kendo upload and the new kendo window that I called as error list window which
is not popping-up.
See my code below...
VIEW:
<script>
$(document).ready(function () {
var iProcess = true;
var dialog = $("#ImportDetails").data("kendoWindow");
dialog.center();
$("#btnImportCancel").kendoButton({
click: function (e) {
dialog.close();
}
});
var lookup = $("#ComboLookupTable").data("kendoComboBox");
$("#files").kendoUpload({
async: {
saveUrl: "Lookup/UploadFile",
removeUrl: "remove",
autoUpload: false,
value: 'Import'
},
localization: {
select: "Select a file",
uploadSelectedFiles: "Import"
},
multiple: false,
select: function (e) {
var kendoWindow = $("<div />").kendoWindow({
title: "Replace Lookup Table Data?",
height: 130,
width: 280,
resizable: false,
modal: true,
animation: {
open: {
effects: "fade:in",
duration: 500
},
close: {
effects: "slide:right fadeOut",
duration: 500
}
},
visible: false
});
kendoWindow.data("kendoWindow")
.content($("#delete-confirmation").html())
.center().open();
kendoWindow
.find(".delete-confirm,.delete-cancel")
.click(function () {
if ($(this).hasClass("delete-cancel")) {
iProcess = false;
e.preventDefault();
kendoWindow.data("kendoWindow").close();
dialog.close();
}
else {
kendoWindow.data("kendoWindow").close();
}
})
},
upload: function (e) {
e.data = { additional: $("#ComboLookupTable").val() };
},
success: function (e) {
var delay = 1500;
setTimeout(function () {
e.preventDefault();
dialog.close();
}, delay);
},
error: function (e) {
var err = e.XMLHttpRequest.responseText;
alert(err);
}
});
});
function showErrorMsgsJson(messages, windowName) {
showErrorMsgs($.parseJSON(messages), windowName);
}
function showErrorMsgs(messages, windowName) {
var results = "";
if (messages.length > 0) {
results += "<ul class='list-group'>";
$.each(messages, function (i, n) {
//results += "<span>" + (i + 1) + ". " + n + "</span><br/>";
results += "<li class='list-group-item'>" + (i + 1) + ". " + n + "</li>";
});
results += "</ul>";
var formattedMessages = '<div style="height:305px; margin: 2px 2px 15px 2px; padding: 10px 10px; border:1px solid lightgray; ">' + results + '</div>'
var closeButton =
'<div style="text-align:center;">' +
' <button id="btnCloseMessages" type="button" class="k-button" onclick="closeWindow(\'' + windowDialog + '\');"> Close </button>' +
'</div>';
$("#" + windowName).data(kendoWindow).content(formattedMessages + closeButton).center().open();
}
}
</script>
from my CONTROLLER:
<HttpPost>
Public Function UploadFile(ByVal files As HttpPostedFileBase, ByVal additional As String) As ActionResult
Dim data = (New ExcelReader()).ReadExcel(files)
For Each datarow In data.DataRows
ent.Add(New ViewModel.FuelEfficiencyViewModel.Create With {.VehicleClass = datarow(0).ToString, _
.FuelEfficiencyValue = If(datarow(1) <> Nothing, Convert.ToDecimal(datarow(1)), 0), _
.CreatedBy = Session(LocalConstant.Ses_UserID), _
.CreatedDate = Now.Date})
Next
'Validation here
Dim _messages As List(Of String) = _fuelefficiencyRepository.ValidateEntity(ent)
If _messages.Count = 0 Then
_fuelefficiencyRepository.Create(ent)
Return Content("")
Else
'THIS IS WHERE THE ERROR OCCUR, new kendo window dialog is not popping-up but js file is occuring.
Return JavaScript("showErrorMsgsJson('" & _messages.ToJSON() & "','windowDialog')")
'NOTE, showGridErrorMsgs is javascript function to call new popup kendo window, see code above
End If
End Function
I hope you could help me on this to pop-up new kendo window. See attached error image.