Develop Reference

i am transferring control to a function written in jquery ajax

function Edit() {
var mode = 2; // 2 For Edit
var Fid = 0;
var viewName = 'MemberEditor';
var actionURL = '#Url.Action("setViewMode", "Member")';
$.ajax({
type: "POST",
data: {
Mode: mode,
lFeatureId: Fid,
ViewName: viewName
},
url: actionURL,
success: function (result) {
setViewMode(result);
}
});
}
this is the function where in i am calling setViewMode(result).
but somehow it is sot being called properly..
function setViewMode(data) {
for (keyVar in data) {
if (keyVar.search("Btn") != -1) {
jQuery('#' + keyVar).attr("disabled", data[keyVar]);
} else {
jQuery('#' + keyVar).prop("readonly", data[keyVar]);
}
}
}
The control isn't getting transferred to the loop. Can anyone help please?

I think you are getting back a JSON string. Use .$parseJSON(data) to get the contents stored.

AJAX preloader/throbber getting

Below is an AJAX function I'm trying to use to show a loader gif during the request and hide when successful. Basically I started out with the function inside of the response.success which used to work by itself. It creates short urls and sets it to the value of an input field. And I was shown the rest that wraps that function, but i'm getting a 404 error in the console for failure to load resource. I'm sure this is a straightforward answer, I'm too new to tell but I think I'm close. Any help is much appreciated, thanks.
function getShare(url)
{
$('#loader').show(); // show loading...
$.ajax({
dataType: "jsonp",
jsonpCallback:'apiCallback', // this will be send to api as ?callback=apiCallback because this api do not want to work with default $ callback function name
url: 'http://b1t.co/Site/api/External/MakeUrlWithGet',
data: {'url':url},
success: function(response){
$('#loader').hide(); // hide loading...
//respponse = {success: true, url: "http://sdfsdfs", shortUrl: "http://b1t.co/qz"}
if(response.success){
{
var s = document.createElement('script');
var browserUrl = document.location.href;
//alert(browserUrl);
if (browserUrl.indexOf("?") != -1){
browserUrl = browserUrl.split("?");
browserUrl = browserUrl[0];
}
//alert(browserUrl);
var gifUrl = $('#gif_input').value;
var vidUrl = $('#vid_input').value;
//alert(gifUrl + "|" + vidUrl);
url = encodeURIComponent(browserUrl + "?gifVid=" + gifUrl + "|" + vidUrl);
//alert(encodeURIComponent("&"));
s.id = 'dynScript';
s.type='text/javascript';
s.src = "http://b1t.co/Site/api/External/MakeUrlWithGet?callback=resultsCallBack&url=" + url;
document.getElementsByTagName('head')[0].appendChild(s);
}
function resultsCallBack(data)
{
var obj = jQuery.parseJSON(JSON.stringify(data));
$("#input-url").val(obj.shortUrl);
}
}
},
error:function(){
$('#loader').hide();
}
});
}

Javascript eval String + variable

I have a piece of javascript code evaluated at runtime, with the <%= %> syntax...
Now, inside the <%= %>, instead of a hard coded string, i'd like to have the value stored in a variable... How can I do this?
This is the function:
function updateDescriptionLabel(msgToParse, dataColumn, TextBoxID) {
var myData = JSON.parse(msgToParse.d);
alert(msgToParse);
alert(dataColumn);
alert(TextBoxID);
// this is the explicit call, it's ok
$('#' + '<%= this.TextBoxDES_MACCHINA.ClientID %>').val($.trim(myData["DescrMacchina"]));
// NOW i want to make the call by using the variable value
var txtDes = TextBoxID;
$('#' + '<%= this.' + txtDes.toString() + '.ClientID %>').val($.trim(myData["DescrMacch"]));
// BUT i get the error: Too many characters in character literal
}
============== EDIT ===============
I have a bunch of TextBoxID that, on lost focus, get a get a value from database, and display it on the appropriate TextBoxDESCRIPTION related to the ID...
But I have to duplicate the code for each TextBox, so I'd like to generalize it...
I post the entire code.
<script language="javascript" type="text/javascript">
/* ==> JSON */
//Ajax Request
function SendAjaxRequest(urlMethod, jsonData, returnFunction) {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: urlMethod,
data: jsonData,
dataType: "json",
success: function (msg) {
// Do something interesting here.
if (msg != null) {
returnFunction(msg);
}
},
error: function (xhr, status, error) {
// Boil the ASP.NET AJAX error down to JSON.
var err = eval("(" + xhr.responseText + ")");
// Display the specific error raised by the server
alert(err.Message);
}
});
}
// I'd like to generalize it ...
function SendComplexAjaxRequest(urlMethod, jsonData, returnFunction, dataColumn, TextBoxID) {
$.ajax({
type: "POST",
contentType: "application/json; charset=utf-8",
url: urlMethod,
data: jsonData,
dataType: "json",
success: function (msg) {
// Do something interesting here.
if (msg != null) {
returnFunction(msg, dataColumn, TextBoxID);
}
},
error: function (xhr, status, error) {
// Boil the ASP.NET AJAX error down to JSON.
var err = eval("(" + xhr.responseText + ")");
// Display the specific error raised by the server
alert(err.Message);
}
});
}
// ONE function for each textBox
function callUpdateGuastoAttributes(code) {
var urlMethod = '<% = ResolveClientUrl("~/Services/ws_Attributes.asmx/OdLGetMacchinaAttributes") %>';
var jsonData = "{'COD_MACCHINA':'" + code + "'}";
var successFunction = updateLabelsGuastoAttributs;
SendAjaxRequest(urlMethod, jsonData, successFunction);
}
function callUpdateCausaGuastoAttributes(code) {
var urlMethod = '<% = ResolveClientUrl("~/Services/ws_Attributes.asmx/OdLGetMacchinaAttributes") %>';
var jsonData = "{'COD_MACCHINA':'" + code + "'}";
var successFunction = updateLabelsCausaGuastoAttributs;
SendAjaxRequest(urlMethod, jsonData, successFunction);
}
// I can have only one function:
function callUpdateMacchinaAttributes(code) {
var urlMethod = '<% = ResolveClientUrl("~/Services/ws_Attributes.asmx/OdLGetMacchinaAttributes") %>';
var jsonData = "{'COD_MACCHINA':'" + code + "'}";
var successFunction = updateDescriptionLabel;
SendComplexAjaxRequest(urlMethod, jsonData, successFunction, 'DescrMacchina', 'TextBoxDES_MACCHINA');
}
/* <== CALLBACK */
function updateLabelsMacchinaAttributs(msg) {
var myData = JSON.parse(msg.d);
$('#' + '<%= this.TextBoxDES_MACCHINA.ClientID %>').val($.trim(myData["DescrMacchina"]));
}
function updateLabelsGuastoAttributs(msg) {
var myData = JSON.parse(msg.d);
$('#' + '<%= this.TextBoxDES_GUASTO.ClientID %>').val($.trim(myData["description"]));
}
function updateLabelsCausaGuastoAttributs(msg) {
var myData = JSON.parse(msg.d);
$('#' + '<%= this.TextBoxDES_CAUSA_GUASTO.ClientID %>').val($.trim(myData["description"]));
}
// BUT I have to generalize it...
function updateDescriptionLabel(msgToParse, dataColumn, TextBoxID) {
var myData = JSON.parse(msgToParse.d);
alert(msgToParse);
alert(dataColumn);
alert(TextBoxID);
// this is the explicit call
$('#' + '<%= this.TextBoxDES_MACCHINA.ClientID %>').val($.trim(myData["DescrMacchina"]));
// i want to make the call by using the variables values
var dCol = dataColumn;
var txtDes = TextBoxID;
$('#' + '<%= this.' + txtDes.toString() + '.ClientID %>').val($.trim(myData[dCol]));
// i get the error: Too many characters in character literal
}

I propose such solution (depending on your other code...) :
function updateDescriptionLabel(msgToParse, dataColumn, TextBoxID) {
var myData = JSON.parse(msgToParse.d);
alert(msgToParse);
alert(dataColumn);
alert(TextBoxID);
// this is the explicit call, it's ok
$('#' + '<%= this.TextBoxDES_MACCHINA.ClientID %>').val($.trim(myData["DescrMacchina"]));
// NOW i want to make the call by using the variable value
$('#' + TextBoxID).val($.trim(myData["DescrMacch"]));
}
and then when you call this function do this :
updateDescriptionLabel("your message", <yourcolumn>, <%= this.TextBoxDES_MACCHINA.ClientID %>);

I don't understand AJAX callbacks

I have a javascript function which executes on the change of a dropdown:
<script type="text/javascript">
$(function()
{
// Executes when the status dropdown changes value
$('select[name="status_dropdown"]').change(function(event)
{
var $this = $(event.target);
var orderId = $this.closest('tr').children('td:eq(0)').text(); // index 0 refers to the "order_id column" in the table
var result = null;
var scriptUrl = "ajax_php/update_status.php?order_id=" + orderId + "&status_id=" + this.value;
$.ajax(
{
url: scriptUrl,
type: 'get',
dataType: 'html',
async: false,
success: function(data)
{
result = data;
alert(result);
}
});
});
})
</script>
I am trying to get the alert call to show the return value of the following php code (which is true):
<?php
.
.
.
return true;
?>
The alert doesn't pop up. Anyone know why ???

I tried your code with another URL and it's working well.
There are three cases:
scriptUrl is not calculated properly and doesn't point to your PHP script
your server is down
you are accessing an URL not served under the same domain as the one of your script (same-origin policy)
You can see detail of your error if you add an error handler to ajax parameters :
error : function(jqXHR, textStatus, errorThrown) {
alert(errorThrown);
}

Return only returns a value within the php script - to output it to ajax you need to actually output the result to the page, in this case something like echo "true"; or print("true");

Try this
$(document).ready(function(){
$('select[name="status_dropdown"]').change(function(event)
{
var $this = $(event.target);
var orderId = $this.closest('tr').children('td:eq(0)').text(); // index 0 refers to the "order_id column" in the table
var result = null;
var scriptUrl = "ajax_php/update_status.php?order_id=" + orderId + "&status_id=" + this.value;
$.ajax(
{
url: scriptUrl,
type: 'get',
dataType: 'html',
async: false,
success: function(data)
{
result = data;
alert(result);
}
});
});
});

javascript alert in an if else statement not triggering

If the first part of the statement fails I am trying to send an alert. But I cannot figure out why the alert is not triggering. Yes, I have forced the statement to fail.
$("#btnSubmit").click(function (e)
{
if (<?php echo $browser; ?> >= 1)
{
var user = $("#ownerPost input").val();
var oid = <?php echo $Owner; ?>;
$.ajax(
{
type: 'POST',
url: 'follow.php',
data: "oid="+oid,
dataType: 'json',
success: function(data)
{
var id = data[0];
var name = data[1];
$('#output2').html("<b>id: </b>"+id+"<b> name: </b>"+name);
}
}
);
$("#output").html("<b>You are now following: </b>" + user);
e.preventDefault();
}
else
{
alert("You must log in to follow");
}
}
);
Here is the output from view source:
The actual number is 56 and makes the statement true and that is correct. It is when the statement is false that it will not trigger the else and hence the alert.
If I place an alert right before the else it will show the alert because first part is true.
$("#btnSubmit").click(function (e)
{if (56 >= 1){
var user = $("#ownerPost input").val();
var oid = 56;
$.ajax({
type: 'POST',
url: 'follow.php',
data: "oid="+oid,
dataType: 'json',
success: function(data){
var id = data[0];
var name = data[1];
$('#output2').html("<b>id: </b>"+id+"<b> name: </b>"+name);} });
$("#output").html("<b>You are now following: </b>" + user);
e.preventDefault();
}else{alert("You must log in to follow");}});

I think you have a syntax error. I was going to suggest a try/catch, but that will not help with a syntax error. Please edit your question and put in the "view > page source" as the others have suggested. Also, can you use Firebug, or equivalent to view the console?
EDIT:
I do get the alert with this code. Note that I set browser to 0.
blah = function(e) {
if (0 >= 1) {
var user = $("#ownerPost input").val();
var oid = 56;
$.ajax({
type : 'POST',
url : 'follow.php',
data : "oid=" + oid,
dataType : 'json',
success : function(data) {
var id = data[0];
var name = data[1];
$('#output2')
.html("<b>id: </b>" + id + "<b> name: </b>" + name);
}
});
$("#output").html("<b>You are now following: </b>" + user);
e.preventDefault();
} else {
alert("You must log in to follow");
}
};
blah.call();