这是一个有效的jQuery回调函数调用? [英] Is this a valid jquery callback function call?
问题描述
我执行这样的函数,
<脚本类型=文/ JavaScript的>
$(文件)。就绪(函数(){ getEntities(客户端/ GetClients,0,formatClientsResult); 变种maxvalues = $(#HFID)VAL();
$(寻呼机)。分页(maxvalues,{
回调:getEntities(客户端/ GetClients,formatClientsResult)
CURRENT_PAGE:0,
items_per_page的:5,
num_display_entries:5,
next_text:下一步,
prev_text:'preV,
num_edge_entries:1
});
});
< / SCRIPT>$(函数(){
$ .ajaxSetup({
的contentType:应用/ JSON的;字符集= UTF-8,
全球:假的,
异步:假的,
数据类型:JSON,
beforeSend:函数(){$('。装')显示(); },
完成:函数(){$('。装')隐藏(); }
});
});功能getEntities(URL,当前页,formatResultFunction){
$阿贾克斯({
网址:网址,
数据:{'当前页:(当前页+1),'的pageSize':5},
成功:功能(数据){
如果(data.isRedirect&安培;&安培; data.isRedirect ===真){
警报('必须重定向到'+ data.redirectUrl);
位置='http://www.google.com';
}
其他{
VAR的div ='';
$(#HFID)VAL('')。
$(#ResultsDiv),空();
$。每个(data.Results,函数(){
的div + = formatResultFunction(本);
});
$(#ResultsDiv)追加(div的)。
$(。resultsdiv:甚至)addClass(resultseven);
$(。resultsdiv)。悬停(函数(){
$(本).addClass(resultshover);
},函数(){
$(本).removeClass(resultshover);
});
$(#HFID)VAL()。
$(#HFID)VAL(data.Count)。 }
}
});
返回false;
}
功能formatClientsResult(结果){
回归'< DIV CLASS =resultsdiv>< BR /><跨度风格=显示:inline-block的; WIDTH:220px;类=resultName>' + result.ClientName +'< / SPAN><跨度类=resultfields的风格=填充左:10px的;>手机号码和放大器; NBSP;:< / SPAN>&安培; NBSP;<跨度类=resultfieldvalues>' + result.ClientMobNo +'< / SPAN><跨度风格=浮动:权利;填充右:2px的;><输入类型=复选框值='+ result.ClientId +'的onclick = storeIds();/>< / SPAN>< BR />< BR /><跨度类=resultfields>地址&安培; NBSP;:< / SPAN>&安培; NBSP;&LT ;跨度类=resultfieldvalues>' + result.ClientAddress +'< / SPAN>< / DIV>';
}
和我通过Firebug的检查,我发现我的要求是,
的http://本地主机:1115/0当前页= [对象+ HTMLDivElement] 1安培;的pageSize = 5
...我思念的东西...
在初始加载执行请求,
的http://本地主机:1115 /客户/ GetClients当前页= 1&放大器;的pageSize = 5
这似乎是工作,但只有在回调函数失败...
我用这的jQuery插件分页
由于建议的达林,
$(文件)。就绪(函数(){ getEntities(客户端/ GetClients,0,formatClientsResult);
变种maxvalues = $(#HFID)VAL();
$(寻呼机)。分页(maxvalues,{
回调:函数(){
getEntities(客户端/ GetClients,0,formatClientsResult);
},
CURRENT_PAGE:0,
items_per_page的:5,
num_display_entries:5,
next_text:下一步,
prev_text:'preV,
num_edge_entries:1
});
我的控制器动作,
公共JsonResult GetClients(INT当前页,诠释的pageSize)
{
如果(会话[用户id]!= NULL)
{
VAR的客户= clirep.FindAllClients(Convert.ToInt32(会话[用户id]))AsQueryable已()。
变种数= clients.Count();
VAR的结果=新PagedList< ClientBO>(客户,当前是 - 1,pageSize的);
VAR genericResult =新的{数=计,结果=结果,isRedirect = FALSE};
返回JSON(genericResult);
}
其他
{
VAR genericResult =新的{=的redirectUrl Url.Action(创建,登记),isRedirect = TRUE};
返回JSON(genericResult);
} }
和我的模型,
公开的IQueryable< ClientBO> FindAllClients(INT用户id)
{
VAR的客户=从taxidb.ClientsÇ
其中,c.CreatedBy ==用户用户名与放大器;&安培; c.IsDeleted == 0
选择新ClientBO()
{
客户端Id = c.ClientId,
CLIENTNAME = c.ClientName,
ClientMobNo = Convert.ToString(c.ClientMobNo)
ClientAddress = c.ClientAddress
};
返回客户端;
}
和我的看法,
<%@页标题=LANGUAGE =C#的MasterPageFile =〜/查看/共享/的Site.Master继承=System.Web.Mvc.ViewPage< TaxiMVC.Models.Client>中%GT;< ASP:内容ID =内容1ContentPlaceHolderID =TitleContent=服务器>
指数
< / ASP:内容>
< ASP:内容ID =内容2ContentPlaceHolderID =日程地址搜索Maincontent=服务器>
< H2>
客户与LT; / H>
<输入类型=隐藏ID =HFID/>
<输入类型=隐藏ID =hfEditId/>
< DIV ID =ErrorDiv>
< / DIV>
< DIV ID =ImageButtonDiv>
<输入类型=按钮级=addbuttons的onclick =返回showadd(); />
<输入类型=按钮级=editbuttons的onclick =如果(editdetails()){返回getClientbyId($('#HFID)VAL());}/>
<输入类型=按钮级=deletebuttons的onclick =如果(deletedetails()){返回deleteClients($('#HFID)VAL());}/>
< / DIV>
< DIV ID =ResultsDiv>
< / DIV>
< DIV ID =PagerDown级=寻呼机>
< / DIV>
< DIV ID =adddiv的风格=显示:无;>
<表ID =addform自动完成=关闭行动=>
<&字段集GT;
<传奇>客户详细资料及LT; /传说>
<表格的cellpadding =0CELLSPACING =0WIDTH =100%>
&所述; TR>
< TD类=tdfields的风格=宽度:25%;填充右:20px的; ALIGN =正确>
客户姓名和放大器; NBSP;:
< / TD>
< TD风格=宽度:20%;>
<%= Html.TextBox(名,空,新的{@class =text_box_height_14_width_150})%GT;
&安培; NBSP;
< / TD>
< TD风格=宽度:55%;类=状态>
&安培; NBSP;
< / TD>
< / TR>
&所述; TR>
< TD类=tdfields的风格=宽度:25%;填充右:20px的; ALIGN =正确>
手机号码和放大器; NBSP;:
< / TD>
< TD风格=宽度:20%;>
<%= Html.TextBox(MobileNo,空,新的{@class =text_box_height_14_width_150})%GT;
&安培; NBSP;
< / TD>
< TD风格=宽度:55%;类=状态>
&安培; NBSP;
< / TD>
< / TR>
&所述; TR>
< TD类=tdfields的风格=宽度:25%;填充右:20px的; ALIGN =正确>
地址和放大器; NBSP;:
< / TD>
< TD风格=宽度:20%;>
<%= Html.TextArea(地址,空,6,42,新的{@class =multiline_text_box_height_14_width_200})%GT;
&安培; NBSP;
< / TD>
< TD风格=宽度:55%;类=状态>
&安培; NBSP;
< / TD>
< / TR>
&所述; TR>
&所述; TD列跨度=2ALIGN =中心>
< DIV CLASS =形式提交>
<输入类型=提交值=提交ID =提交/>
&安培; NBSP;&安培; NBSP;<输入类型=按钮值=取消ID =取消的onclick =返回showResultsdiv(); />
< / DIV>
< / TD>
&所述; TD>
< / TD>
< / TR>
< /表>
< /字段集>
< /表及GT;
< / DIV>
<输入ID =HFID类型=隐藏/> <脚本类型=文/ JavaScript的>
$(文件)。就绪(函数(){
// getClients(0);
getEntities(客户端/ GetClients,0,formatClientsResult);
变种maxvalues = $(#HFID)VAL();
$(寻呼机)。分页(maxvalues,{
回调:函数(){
getEntities(客户端/ GetClients,0,formatClientsResult);
},
CURRENT_PAGE:0,
items_per_page的:5,
num_display_entries:5,
next_text:下一步,
prev_text:'preV,
num_edge_entries:1
}); VAR验证= $(#addform)。验证({
规则:{
产品名称:必需的,
手机号码: {
要求:真实,
编号:真,
MINLENGTH个:10
},
地址:需要
}, 消息:{
产品名称:请提供客户名称,
手机号码: {
要求:请没有提供手机
数字:请没有提供手机
rangelength:jQuery.format(输入至少{0}个字符)
},
地址:请提供客户端地址
},
//将errorPlacement已采取表格的布局考虑
errorPlacement:功能(错误,元素){
error.appendTo(element.parent()的next());
},
//设置此类错误,标签注明有效字段
成功:函数(标签){
//设置&放大器; NBSP;作为文本的IE浏览器
label.html(与& NBSP;)。addClass(选中);
}, submitHandler:功能(形式){
如果($(#hfEditId)。VAL()==){
$阿贾克斯({
网址:客户端/ ClientCreate
数据:{'CLIENTNAME:$(#NAME)VAL(),'clientMobNo':$(#MobileNo)VAL(),'clientAddress':$(#地址)VAL() },
的contentType:应用/ JSON的;字符集= UTF-8,
全球:假的,
异步:假的,
数据类型:JSON
beforeSend:函数(){$('。装')显示(); },
完成:函数(){$('。装')隐藏(); },
成功:功能(数据){
如果(data.Result ==成功){
$(#hfEditId)VAL('')。
$(#addform)clearForm();
getEntities(客户端/ GetClients,0,formatClientsResult);
$(#adddiv),隐藏()。
$(#ResultsDiv)显示()。
$(#PagerDown)显示()。
$(#ImageButtonDiv)显示()。
变种maxvalues = $(#HFID)VAL();
$(寻呼机)。分页(maxvalues,{
回调:getEntities(客户端/ ClientCreate,0,formatClientsResult)
CURRENT_PAGE:0,
items_per_page的:5,
num_display_entries:5,
next_text:下一步,
prev_text:'preV,
num_edge_entries:1
});
$(#警告),删除()。
顶栏(添加成功');
返回false;
}
}
});
}
其他{
$阿贾克斯({
网址:客户端/ Clientupdate
数据:{'的clientId':$(#hfEditId)VAL(),'CLIENTNAME:$(#NAME)VAL(),'clientMobNo'。$(#MobileNo)VAL() clientAddress'。$(#地址)VAL()},
的contentType:应用/ JSON的;字符集= UTF-8,
全球:假的,
异步:假的,
数据类型:JSON
beforeSend:函数(){$('。装')显示(); },
完成:函数(){$('。装')隐藏(); },
成功:功能(数据){
如果(data.Result ==成功){
$(#hfEditId)VAL('')。
$(#addform)clearForm();
getEntities(客户端/ GetClients,0,formatClientsResult);
$(#adddiv),隐藏()。
$(#ResultsDiv)显示()。
$(#PagerDown)显示()。
$(#ImageButtonDiv)显示()。
变种maxvalues = $(#HFID)VAL();
$(寻呼机)。分页(maxvalues,{
回调:getEntities(客户端/ Clientupdate,0,formatClientsResult)
CURRENT_PAGE:0,
items_per_page的:5,
num_display_entries:5,
next_text:下一步,
prev_text:'preV,
num_edge_entries:1
});
$(#警告),删除()。
顶栏(更新成功);
返回false;
}
}
});
}
}
});
}); < / SCRIPT>< / ASP:内容>
的 getEntities
函数需要3个参数。在这里,你只传递2:
回调:getEntities(客户端/ GetClients,formatClientsResult)
另外,第二个参数必须是一个整数,而不是其他的功能。而且,因为它是它需要被定义为这样的回调:
回调:函数(){
getEntities(客户端/ GetClients,0,formatClientsResult);
}
更新:
您总是得到相同的AJAX请求的理由是,你总是在的 getEntities 函数:// D-隶由Matchi.com提供回到/网络工具/ jQuery的-分页/ lib目录/ jquery_pagination / README相对=nofollow>分页回调。
试试这个:
$(寻呼机)。分页(maxvalues,{
回调:函数(new_page_index,pagination_container){
//注意new_page_index是如何传递
getEntities(家用/ GetClients,new_page_index,formatClientsResult);
},
CURRENT_PAGE:0,
items_per_page的:5,
num_display_entries:5,
next_text:下一步,
prev_text:'preV,
num_edge_entries:1
});
I executing a function like this,
<script type="text/javascript">
$(document).ready(function() {
getEntities("Clients/GetClients", 0, formatClientsResult);
var maxvalues = $("#HfId").val();
$(".pager").pagination(maxvalues, {
callback: getEntities("Clients/GetClients", formatClientsResult),
current_page: 0,
items_per_page: 5,
num_display_entries: 5,
next_text: 'Next',
prev_text: 'Prev',
num_edge_entries: 1
});
});
</script>
$(function() {
$.ajaxSetup({
contentType: 'application/json; charset=utf-8',
global: false,
async: false,
dataType: 'json',
beforeSend: function() { $('.loading').show(); },
complete: function() { $('.loading').hide(); }
});
});
function getEntities(url, currentPage, formatResultFunction) {
$.ajax({
url: url,
data: { 'currentPage': (currentPage + 1), 'pageSize': 5 },
success: function(data) {
if (data.isRedirect && data.isRedirect === true) {
alert('must redirect to ' + data.redirectUrl);
location = 'http://www.google.com';
}
else {
var divs = '';
$("#hfId").val('');
$("#ResultsDiv").empty();
$.each(data.Results, function() {
divs += formatResultFunction(this);
});
$("#ResultsDiv").append(divs);
$(".resultsdiv:even").addClass("resultseven");
$(".resultsdiv").hover(function() {
$(this).addClass("resultshover");
}, function() {
$(this).removeClass("resultshover");
});
$("#HfId").val("");
$("#HfId").val(data.Count);
}
}
});
return false;
}
function formatClientsResult(result) {
return '<div class="resultsdiv"><br /><span style="display: inline-block;width:220px;" class="resultName">' + result.ClientName + '</span><span class="resultfields" style="padding-left:10px;">Mobile No :</span> <span class="resultfieldvalues">' + result.ClientMobNo + '</span><span style="float:right; padding-right:2px;"><input type="checkbox" value=' + result.ClientId + ' onclick="storeIds();"/></span><br/><br/><span class="resultfields">Address :</span> <span class="resultfieldvalues">' + result.ClientAddress + '</span></div>';
}
and i inspected through firebug i found my request was,
http://localhost:1115/0?currentPage=[object+HTMLDivElement]1&pageSize=5
... Am i missing something...
When executing on initial load the request is,
http://localhost:1115/Clients/GetClients?currentPage=1&pageSize=5
This seems to work but Only the callback function fails...
I am using this jquery pagination plugin
As suggested by darin,
$(document).ready(function() {
getEntities("Clients/GetClients", 0, formatClientsResult);
var maxvalues = $("#HfId").val();
$(".pager").pagination(maxvalues, {
callback: function() {
getEntities("Clients/GetClients", 0, formatClientsResult);
},
current_page: 0,
items_per_page: 5,
num_display_entries: 5,
next_text: 'Next',
prev_text: 'Prev',
num_edge_entries: 1
});
My controller action,
public JsonResult GetClients(int currentPage, int pageSize)
{
if (Session["userId"]!=null)
{
var clients = clirep.FindAllClients(Convert.ToInt32(Session["userId"])).AsQueryable();
var count = clients.Count();
var results = new PagedList<ClientBO>(clients, currentPage - 1, pageSize);
var genericResult = new { Count = count, Results = results ,isRedirect=false};
return Json(genericResult);
}
else
{
var genericResult = new {redirectUrl = Url.Action("Create", "Registration"), isRedirect = true };
return Json(genericResult);
}
}
And my model,
public IQueryable<ClientBO> FindAllClients(int userId)
{
var client = from c in taxidb.Clients
where c.CreatedBy == userId && c.IsDeleted == 0
select new ClientBO()
{
ClientId = c.ClientId,
ClientName= c.ClientName,
ClientMobNo= Convert.ToString(c.ClientMobNo),
ClientAddress= c.ClientAddress
};
return client;
}
and my view,
<%@ Page Title="" Language="C#" MasterPageFile="~/Views/Shared/Site.Master" Inherits="System.Web.Mvc.ViewPage<TaxiMVC.Models.Client>" %>
<asp:Content ID="Content1" ContentPlaceHolderID="TitleContent" runat="server">
Index
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">
<h2>
Clients</h2>
<input type="hidden" id="hfId" />
<input type="hidden" id="hfEditId" />
<div id="ErrorDiv">
</div>
<div id="ImageButtonDiv">
<input type="button" class="addbuttons" onclick="return showadd();" />
<input type="button" class="editbuttons" onclick="if(editdetails()){return getClientbyId($('#hfId').val());}" />
<input type="button" class="deletebuttons" onclick="if(deletedetails()){return deleteClients($('#hfId').val());}" />
</div>
<div id="ResultsDiv">
</div>
<div id="PagerDown" class="pager">
</div>
<div id="adddiv" style="display: none;">
<form id="addform" autocomplete="off" action="">
<fieldset>
<legend>Client Details</legend>
<table cellpadding="0" cellspacing="0" width="100%">
<tr>
<td class="tdfields" style="width: 25%; padding-right: 20px;" align="right">
Client Name :
</td>
<td style="width: 20%;">
<%= Html.TextBox("Name", null, new { @class = "text_box_height_14_width_150" })%>
</td>
<td style="width: 55%;" class="status">
</td>
</tr>
<tr>
<td class="tdfields" style="width: 25%; padding-right: 20px;" align="right">
Mobile No :
</td>
<td style="width: 20%;">
<%= Html.TextBox("MobileNo", null, new { @class = "text_box_height_14_width_150" })%>
</td>
<td style="width: 55%;" class="status">
</td>
</tr>
<tr>
<td class="tdfields" style="width: 25%; padding-right: 20px;" align="right">
Address :
</td>
<td style="width: 20%;">
<%= Html.TextArea("Address", null, 6, 42, new { @class = "multiline_text_box_height_14_width_200" })%>
</td>
<td style="width: 55%;" class="status">
</td>
</tr>
<tr>
<td colspan="2" align="center">
<div class="form-submit">
<input type="submit" value="Submit" id="submit" />
<input type="button" value="Cancel" id="cancel" onclick="return showResultsdiv();" />
</div>
</td>
<td>
</td>
</tr>
</table>
</fieldset>
</form>
</div>
<input id="HfId" type="hidden" />
<script type="text/javascript">
$(document).ready(function() {
// getClients(0);
getEntities("Clients/GetClients", 0, formatClientsResult);
var maxvalues = $("#HfId").val();
$(".pager").pagination(maxvalues, {
callback: function() {
getEntities("Clients/GetClients", 0, formatClientsResult);
},
current_page: 0,
items_per_page: 5,
num_display_entries: 5,
next_text: 'Next',
prev_text: 'Prev',
num_edge_entries: 1
});
var validator = $("#addform").validate({
rules: {
Name: "required",
MobileNo: {
required: true,
number: true,
minlength: 10
},
Address: "required"
},
messages: {
Name: "please provide a client name",
MobileNo: {
required: "Please provide a mobile phone no",
number: "Please provide a mobile phone no",
rangelength: jQuery.format("Enter at least {0} characters")
},
Address: "please provide client address"
},
// the errorPlacement has to take the table layout into account
errorPlacement: function(error, element) {
error.appendTo(element.parent().next());
},
// set this class to error-labels to indicate valid fields
success: function(label) {
// set as text for IE
label.html(" ").addClass("checked");
},
submitHandler: function(form) {
if ($("#hfEditId").val() == "") {
$.ajax({
url: "Clients/ClientCreate",
data: { 'clientName': $("#Name").val(), 'clientMobNo': $("#MobileNo").val(), 'clientAddress': $("#Address").val() },
contentType: "application/json; charset=utf-8",
global: false,
async: false,
dataType: "json",
beforeSend: function() { $('.loading').show(); },
complete: function() { $('.loading').hide(); },
success: function(data) {
if (data.Result == "Success") {
$("#hfEditId").val('');
$("#addform").clearForm();
getEntities("Clients/GetClients", 0, formatClientsResult);
$("#adddiv").hide();
$("#ResultsDiv").show();
$("#PagerDown").show();
$("#ImageButtonDiv").show();
var maxvalues = $("#HfId").val();
$(".pager").pagination(maxvalues, {
callback: getEntities("Clients/ClientCreate", 0, formatClientsResult),
current_page: 0,
items_per_page: 5,
num_display_entries: 5,
next_text: 'Next',
prev_text: 'Prev',
num_edge_entries: 1
});
$("#alert").remove();
topBar('successfully added');
return false;
}
}
});
}
else {
$.ajax({
url: "Clients/Clientupdate",
data: { 'clientId': $("#hfEditId").val(), 'clientName': $("#Name").val(), 'clientMobNo': $("#MobileNo").val(), 'clientAddress': $("#Address").val() },
contentType: "application/json; charset=utf-8",
global: false,
async: false,
dataType: "json",
beforeSend: function() { $('.loading').show(); },
complete: function() { $('.loading').hide(); },
success: function(data) {
if (data.Result == "Success") {
$("#hfEditId").val('');
$("#addform").clearForm();
getEntities("Clients/GetClients", 0, formatClientsResult);
$("#adddiv").hide();
$("#ResultsDiv").show();
$("#PagerDown").show();
$("#ImageButtonDiv").show();
var maxvalues = $("#HfId").val();
$(".pager").pagination(maxvalues, {
callback: getEntities("Clients / Clientupdate", 0, formatClientsResult),
current_page: 0,
items_per_page: 5,
num_display_entries: 5,
next_text: 'Next',
prev_text: 'Prev',
num_edge_entries: 1
});
$("#alert").remove();
topBar('successfully updated');
return false;
}
}
});
}
}
});
});
</script>
</asp:Content>
The getEntities
function expects 3 arguments. Here you are passing only 2:
callback: getEntities("Clients/GetClients", formatClientsResult)
Also the second argument needs to be an integer and not another function. And as it is a callback it needs to be defined as such:
callback: function() {
getEntities("Clients/GetClients", 0, formatClientsResult);
}
UPDATE:
The reason you are always getting the same AJAX request is that you always pass 0 to the getEntities
function in the pagination callback.
Try this:
$(".pager").pagination(maxvalues, {
callback: function (new_page_index, pagination_container) {
// Notice how the new_page_index is passed
getEntities("home/GetClients", new_page_index, formatClientsResult);
},
current_page: 0,
items_per_page: 5,
num_display_entries: 5,
next_text: 'Next',
prev_text: 'Prev',
num_edge_entries: 1
});
这篇关于这是一个有效的jQuery回调函数调用?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!