JQGrid Reload Error - jqgrid

I am new to JqGrid. I have a problem with reload JqGrid. Not getting any errors also.
jQuery("#gridData").jqGrid("setGridParam",
{ type: "POST",
url: "TablesCoolView.aspx/GetTableData",
data: "{TableName :'" + "Test" + "'}",
contentType: "application/json",
dataType: "json"
}).trigger("reloadGrid", [{ current: true }]);
The Code will go here,
onPaging: function (pgButton) {
//debugger;
var pagerId = this.p.pager.substr(1); // get paper id like "pager"
var currentPage = jQuery("#gridData").jqGrid("getGridParam", 'page'); //get current page
var lastPage = jQuery("#gridData").jqGrid("getGridParam", 'lastpage'); //get last page
if (currentPage - 1 == lastPage - 1)
jQuery("#gridData").jqGrid("setGridParam", { page: lastPage }).trigger("reloadGrid"); // set the requested page to the last page value – then reload
var currentRecordCount = jQuery("#gridData").jqGrid("getGridParam", 'reccount'); //get the record count
var recordsPerPage = jQuery("#gridData").jqGrid("getGridParam", 'rowNum'); // get the records per page
var newValue = 0; // new value
if (pgButton === "user") {
newValue = $(".ui-pg-input").val();
}
else {
if (pgButton.indexOf("next") >= 0)
newValue = ++currentPage;
else if (pgButton.indexOf("prev") >= 0)
newValue = --currentPage;
else if (pgButton.indexOf("last") >= 0)
newValue = jQuery("#gridId").jqGrid("getGridParam", 'lastpage');
else if (pgButton.indexOf("first") >= 0)
newValue = 1;
}
alert(pgButton);
//alert(newValue);
jQuery("#gridData").jqGrid("setGridParam", { page: newValue }).trigger("reloadGrid"); // set the requested page to the last page value – then reload
currentRecordCount = jQuery("#gridData").jqGrid("getGridParam", 'reccount'); // read the current page records
//alert('RecordCount: ' + currentRecordCount + ' RecordsPerPage: ' + recordsPerPage);
if (currentRecordCount < recordsPerPage) {
startRange = 1;
endRange += endRange;
alert("Grid Reload test Start");
//jQuery("#gridData").jqGrid("setGridParam", { type: "POST", url: "TablesCoolView.aspx/GetTableData", page: 1, async: true, loadOnce: true, data: "{TableName :'" + "Test" + "'}", contentType: "application/json", dataType: "json" }).trigger("reloadGrid");
jQuery("#gridData").jqGrid("setGridParam", { type: "POST", url: "TablesCoolView.aspx/GetTableData", data: "{TableName :'" + "Test" + "'}", contentType: "application/json", dataType: "json" }).trigger("reloadGrid", [{ current: true }]);
alert("Grid Reload test End");
//jQuery("#gridData").jqGrid("setGridParam", { datatype: "json", data: "{TableName :'" + tableName + "', \"PageSize\" :\"" + recordsPerPage + "\", \"PageNumber\" :\"" + newValue + "\"}", url: "TablesCoolView.aspx/GetNextSetOfRecords" }).trigger("reloadGrid");
//data: "{TableName :'" + tableName + "', \"PageSize\" :\"" + recordsPerPage + "\", \"PageNumber\" :\"" + newValue + "\"}",
}
}
Dont know where am doing wrong.
Please help me out of this.

Try changing data: "{TableName :'" + "Test" + "'}", to postData: "{TableName :'" + "Test" + "'}",

Related

Ajax not working sometimes

Below is the ajax code. It sometimes works in chrome and sometimes it doesnt. Any ideas?
$.ajax({
type: "POST",
//prod
url: "b2c_process_function.php",
data: dataString,
timeout: 4000,
complete: function() {
number = (Math.random() + ' ').substring(2,10) + (Math.random() + ' ').substring(2,10);
window.location.href = 'thankyou.php?OID=' + number + '&from=home';
}
});
Chnage data: dataString, to data: {dataString:dataString} as follows:
var dataString = 'test'; // or as you like
$.ajax({
method: "POST",
//prod
url: "b2c_process_function.php",
data: {dataString:dataString},
timeout: 4000,
complete: function(data) { //success
alert(data)
number = (Math.random() + ' ').substring(2,10) + (Math.random() + ' ').substring(2,10);
window.location.href = 'thankyou.php?OID=' + number + '&from=home';
}
});

Error In Ajax Call In html

If I Run The Following Code It's Directly Go To Error:Ajax Failed And Error Show on Fire Bug [Reference Error: Ajax Failed is not defined"].
Plz Tell Where I Make Mistake....?
Its My base 64 Encode Value For Name,Email,Gender,Password
var encodeRname = Base64.encode(name);
var encodeRemail = Base64.encode(email);
var encodeRgender = Base64.encode(lookingfor);
var encodeRpwd = Base64.encode(Pword);
var test = '.1!qkr*';
var decodertr = Base64.decode(test);
IT's My AJAX Call For Post
$.ajax({
//https://www.xxxxxxxxx.com/yyyyyyyyy/zzzzzzzzzzzz.svc/InsertRegistrationDetailsoverHTTPS?AuthToken={AUTHTOKEN}&RegName={REGNAME}&selGender={SELGENDER}&UserName={USERNAME}&UserPass={USERPASS}
url: "https://www.XXXXXXX/YYYYYY/ZZZZZZZZ.svc /InsertRegistrationDetailsoverHTTPS?AuthToken=" + decodertr + "&RegName=" + encodeRname + "&selGender=" + encodeRgender + "&UserName=" + encodeRemail + "&UserPass=" + encodeRpwd,
type: "POST",
contentType: "application/javascript",
dataType: "jsonp",
success: function (msg) {
},
error: AjaxFailed
});
function AjaxSucceeded(result) {
alert("success");
}
function AjaxFailed(result) {
alert('Error is : ' + result.status + ' ' + result.statusText);
}
Your error handling function must be defined like the following:
$.ajax({
//https://www.xxxxxxxxx.com/yyyyyyyyy/zzzzzzzzzzzz.svc/InsertRegistrationDetailsoverHTTPS?AuthToken={AUTHTOKEN}&RegName={REGNAME}&selGender={SELGENDER}&UserName={USERNAME}&UserPass={USERPASS}
url: "https://www.XXXXXXX/YYYYYY/ZZZZZZZZ.svc /InsertRegistrationDetailsoverHTTPS?AuthToken=" + decodertr + "&RegName=" + encodeRname + "&selGender=" + encodeRgender + "&UserName=" + encodeRemail + "&UserPass=" + encodeRpwd,
type: "POST",
contentType: "application/javascript",
dataType: "jsonp",
success: function (msg) {
},
error: function (error) {
// your error handling
}
});

processing return from ajax call

I'm using the twitter-bootstrap's typeahead to do autocompletion on an input field.
What I have so far:
$(".airportSearch").typeahead({
source: function(typeahead, query) {
$.ajax({
url: url_,
dataType: "json",
data: {
n: 12,
q: typeahead
},
success: function(data) {
var return_list = [], i = data.length;
while(i--) {
return_list[i] = {
type: data[i].type,
id: data[i].iata,
value: data[i].city,
returnvalue: data[i].type == 'city' ? data[i].city + ' [' + data[i].iata + ']' :
data[i].city + ' (' + data[i].iata + ')'
};
}
}
});
}
});
example of output:
[{"type":"airport","city":"Quebec","airport":"Quebec","iata":"YQB","country":"Canada","locationId":"airport_YQB"},
{"type":"airport","city":"Queenstown","airport":"Queenstown","iata":"ZQN","country":"New Zealand","locationId":"airport_ZQN"},
{"type":"city","city":"Setif","airport":"All Airports","iata":"QSF","country":"Algeria","locationId":"DZ_city_QSF"},
{"type":"airport","city":"Setif","airport":"Setif","iata":"QSF","country":"Algeria","locationId":"airport_QSF"},
{"type":"airport","city":"QachaS Nek","airport":"QachaS Nek","iata":"UNE","country":"Lesotho","locationId":"airport_UNE"},
{"type":"airport","city":"Qaisumah","airport":"Qaisumah","iata":"AQI","country":"Saudi Arabia","locationId":"airport_AQI"}]
I have logged the return_list variable that I create and have confirmed that it is the expected list of objects I have created. I want to populate the autocomplete options with the returnvalue strings in the list of objects.
Could anyone tell me how, or point me to somewhere that tells me how?
Try this:
$(".airportSearch").typeahead({
source: function(typeahead, process) {
return $.ajax({ // return ajax result
url: url_,
dataType: "json",
data: {
n: 12,
q: typeahead
},
success: function(data) {
var return_list = [], i = data.length, data_vals = []; // add data_vals array for typeahead
while(i--) {
return_list[i] = {
type: data[i].type,
id: data[i].iata,
value: data[i].city,
returnvalue: data[i].type == 'city' ? data[i].city + ' [' + data[i].iata + ']' :
data[i].city + ' (' + data[i].iata + ')'
};
data_vals.push(return_list[i].returnvalue); // populate the needed values
}
return process(data_vals); // and return to typeahead
}
});
}
});
Normally I would populate the data_vals for typeahead only but you did it your way for your reason I guess.
Hope it helps.

MVC4 #Html.Checkboxfor issue with Ajax call

I was working with MVC CheckBox for.
#Html.CheckBoxFor(m=>m.IsActive, new { #id = "IsActive",#checked = "checked" })
if ($('#frmmenu').valid())
{
//alert("MenuTitle=" + $("#MenuTitle").val() + "&OrderNumber=" + $("#OrderNumber").val() + "&IsActive=" + $("#IsActive").val());
alert("MenuTitle=" + $("#MenuTitle").val() + "&OrderNumber=" + $("#OrderNumber").val() + "&IsActive=" + $("#IsActive").val());
$.ajax({
type: 'POST',
url: '/api/MenuWebApi/SetMenu',
data: "MenuTitle=" + $("#MenuTitle").val() + "&OrderNumber=" + $("#OrderNumber").val() + "&IsActive=" + $("#IsActive").val(),
success: function (data)
{
if (data.Success == true)
{
//window.location = '/Profile/UserProfile';
}
},
error: function (xhr, textStatus, errorThrown)
{
//window.location = JsErrorAction;
},
dataType: "json",
headers:
{
'RequestVerificationToken': JsTokenHeaderValue
}
});
}
return false;
with passing data when checkbox is checked it is giving true value, but if unchecked then it will give true value not false, how could i do?
please help me anyone.
Regards
Try with this:
var isActive = ($('#IsActive').attr('checked') == 'checked');
// $('#IsActive').attr('checked') will return
// 'checked' or undefined - if not checked/not containing 'checked' attribute

AJAX call to Justin TV API failing with JSON format

I'm trying to make a simple AJAX call to the Justin TV API, which seems to be failing consistently.
When making the AJAX call with url1, the console reports Object { readyState=4, status=200, statusText="success"}, yet it falls into the error function of the AJAX call. When visiting the URL with my browser, I notice the returned data is [{ ... json ...}].
When making the AJAX call with 'url', the call passes, entering the success function. I notice the returned object is { ...json... }.
How do I get a valid JSON object out of the AJAX request for url1?
Here's a snip of what I'm doing:
var url1 = "http://api.justin.tv/api/stream/list.json"
var url = "https://api.twitch.tv/kraken/streams/";
channelNames = "";
for (channelName in streams)
{
channelNames = channelNames + ',' + channelName;
}
channelNames = channelNames.slice(1);
console.log(channelNames);
console.log(url1);
$.ajax({
url: url1,
type: 'GET',
crossDomain: true,
dataType: 'jsonp',
data: { channel : channelNames },
success: function(data)
{
console.log(data);
if(data.streams.length > 0)
{
$("#streamStatus").html("<ul class='zebra'>");
for(i = 0; i < data.streams.length; i++)
{
stream = data.streams[i];
channel = data.streams[i].channel;
listItem = "<li id='stream"+i+"'>";
streamName = "<span class='name'>" + streams[stream.name.slice(10)] + "</span>";
viewers = "<span class='viewers'>viewers:" + stream.viewers + "</span>";
gameName = "<div class='game'>" + ((channel.game != null) ? channel.game : "No Game Specified") + "</div>";
listItem += streamName + viewers + gameName + "</li>";
screenCap = "<div class='screenCap' style='display:none;'>" + channel.screen_cap_url_small + "</div>"
$("#streamStatus ul.zebra").append(listItem);
$("#streamStatus ul.zebra").append(screenCap);
//console.log(channel);
}
$("#streamStatus").append("</ul>");
}
},
error: function(data)
{
console.log(data);
}
EDIT: Here is the working solution...
var url1 = "http://api.justin.tv/api/stream/list.json"
var url = "https://api.twitch.tv/kraken/streams/";
channelNames = "";
for (channelName in streams)
{
channelNames = channelNames + ',' + channelName;
}
channelNames = channelNames.slice(1);
console.log(channelNames);
console.log(url1);
$.ajax({
url: url1,
type: 'GET',
crossDomain: true,
dataType: 'jsonp',
jsonp: 'jsonp',
data: { channel : channelNames },
success: function(data)
{
...
},
error: function(data)
{
console.log(data);
}
You're passing jsonp as the dataType in the ajax call. They're not interchangeable.
As you've noted yourself, the data returned from url1 is JSON, not JSONP: JSONP requires wrapping the returned JSON data in a javascript function call.
A mismatch like this between dataType and the data in the response body will always cause the ajax call to fail.

Resources