Knockout.JS click binding passes null to handler function - javascript

I have an HTML button with the following binding:
<td><button data-bind="click: $root.goOrder">Order</button></td>
that is part of a table populated with a knockout.js ajax callback. This all works fine but when
I click the button and the "$root.goOrder" function is called as defined here:
self.goOrder = function(client) {
alert(JSON.stringify(client));
$.ajax({
url: "api/GetClient",
type: "GET",
dataType: "json",
data: JSON.stringify(client.id),
contentType: 'application/json; charset=utf-8',
success: function(data) {
if (data) {
//Will redirect to order page from here
}
},
error: function(jqXHR, textStatus, errorThrown) {
alert(errorThrown);
}
});
};
The alert(JSON.stringify(client)) line shows the client parameter to be [] or undefined.
What am I doing wrong?

Related

Firebase Dynamic Link Creation With JavaScript

var object={
"longDynamicLink": "https://[APP_NAME].page.link/?link=[LINK_HERE]",
"suffix":{
"option":"SHORT"
}
}
$.ajax({
url: 'https://firebasedynamiclinks.googleapis.com/v1/shortLinks?key=[KEY_HERE]',
type: 'POST',
dataType: "json",
data: object,
success: function(response, textStatus, jqXHR) {
alert(response.shortLink);
},
error: function(jqXHR, textStatus, errorThrown){
alert(textStatus, errorThrown);
}
});
The above code works if the "suffix" is deleted from the request. That makes an "UNGUESSABLE" url, but I want a short URL. As stated in the documentation at https://firebase.google.com/docs/dynamic-links/rest?authuser=0 I added the suffix option parameter, but it results with a 400 response. Any ideas why?
I haven't ever tried this but, ...
POST https://firebasedynamiclinks.googleapis.com/v1/shortLinks?key=api_key
var params = {
"longDynamicLink": "https://example.page.link/?link=http://www.example.com/&apn=com.example.android&ibi=com.example.ios",
"suffix": {
"option": "SHORT"
}
}
$.ajax({
url: 'https://firebasedynamiclinks.googleapis.com/v1/shortLinks?key=[KEY_HERE]',
type: 'POST',
data: jQuery.param(params) ,
contentType: "application/json",
success: function (response) {
alert(response.status);
},
error: function () {
alert("error");
}
});

500 Internal Server Error in ajax when calling web server method in C#

When I am calling server method from AJAX call at that time showing 500 internal server error. And this error also happens sometimes only, while sometimes it is working fine.
I am really confused that what is going on that it is sometimes working and sometimes not working. In fact I didn't change anything after working the code but when I check second day it is coming this type of error.
Here is my code
<input type="button" id="btn_save" value="Save" class="button" />
$(document).on("click", "#btn_save", function (e) {
$.ajax({
type: "POST",
url: "schoolregistration.aspx/EntrySave",
data: JSON.stringify({ schoolName: $('#txt_schoolname').val() }),
contentType: "application/json; charset=utf-8",
dataType: "json",
success: OnSuccess,
failure: function () {
document.getElementById("txt_schoolname").value = "";
alert("Error! Try again...");
}
});
});
function OnSuccess(response) {
document.getElementById("txt_schoolname").value = "";
alert(response.d);
}
[WebMethod]
public static string EntrySave(string schoolName)
{
//Here is the code
}
Sometimes working fine but sometimes not coming call in this entrysave method.
try this:
$.ajax({
type: "POST",
url: "schoolregistration.aspx/EntrySave",
data: { "schoolName": $('#txt_schoolname').val() },
contentType: "application/json; charset=utf-8",
dataType: "json",
success:function (data) {alert('ok');},
error: function () {alert('error');}
});

how to get the value from json object that have a similar id

im sending a ajax call that return a json like this
{"2":"/orangehrm/symfony/web/index.php/pim/viewPhoto/empNumber/1","3":"/orangehrm/symfony/web/index.php/pim/viewPhoto/empNumber/2","1":"/orangehrm/symfony/web/webres_552df88c832965.06437943/orangehrmMessengerPlugin/image/default-photo.png"}
the calling function have argument passed this is a integer
i want to get the value that correspond to given id for example 2 how to do this
is the way im using correct
function getUrl(sid){
$.ajax({
type: 'POST',
url: shortUrl + 'messenger/getImgUrls',
data: {suids: [sid]},
dataType: 'json',
async: false,
cache: true,
success: function (msg) {
conversationId = msg.sid;
},
error: function (xhr, textStatus, errorThrown) {
console.log(xhr.status);
console.log(errorThrown);
console.log(xhr.responseText);
}
});}
}
figured it out
have to use
conversationId = msg[sid];

jQuery: Calling a function from AJAX request

I'm trying to call a function when I get success from my ajax call, but it's not working. This is what I've tryed so far.
function dtMRPReasonCode(dt) {
var data = null;
jQuery.ajax({
type: "POST",
data: {},
url: "Index.aspx/getMRPReasonCodeReport",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
if (msg.d) {
console.log(dt);
console.log(msg.d);
buildTableBody(dt, msg.d);
}
},
error: function(xhr, ajaxOptions, thrownError) {
alert("Error: dtMRPReasonCode");
}
});
return false;
}
function buildTableBody(dt, obj) {
dt.fnClearTable();
data = [];
$(obj).each(function(index, value) {
element = [];
element.push(value.Metric);
element.push(value.Region);
element.push(value.Plant);
element.push(value.Customer);
element.push(value.IMAC);
element.push(value.NotFilled);
element.push(value.Filled);
element.push(value.Total);
data.push(element);
});
dt.fnAddData(data);
}
Thanks in advance!
Edit #1
I used console.log in order to show you what I got from dt and msg.d (Image)
Edit #2
If I paste the commands from buildTableBody function in the success: handler instead of calling buildTableBody function in the success: handler it actually works:
function dtMRPReasonCode(dt) {
var data = null;
jQuery.ajax({
type: "POST",
data: {},
url: "Index.aspx/getMRPReasonCodeReport",
contentType: "application/json; charset=utf-8",
dataType: "json",
success: function(msg) {
dt.fnClearTable();
data = [];
$(msg.d).each(function(index, value) {
element = [];
element.push(value.Metric);
element.push(value.Region);
element.push(value.Plant);
element.push(value.Customer);
element.push(value.IMAC);
element.push(value.NotFilled);
element.push(value.Filled);
element.push(value.Total);
data.push(element);
});
dt.fnAddData(data);
},
error: function(xhr, ajaxOptions, thrownError) {
alert("Error: dtMRPReasonCode");
}
});
return false;
}
But it makes no sense to me, since this actually should work in both ways.
Pretty sure you have a typo on your function call
buildTableBody(td, msg.d);
should be
buildTableBody(dt, msg.d);
Also what is the return type from Index.aspx/getMRPReasonCodeReport? If it is string, you've got to unescape the string before you can treat it as JSON.
Try removing contentType : "application/json utf-8" from your AJAX call. That is the type of the data sent to the server. It is likely that you want the default content type.
Unless your server-side resource was configured to accept json it likely accepts application/x-www-form-urlencoded
http://api.jquery.com/jQuery.ajax/

Conditionally adding option to jQuery Ajax call

I have the following working Ajax call -
$.ajax({
url: ajaxUrl,
type: sendHttpVerb,
dataType: 'json',
processData: false,
contentType: 'application/json; charset=utf-8',
complete: function () {
setTimeout($.unblockUI, 2000);
},
success: function (response, status, xml) {
clearTimeout(delayLoadingMsg);
$.unblockUI();
callbackFunction(response);
},
error: function (jqXHR, textStatus, errorThrown) {
clearTimeout(delayLoadingMsg);
$.unblockUI();
dcfForm.ajaxErrorDisplay(jqXHR, textStatus, errorThrown)
}
});
My problem is the I conditionally want to add an option when I invoke the Ajax call. For example, adding data: sendRequest before I issue the Ajax request.
My problem I cannot find an example for the syntax on how to do this without completely duplicating the entire function.
what about a ternary operation:
$.ajax({
data: condition ? sendRequest : undefined,
... the rest
});
If that's not your taste, some people seem to forget $.ajax doesn't take a long group of paramters, but an object:
var ajax = {};
ajax.success = function (data) { ... };
ajax.type = 'GET';
if (myCondition) {
ajax.data = sendRequest;
}
$.ajax(ajax);

Categories

Resources