鉴于这种观点：
<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Bootstrap.Base.Master" Inherits="System.Web.Mvc.ViewPage<OfficeOrdersViewModel>" %>
<asp:Content ID="tc" ContentPlaceHolderID="TitleContent" runat="server">
Office Order Summary
</asp:Content>
<asp:Content ID="pc" ContentPlaceHolderID="PageContent" runat="server">
<div class="row-fluid">
<legend>Office Order Summary</legend>
<input type="hidden" value="<%: Model.OfficeId %>" name="OfficeId" id="OfficeId" />
<div class="row-fluid" id="companySelect" name="companySelect" style="display: none;">
<span class="span7">
<label class="bold">Company</label>
<input type="button" class="btn" id="btnFindCompany" value="Find a Company" style="margin-bottom: 3px;" />
<input type="text" id="CompanySearch" class="input-block-level valid" placeholder="Search for a company" style="display: none;" minlength="2" maxlength="100" /><br />
<select id="CustomerInput_CompanyId" name="CustomerInput.CompanyId" class="input-block-level valid" style="display: none;"></select>
<input type="button" id="btnUseCompany" name="btnUseCompany" value="Next" class="btn btn-success" style="display: none;" />
</span>
</div>
<div class="row-fluid" id="companyData" name="companyData" style="display: none;">
<div class="row-fluid">
<div class="span4 forceWordWrap">
<h4 style="margin: 0;"><span name="OfficeName" id="OfficeName"><%: Model.OfficeName %></span></h4>
<span name="OfficeAddress1" id="OfficeAddress1"><%: Model.OfficeAddress1 %></span>
<span name="OfficeAddress2" id="OfficeAddress2"> <%: Model.OfficeAddress2 %></span><br />
<span name="OfficeCity" id="OfficeCity"><%: Model.OfficeCity %></span>,
<span name="OfficeState" id="OfficeState"><%: Model.OfficeState %></span>
<span name="OfficeZip" id="OfficeZip"> <%: Model.OfficeZip %></span><br />
<span name="OfficePhone" id="OfficePhone"></span><%: Model.OfficePhone %><br />
</div>
<div class="span4">
<div class="row-fluid">
<div class="span6 bold textRight">
Office Sales Executive:<br />
Office Order Count:<br />
Office Revenue:<br />
Active Agents:
</div>
<div class="span6 forceWordWrap">
<span name="SalesRepFirstName" id="SalesRepFirstName"><%: Model.SalesRepFirstName %> </span><span name="SalesRepLastName" id="SalesRepLastName"><%: Model.SalesRepLastName %></span><br />
<span name="OrderCount" id="OrderCount"><%: (Model.AgentOrders != null) ? Model.AgentOrders.Count() : 0 %></span><br />
<span name="OfficeRevenue" id="OfficeRevenue"><%: (Model.AgentOrders != null) ? Model.AgentOrders.Sum(ao => ao.PeriodOrderRevenue) : 0 %></span><br />
<span name="AgentsCount" id="AgentsCount"><%: Model.AgentsCount %></span>
</div>
</div>
</div>
<div class="span4">
<div class="row-fluid">
<div class="span4"><h4>Orders For:</h4></div>
<div class="span4"><input type="button" id="btn90" name="btn90" value="Last 90 Days" class="btn btn-success" style="font-size: 12px; width: 99%; text-align: center;" /></div>
<div class="span4"><input type="button" id="btn12" name="btn12" value="Last 12 Months" class="btn btn-inverse" style="font-size: 12px; width: 99%; text-align: center;" /></div>
</div>
<div class="row-fluid">
<div class="span4"><input type="button" id="btn30" name="btn30" value="Last 30 Days" class="btn btn-inverse" style="font-size: 12px; width: 99%; text-align: center;" /></div>
<div class="span4"><input type="button" id="btn6" name="btn6" value="Last 6 Months" class="btn btn-inverse" style="font-size: 12px; width: 99%; text-align: center;" /></div>
<div class="span4"><input type="button" id="btnYTD" name="btnYTD" value="Year to Date" class="btn btn-inverse" style="font-size: 12px; width: 99%; text-align: center;" /></div>
</div>
</div>
</div>
<div class="row-fluid">
<table class="table table-striped table-bordered table-hover" id="AgentList" name="AgentList">
<thead>
<tr>
<th>Customer</th>
<th>Sales Executive</th>
<th>Last Order Opened</th>
<th>Revenue</th>
<th>LB Orders</th>
<th>SB Orders</th>
<th>Total Orders</th>
</tr>
</thead>
<tbody>
<% if (Model.AgentOrders != null) {
foreach (var agent in Model.AgentOrders) { %>
<tr>
<td><a href="/customerhistory#/details/<%: agent.CustomerId %>" class="btn btn-success input-medium">
<span name="firstName" id="firstName"><%: agent.CustomerFirstName %></span> <span name="lastName" id="lastName"><%: agent.CustomerLastName %></span>
</a></td>
<td><%: agent.SalesRepFirstName %> <%: agent.SalesRepLastName %></td>
<td><%: agent.NewestOrderOpenDate %></td>
<td><%: agent.PeriodOrderRevenue %></td>
<td><%: agent.PeriodLBOrderCount %></td>
<td><%: agent.PeriodSBOrderCount %></td>
<td><%: agent.PeriodLBOrderCount + agent.PeriodSBOrderCount %></td>
</tr>
<% }
} %>
</tbody>
</table>
</div>
</div>
</div>
</asp:Content>
<asp:Content ID="Content5" ContentPlaceHolderID="AdditionalScripts" runat="server">
<script src="//ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.js"></script>
<script src="../../Scripts/jquery.validate.js" type="text/javascript"></script>
<script src="../../Scripts/additional-methods.js" type="text/javascript"></script>
<script src="../../Scripts/jquery.tinysort.min.js" type="text/javascript"></script>
<%--<script src="../../Scripts/jquery.sortElements.js" type="text/javascript"></script>--%>
<script type="text/javascript">
$(function () {
ShowHideCompanySelect();
$("#CustomerInput_CompanyId").hide();
$("#CompanySearch").hide();
$("#btnUseCompany").hide();
$("#frmCompanySelect div.companysearchError").hide();
$("#btnFindCompany").click(function () {
$("#CustomerInput_CompanyId").hide();
$("#CompanySearch").show();
$("#btnFindCompany").hide();
});
$("#CompanySearch").autocomplete({
source: '/OfficeOrders/OfficeSearch?' + $("#CompanySearch").val(),
minLength: 2,
select: function (event, ui) {
$("#CustomerInput_CompanyId")
.find('option')
.remove()
.end()
.append($("<option value=" + ui.item.id + ">" + ui.item.value + "</option>"))
.val(ui.item.id);
$("#CustomerInput_CompanyId").show();
$("#CompanySearch").hide();
$("#btnFindCompany").show();
$("#btnFindCompany").prop("value", "Find Another Company");
$("#btnUseCompany").show();
}
});
$("#btnUseCompany").click(function () {
$.post('/OfficeOrders/GetOfficeData', {
officeId: $("#CustomerInput_CompanyId").val()
}, function(data) {
if (data.success) {
$("#OfficeId").text(data.officeDto.OfficeId);
$("#OfficeName").text(data.officeDto.OfficeName);
$("#OfficeAddress1").text(data.officeDto.OfficeAddress1);
$("#OfficeAddress2").text(data.officeDto.OfficeAddress2);
$("#OfficeCity").text(data.officeDto.OfficeCity);
$("#OfficeState").text(data.officeDto.OfficeState);
$("#OfficeZip").text(data.officeDto.OfficeZip);
$("#OfficePhone").text(data.officeDto.OfficePhone);
$("#Agents").text(data.officeDto.Agents);
$("#AgentsCount").text(data.officeDto.AgentsCount);
$("#SalesRepFirstName").text(data.officeDto.SalesRepFirstName);
$("#SalesRepLastName").text(data.officeDto.SalesRepLastName);
$("#OrderCount").text(data.officeDto.OrderCount);
$("#OfficeRevenue").text(data.officeDto.OfficeRevenue);
$("#OfficeId").val($("#CustomerInput_CompanyId").val());
ShowHideCompanySelect();
} else {
ShowHideCompanySelect();
}
});
});
});
function ShowHideCompanySelect() {
if ($("#OfficeId").val() === "00000000-0000-0000-0000-000000000000") {
$("#companySelect").show();
$("#companyData").hide();
} else {
$("#companySelect").hide();
$("#companyData").show();
}
}
$(document).ready(function() {
//Start Sorting for the table
var table = document.getElementById('AgentList'),
tableHead = table.querySelector('thead'),
tableHeaders = tableHead.querySelectorAll('th'),
tableBody = table.querySelector('tbody');
tableHead.addEventListener('click', function(e) {
var tableHeader = e.target,
textContent = tableHeader.textContent,
tableHeaderIndex,
isAscending,
order;
if (textContent !== 'add row') {
while (tableHeader.nodeName !== 'TH') {
tableHeader = tableHeader.parentNode;
}
tableHeaderIndex = Array.prototype.indexOf.call(tableHeaders, tableHeader);
isAscending = tableHeader.getAttribute('data-order') === 'asc';
order = isAscending ? 'desc' : 'asc';
tableHeader.setAttribute('data-order', order);
tinysort(
tableBody.querySelectorAll('tr'), {
selector: 'td:nth-child(' + (tableHeaderIndex + 1) + ')',
order: order
}
);
}
});
//End Sorting for the table
});
</script>
</asp:Content>
<asp:Content ID="ac" ContentPlaceHolderID="AdditionalContent" runat="server">
<style>
.ui-menu {
list-style: none;
padding: 2px;
margin: 0;
display: block;
float: left;
}
.ui-menu .ui-menu {
margin-top: 03px;
}
.ui-menu {
margin: 3px;
padding: 3px;
zoom: 1;
float: left;
clear: left;
cursor: pointer;
background-color: rgb(238, 238, 238);
border: 1px solid rgb(0, 0, 0);
}
.ui-menu-item
{
border-bottom: 1px solid rgb(0, 0, 0);
}
.ui-menu .ui-menu-item a {
text-decoration: none;
display: block;
width: 100%;
padding: .2em .4em;
line-height: 1.5;
zoom: 1;
}
.ui-menu .ui-menu-item a.ui-state-hover,
.ui-menu .ui-menu-item a.ui-state-active {
font-weight: normal;
margin: -1px;
}
</style>
</asp:Content>
单击标题时出现以下错误：
未捕获引用错误：未定义tinysort
我不确定为什么会这样，因为
tinysort.min.js结尾是：a.fn.TinySort=a.fn.Tinysort=a.fn.tsort=a.fn.tinysort}(jQuery);我的意思是“在所有这些情况下，tinysort的不同拼写”。
可以用手来整理一下。没有双关语。
仅供参考：我使用的jquery几乎就是TinySort's page.上的内容
最佳答案
问题是没有添加Tinysort脚本。当前版本的Tinysort是独立的。但这确实意味着当前的jquery.tinysort.js需要tinysort.js。所以加上后者，你就应该走了。
关于jquery - 如何用TinySort排序，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/30466684/