|
|
When I run the code by itself(Index.cshtml), I don't get an error and everything works but when I try to make it a partial view in my details.cshtml page with
Html.RenderAction("Index", "FileUpload"); I get $(...).fileupload is not a function.
Code:Index.cshtml
@{
Layout = null;
}
<!DOCTYPE html>
<html>
<head>
<meta name="viewport" content="width=device-width" />
<title>index</title>
<link href="~/Content/FileUpload/FileUpload.css" rel="stylesheet" />
</head>
<body>
<div class="upload">
<div>
<form id="upload" method="post" action="/FileUpload/UploadFiles" enctype="multipart/form-data">
<div id="drop">
<a>Upload File</a>
<input type="file" name="upl" multiple id="fileuploader" />
</div>
<ul>
<!-- The file uploads will be shown here -->
</ul>
</form>
<script src="~/Scripts/jquery-3.1.0.min.js"></script>
<!-- JavaScript Includes -->
@*<script src="~/Scripts/jquery.knob.js"></script>*@
<script src="~/Scripts/FileUpload/jquery.knob.js"></script>
<!-- JavaScript Includes -->
<!-- jQuery File Upload Dependencies -->
@*<script src="~/Scripts/jquery.ui.widget.js"></script>*@
<script src="~/Scripts/FileUpload/jquery.ui.widget.js"></script>
@*<script src="~/Scripts/jquery.iframe-transport.js"></script>*@
<script src="~/Scripts/FileUpload/jquery.iframe-transport.js"></script>
@*<script src="~/Scripts/jquery.fileupload.js"></script>*@
<script src="~/Scripts/FileUpload/jquery.fileupload.js"></script>
<!-- jQuery File Upload Dependencies -->
<!-- Main JavaScript file -->
@*<script src="~/Scripts/script.js"></script>*@
<script src="~/Scripts/script.js"></script>
<!-- Main JavaScript file -->
</div>
</div>
</body>
</html>
Controller:
public class FileUploadController : Controller
{
[ChildActionOnly]
public ActionResult Index()
{
return PartialView();
}
[HttpPost]
public void UploadFiles()
{
if (Request.Files?.Count > 0)
{
var filesCount = Request.Files.Count;
for (int i = 0; i < filesCount; i++)
{
var file = Request.Files[i];
var fileName = Path.GetFileName(file.FileName);
var path = Path.Combine(Server.MapPath("~/Uploads/"), fileName);
file.SaveAs(path);
}
}
}
Code:Details.cshtml
@{.
.
Html.RenderAction("Index", "FileUpload");
}
|
|
|
|
|
Quote: everything works but when I try to make it a partial view Maybe your partial view does not load the scripts that are needed to be there for that fileupload to be defined. Check your browser console to see the actual error, most probably, inside the partial view you need to import the JavaScript for the fileupload component and then call the $(...).fileupload() .
This line to be precise,
<script src="~/Scripts/FileUpload/jquery.fileupload.js"></script> If you are sure that you have called this script and it is a part of the DOM, and still this error comes, please share the browser console logs so that we can look into them. You can capture that using F12 and then visiting console (if some other tab is selected).
The sh*t I complain about
It's like there ain't a cloud in the sky and it's raining out - Eminem
~! Firewall !~
|
|
|
|
|
This is the error that I am receiving :
jquery-3.1.0.min.js:2 Uncaught TypeError: $(...).fileupload is not a function
at HTMLDocument.<anonymous> (script.js:12)
at j (jquery-3.1.0.min.js:2)
at k (jquery-3.1.0.min.js:2)
|
|
|
|
|
Can you show the content of your script.js file? The problem comes somewhere from there,
<script src="~/Scripts/script.js"></script> Somewhere at line 12, there is a call to the fileupload function and you can need to make sure that your fileupload script is loaded before line 12 (anywhere!).
One thing that is still bugging me is that why is jquery-3.1.0.min.js in this entire trace. Maybe you are causing a circular (or duplicate) script being loaded. Please verify that each script is loaded only one, and in a correct layout—like your normal view is working out, because this problem comes only in the partial view.
For example, see here for some more insights on the same problem: jQuery-File-Upload - TypeError: $(...).fileupload is not a function - Stack Overflow
The sh*t I complain about
It's like there ain't a cloud in the sky and it's raining out - Eminem
~! Firewall !~
|
|
|
|
|
Here is the scripts.js file., also how are you identifying that jquery-3.1.0.min.js in this entire trace, I'm just passing the script
<script src="~/Scripts/jquery-3.1.0.min.js"></script>
in the Index.cshtml file which is the view that I am calling in my Details.cshtml.
script.js:
$(document).ready(function () {
var ul = $('#upload ul');
$('#drop a').click(function () {
$(this).parent().find('input').click();
});
$('#upload').fileupload({
dropZone: $('#drop'),
add: function (e, data) {
var tpl = $('<li class="working"><input type="text" value="0" data-width="48" data-height="48"' +
' data-fgColor="#0788a5" data-readOnly="1" data-bgColor="#3e4043" /><p></p><span></span></li>');
tpl.find('p').text(data.files[0].name)
.append('' + formatFileSize(data.files[0].size) + '');
data.context = tpl.appendTo(ul);
tpl.find('input').knob();
tpl.find('span').click(function () {
if (tpl.hasClass('working')) {
jqXHR.abort();
}
tpl.fadeOut(function () {
tpl.remove();
});
});
var jqXHR = data.submit();
},
progress: function (e, data) {
var progress = parseInt(data.loaded / data.total * 100, 10);
data.context.find('input').val(progress).change();
if (progress == 100) {
data.context.removeClass('working');
}
},
fail: function (e, data) {
data.context.addClass('error');
}
});
$(document).on('drop dragover', function (e) {
e.preventDefault();
});
function formatFileSize(bytes) {
if (typeof bytes !== 'number') {
return '';
}
if (bytes >= 1000000000) {
return (bytes / 1000000000).toFixed(2) + ' GB';
}
if (bytes >= 1000000) {
return (bytes / 1000000).toFixed(2) + ' MB';
}
return (bytes / 1000).toFixed(2) + ' KB';
}
});
modified 30-Jul-19 15:35pm.
|
|
|
|
|
Hmmm, this looks fine. Just make sure that this partial view is loaded after you have loaded the script. Maybe bring all the scripts up to the top of the body element or at least before this partial view loading.
The sh*t I complain about
It's like there ain't a cloud in the sky and it's raining out - Eminem
~! Firewall !~
|
|
|
|
|
That didn't fix the issue.
|
|
|
|
|
The problem only appears in partial view, right? Not if you keep everything inside the same view.
The sh*t I complain about
It's like there ain't a cloud in the sky and it's raining out - Eminem
~! Firewall !~
|
|
|
|
|
I was able to figure out the issue,Thanks.
|
|
|
|
|
Hello guys,
I'm trying to do that for a while but nobody is able to help me. (Stack Overflow as well )
How can I achieve to create images with PHP that look like these Multi Color Gradients? The patterns should defined by positions in the field. It's important that they aren't linear or circled. It needs to be a complex pattern.
Image[^]
Any help would be amazing! Thank you
|
|
|
|
|
|
I want to be able to reload my Datatable once my checkbox is clicked , provided below is my attempted code but I continue to get error:Uncaught TypeError: Cannot set property 'data' of null not really sure how to handle this error. I have provided both the javascript and the view in my MVC application please let me know if you need more details.
.js
function ReloadTable()
{
$(document).ready(function () {
var table = $('#DashboardTable').DataTable({
"processing": true,
"serverSide": true,
"filter": true,
"orderMulti": false,
"ajax": {
"url": "/Chargeback/Index",
"type": "GET",
"datatype": "json"
},
"columns": [
{ "data": "ChargebackCode" },
{ "data": "StatusName" },
{ "data": "BusinessUnitName" },
{ "data": "InvoiceCode" },
{ "data": "OrderCode" },
{ "data": "PickTicketCode" },
{ "data": "CustomerPo" },
{ "data": "AssignedDepartment" },
{ "data": "DivisionName" },
{ "data": "Customer" },
{ "data": "WarehouseName" },
{ "data": "Coordinator" },
{ "data": "ChargebackDate" },
{ "data": "ModDate" },
{ "data": "ChargebackDeadline" },
{ "data": "ChargebackCloseDate" },
{ "data": " DaysOpen" },
{ "data": "ChargebackAmount" },
{ "data": "ChargebackBalance" },
{ "data": "FaultName" },
{ "data": "ResponsibleName" }
]
});
table.ajax.reload();
});
}
View
@using (Html.BeginForm("Index", "Chargeback"))
{
<label id = "Include" > @Html.CheckBox("IncludeClosed", (bool)ViewBag.IncludeClosed, new { onChange = "ReloadTable()" }) Include Closed</label>
<table id="DashboardTable" class="table table-striped" >
<thead>
<tr>
<th>Code</th>
<th>Status</th>
<th>Business</th>
<th>Invoice</th>
<th>Order</th>
<th>Pick Tickets</th>
<th>Customer PO</th>
<th>Assigned</th>
<th>Division</th>
<th>Customer</th>
<th>Warehouse</th>
<th>Coordinator</th>
<th>Open Date</th>
<th>Last Activity</th>
<th>Deadline</th>
<th>Closed Date</th>
<th>Days Open</th>
<th>Amount</th>
<th>Balance</th>
<th>Fault</th>
<th>Responsible</th>
</tr>
</thead>
<tbody>
@foreach (var item in Model)
{
var chargebackDeadline = item.ChargebackDeadline == null ? "" : ((DateTime)item.ChargebackDeadline).ToString("MM/dd/yyyy");
var chargebackCloseDateAsString = item.ChargebackCloseDate == null ? "" : ((DateTime)item.ChargebackCloseDate).ToString("MM/dd/yyyy");
<tr>
<td>@Html.ActionLink(item.ChargebackCode, "Details", "Chargeback", new { id = item.Id }, null)</td>
<td>@item.StatusName</td>
<td>@item.BusinessUnitName</td>
<td>@item.InvoiceCode</td>
<td>@item.OrderCode</td>
<td>@item.PickTicketCode</td>
<td>@item.CustomerPo</td>
<td>@item.AssignedDepartment</td>
<td>@item.DivisionName</td>
<td>@item.Customer</td>
<td>@item.WarehouseName</td>
<td>@item.Coordinator</td>
<td>@item.ChargebackDate.ToString("MM/dd/yyyy")</td>
<td>@item.ModDate.ToString("MM/dd/yyyy")</td>
<td>@chargebackDeadline</td>
<td>@chargebackCloseDateAsString</td>
<td>@item.DaysOpen</td>
<td>$@item.ChargebackAmount</td>
<td>$@item.ChargebackBalance</td>
<td>@item.FaultName</td>
<td>@item.ResponsibleName</td>
</tr>
}
</tbody>
</table>
}
|
|
|
|
|
Quote: Cannot set property 'data' of null Throughout your entire JavaScript code you are only trying to set the data field of an object in the following codes,
"columns": [
{ "data": "ChargebackCode" }, Now, either this is causing an unknown error, or maybe the code causing this problem is somewhere else. Clearly, the object which is being said to be null is an object that you are creating yourself.
One suggestion that I can provide is to set a breakpoint in your browser at the columns field, and then step by step execute the code and see where does this problem occur. I believe, step-by-step code execution can have some answers.
The sh*t I complain about
It's like there ain't a cloud in the sky and it's raining out - Eminem
~! Firewall !~
|
|
|
|
|
How to perform ajax on Data-table once I click on the check-box.
I already have the ability to auto post-back once the checkbox is clicked, I'm not sure how to achieve this.
View:
<script>
$(document).ready(function () {
$("#DashboardTable").DataTable({
"processing": true,
"serverSide": true,
"filter": true,
"orderMulti": false,
"pageLength": 5,
"ajax": {
"url": "/Chargeback/Index",
"type": "GET",
"datatype": "json"
},
"columnDefs":
[{
"targets": [0],
"visible": false,
"searchable": false
},
{
"targets": [7],
"searchable": false,
"orderable": false
},
{
"targets": [8],
"searchable": false,
"orderable": false
},
{
"targets": [9],
"searchable": false,
"orderable": false
}],
"columns": [
{"data":"ChargebackCode"},
{"data":"StatusName"},
{"data":"BusinessUnitName"},
{"data":"InvoiceCode"},
{"data":"OrderCode"},
{"data":"PickTicketCode"},
{"data":"CustomerPo"},
{"data":"AssignedDepartment"},
{"data":"DivisionName"},
{"data":"Customer"},
{"data":"WarehouseName"},
{"data":"Coordinator"},
{"data":"ChargebackDate"},
{"data":"ModDate"},
{"data":"ChargebackDeadline"},
{"data":"ChargebackCloseDate"},
{"data":" DaysOpen"},
{"data":"ChargebackAmount"},
{"data":"ChargebackBalance"},
{"data":"FaultName"},
{"data":"ResponsibleName"}
]
});
});
</script>
@using (Html.BeginForm("Index", "Chargeback"))
{
<label id = "Include" > @Html.CheckBox("IncludeClosed", (bool)ViewBag.IncludeClosed, new { onChange = "this.form.submit()" }) Include Closed</label>
<table id="DashboardTable" class="table table-striped" >
<thead>
<tr>
<th>Code</th>
<th>Status</th>
<th>Business</th>
<th>Invoice</th>
<th>Order</th>
<th>Pick Tickets</th>
<th>Customer PO</th>
<th>Assigned</th>
<th>Division</th>
<th>Customer</th>
<th>Warehouse</th>
<th>Coordinator</th>
<th>Open Date</th>
<th>Last Activity</th>
<th>Deadline</th>
<th>Closed Date</th>
<th>Days Open</th>
<th>Amount</th>
<th>Balance</th>
<th>Fault</th>
<th>Responsible</th>
</tr>
</thead>
<tbody>
@foreach (var item in Model)
{
var chargebackDeadline = item.ChargebackDeadline == null ? "" : ((DateTime)item.ChargebackDeadline).ToString("MM/dd/yyyy");
var chargebackCloseDateAsString = item.ChargebackCloseDate == null ? "" : ((DateTime)item.ChargebackCloseDate).ToString("MM/dd/yyyy");
<tr>
<td>@Html.ActionLink(item.ChargebackCode, "Details", "Chargeback", new { id = item.Id }, null)</td>
<td>@item.StatusName</td>
<td>@item.BusinessUnitName</td>
<td>@item.InvoiceCode</td>
<td>@item.OrderCode</td>
<td>@item.PickTicketCode</td>
<td>@item.CustomerPo</td>
<td>@item.AssignedDepartment</td>
<td>@item.DivisionName</td>
<td>@item.Customer</td>
<td>@item.WarehouseName</td>
<td>@item.Coordinator</td>
<td>@item.ChargebackDate.ToString("MM/dd/yyyy")</td>
<td>@item.ModDate.ToString("MM/dd/yyyy")</td>
<td>@chargebackDeadline</td>
<td>@chargebackCloseDateAsString</td>
<td>@item.DaysOpen</td>
<td>$@item.ChargebackAmount</td>
<td>$@item.ChargebackBalance</td>
<td>@item.FaultName</td>
<td>@item.ResponsibleName</td>
</tr>
}
</tbody>
</table>
}
|
|
|
|
|
I don't understand the question. You have code that initializes your datatable when the page loads. Are you asking how to re-load it when you check a checkbox?
If so,
var table = $('#grdTable').DataTable();
table.ajax.reload();
Social Media - A platform that makes it easier for the crazies to find each other.
Everyone is born right handed. Only the strongest overcome it.
Fight for left-handed rights and hand equality.
|
|
|
|
|
|
Should I remove this portion:
$(document).ready(function () {
and just add this portion:
var table = $('#grdTable').DataTable();
table.ajax.reload();
|
|
|
|
|
No, that first part initializes your table. The second part just tells it to refresh.
Social Media - A platform that makes it easier for the crazies to find each other.
Everyone is born right handed. Only the strongest overcome it.
Fight for left-handed rights and hand equality.
|
|
|
|
|
So basically this, This is in my .js file I would link this to my view in mvc:
var table = $('#DashboardTable').DataTable;
table.ajax.reload();
$(document).ready(function () {
$("#DashboardTable").DataTable({
"processing": true,
"serverSide": true,
"filter": true,
"orderMulti": false,
"pageLength": 5,
"ajax": {
"url": "/Chargeback/Index",
"type": "GET",
"datatype": "json"
},
"columnDefs":
[{
"targets": [0],
"visible": false,
"searchable": false
},
{
"targets": [7],
"searchable": false,
"orderable": false
},
{
"targets": [8],
"searchable": false,
"orderable": false
},
{
"targets": [9],
"searchable": false,
"orderable": false
}],
"columns": [
{ "data": "ChargebackCode" },
{ "data": "StatusName" },
{ "data": "BusinessUnitName" },
{ "data": "InvoiceCode" },
{ "data": "OrderCode" },
{ "data": "PickTicketCode" },
{ "data": "CustomerPo" },
{ "data": "AssignedDepartment" },
{ "data": "DivisionName" },
{ "data": "Customer" },
{ "data": "WarehouseName" },
{ "data": "Coordinator" },
{ "data": "ChargebackDate" },
{ "data": "ModDate" },
{ "data": "ChargebackDeadline" },
{ "data": "ChargebackCloseDate" },
{ "data": " DaysOpen" },
{ "data": "ChargebackAmount" },
{ "data": "ChargebackBalance" },
{ "data": "FaultName" },
{ "data": "ResponsibleName" }
]
});
});
modified 8-Jul-19 15:39pm.
|
|
|
|
|
No, you want the reload code in a function, then when you click the checkbox you call that function.
Social Media - A platform that makes it easier for the crazies to find each other.
Everyone is born right handed. Only the strongest overcome it.
Fight for left-handed rights and hand equality.
|
|
|
|
|
Can you provide a example of what you mean?
|
|
|
|
|
KGr28 wrote: Can you provide a example of what you mean? It is very, very, basic JavaScript. You can copy and paste from what I give you as an example but you need to understand how it works.
fucntion ReloadTable(){
}
Then, if you don't know how, google how to run javascript when checking a box.
Social Media - A platform that makes it easier for the crazies to find each other.
Everyone is born right handed. Only the strongest overcome it.
Fight for left-handed rights and hand equality.
|
|
|
|
|
Sorry I am new to javascript hence all of the questions, just trying to get a clear understanding of what exactly you are trying to say.
|
|
|
|
|
I have an ASP.net MVC Web API developed in VS2017 using C# 4.5.2.
I'm trying to deploy it to IIS on a Windows Server 2019 box on the same network by following this article.
- Right Click the project and choose Publish.
- Click New Profile
- Select "IIS,FTP,etc" and click "Create Profile"
- In the Connection dialog, I fill in the server's IP (192.162.50.153), the Site Name, my User Name and Password, and click the "Validate Connection" button.
I get
Could not connect to the remote computer ("192.168.50.153") using the specified process ("Web Management Service") because the server did not respond. Make sure that the process ("Web Management Service") is started on the remote computer. Learn more at: http:
I went to the link in the message.
A. I can Ping the machine
B. The Web Deploy Service is running
C. The port is opened.
What am I doign wrong?? What's the right way to deploy/install my Web API to my server on the same network?
If it's not broken, fix it until it is.
Everything makes sense in someone's mind.
Ya can't fix stupid.
|
|
|
|
|