We Keep Coding

Change cache if language is changed

I have method who populate menu, it be like:
function MenuPopulate(url, listname, target) {
var lang = "Espanol";
if ((window.location.href.indexOf("lang=en") > 0)) {
lang = "English";
}
$(function () {
$.ajax({
url: "https://myapi.company.com/api/myapi/getmenu?idioma=" + lang ,
async: false,
type: 'GET',
dataType: "json",
success: function (data) {
console.log(data);
completeMenu(data, target)
//localStorage.setItem('data', JSON.stringify(data))
},
error: function (response) {
failureMenu(response, target)
}
});
});
}
function completeMenu(data, target) {
var prefix = "<ul class='nav navbar-nav navbar-right'>";
var sufix = "</ul>";
var items = data;
var menu = "";
for (item in items) {
if(items[item].Titile == "JOIN US" ){
menu += "<li><a href='#mymodal' data-toggle='modal' data-target='#mymodal'>" + items[item].Titile + "</a></li><li class='divider-vertical'></li>"
}
else if(items[item].Titile == "CONTACT US"){
menu += "<li><a href='#mymodal2' data-toggle='modal' data-target='#mymodal2'>" + items[item].Titile + "</a></li><li class='divider-vertical'></li>"
}
else{
menu += "<li>" + items[item].Titile + "</li><li class='divider-vertical'></li>";
}
}
$(target).html(prefix + menu + sufix);
}
function failureMenu(data, target) {
console.log(data);
$(target).text("Ocurrió un error en la carga del menú. Por favor revise la consola para más información");
}
And it runs perfectly except for the time to load page, so now I store methods in cache with localStorage , so I made this class:
$(document).ready(function() {
GetGlobal();
});
function GetGlobal() {
var lang = "Espanol";
if ((window.location.href.indexOf("lang=en") > 0)) {
lang = "English";
}
var page = window.location.pathname.replace("/SitePages/", "");
if (localStorage.getItem("Menu") == null) {
$.ajax({
url: "https://myapi.company.com/api/myapi/getglobalresources?idioma=" + lang + "&pagina=" + page,
async: false,
type: 'GET',
dataType: "json",
success: function(data) {
CompleteGlobal(data);
//alert("Cargo con exito");
},
error: function(data) {
//failureGlobal(data);
alert("No cargo");
}
})
} else {
// alert("la cookie esta cargada");
CargaGlobal();
//localStorage.getItem("Menu")
}
}
function CargaMenu() {
$.ajax({
url: "https://myapi.company.com/api/myapi/getmenu?idioma=" + lang,
async: false,
cache:true,
type: 'GET',
dataType: "json",
success: function(data) {
console.log(data);
completeMenu(data, target)
},
error: function(response) {
failureMenu(response, target)
}
});
}
function CompleteGlobal(data) {
data.Menu //lista de menus
data.Pie // lista pie de pagina
data.Mapa
data.Ligas
localStorage.setItem("Menu", JSON.stringify(data.Menu));
localStorage.setItem("Pie", JSON.stringify(data.Pie));
localStorage.setItem("Mapa", JSON.stringify(data.Mapa));
localStorage.setItem("Ligas", JSON.stringify(data.Ligas));
localStorage.setItem("Enlace", JSON.stringify(data.Enlace));
CargaGlobal();
}
function CargaGlobal() {
completeMenu(JSON.parse(localStorage.getItem("Menu")), "#BarraNavegacion");
completeSiteMap(JSON.parse(localStorage.getItem("Mapa")), "#MapaSitio");
completeImgLinks(JSON.parse(localStorage.getItem("Enlace")), "#EnlacesImagen");
completeFooter(JSON.parse(localStorage.getItem("Pie")), "#Footer");
}
function completeBanner3(target) {
var items = localStorage.getItem("Menu");
var menu = "";
for (var item in items) {
menu += "<div class='col-md-4 text-center'><div><a href='" + items[item].Enlace + "'><img src='" + items[item].Imagen + "' class='img-responsive img-center' /></a></div><div class='t02 text-center'>" + items[item].Titulo + "</div><div class='t03 text-center'>" + items[item].Descripcion + "</div></div>";
}
$(target).html(menu);
}
But when I change language of my site it just no load the other language menu, and I think to load cookie again if language is different to "Espanol" so I think I can do something like
if (localStorage.getItem("Menu") == null && lang == "Espanol") {
$.ajax({
url: "https://myapi.company.com/api/myapi/getglobalresources?idioma=" + lang + "&pagina=" + page,
async: false,
type: 'GET',
dataType: "json",
success: function(data) {
CompleteGlobal(data);
//alert("Cargo con exito");
}else if(localStorage.getItem("Menu") == null && lang == "English"){
$.ajax({
url: "https://myapi.company.com/api/myapi/getglobalresources?idioma=" + lang + "&pagina=" + page,
async: false,
type: 'GET',
dataType: "json",
success: function(data) {
CompleteGlobal(data);
},
error: function(data) {
alert("No cargo");
}
})
} else {
CargaGlobal();
}
}
But it doesn´t works, any idea what I need to do in this case? Regards

Instead of saving individual parts to the localStorage, sometimes it's easier just to get and fetch an object by using JSON.parse and JSON.stringify.
This is a rather long example, but I commented it a lot to try to make it easier to follow. It's an illustration of various concepts so it doesn't exactly solve your problem, but I believe it will get you closer to a solution.
EDIT: The StackOverflow script runner does not like localStorage. Here's a JSFiddle to see it in action: https://jsfiddle.net/subterrane/9prr5ks6/
EDIT, EDIT: Also, I don't speak Spanish, so blame Google Translate for the silly menu button labels.
var lang = "Espanol";
if ((window.location.href.indexOf("lang=en") > 0)) {
lang = "English";
}
// function to getMenuData
function getMenuData() {
// get the saved data from localStorage
var menuData = JSON.parse(localStorage.getItem('menuData'));
// if it doesn't exist, or if our language is missing, fetch the data from the server
if (menuData == null || menuData[lang] == null) {
// this is a stub function. Pretend it's doing an ajax request
// the second argument here is a callback function. It would be
// the ajax success function.
fetchMenuData(lang, function(data) {
// if we did have some of the data, use it, or start with an empty object
menuData = menuData || {};
// set the server response to the menuData object
menuData[lang] = data;
// stringify the object and stash it in localStorage
localStorage.setItem('menuData', JSON.stringify(menuData));
// display the menu
displayMenu(menuData);
});
} else {
// we go the data from the cache, so display the menu
displayMenu(menuData);
}
}
// this is a fake function that pretends to get menuData from a server
function fetchMenuData(lang, callback) {
// wait 2 seconds, then call the response function
setTimeout(response, 2000);
// response function sends some data back to the callback depending on the requested language
function response() {
callback(lang == "Espanol" ? [{
name: 'Casa',
link: 'something.html'
}, {
name: 'Lejos',
link: 'somethingelse.html'
}] : [{
name: 'Home',
link: 'something.html'
}, {
name: 'Away',
link: 'somethingelse.html'
}]);
}
}
// function to display the menu
function displayMenu(data) {
// update the text in some of the buttons
document.getElementById('home').innerHTML = data[lang][0].name;
document.getElementById('away').innerHTML = data[lang][1].name;
// looks kinda funny, but this just puts the opposite of the current language
// on the button to make it feel like a toggle button
document.getElementById('toggle').innerHTML = lang == "Espanol" ? "English" : "Espanol";
// show the menu now that it's filled in
document.getElementById('menu').classList.remove('hide');
}
// set up a click handler on the language toggle button
document.getElementById('toggle').addEventListener('click', function() {
// hide the menu while we mess with it. Could take a while to get the menu
// data back from our 'server'
document.getElementById('menu').classList.add('hide');
// set the language to the opposite of whatever it was before
lang = lang == "Espanol" ? "English" : "Espanol";
// get the menu data from the cache or server
getMenuData();
});
// kick it all off by getting the menu data from the server
getMenuData();
.hide {
display: none;
}
<link href="//cdnjs.cloudflare.com/ajax/libs/skeleton/2.0.4/skeleton.min.css" rel="stylesheet" />
<div class="container">
<div id="menu" class="hide">
<button id="home"></button>
<button id="away"></button>
<button id="toggle"></button>
</div>
</div>

Ajax-ing JavaScript variable to Django view getting: AttributeError: 'WSGIRequest' object has no attribute 'data'

I am trying to send my JavaScript this.click variable from my .js file to my Django view class Click using Ajax and getting the following error message...
AttributeError: 'WSGIRequest' object has no attribute 'data'
Here is my view...
class Clicks(View):
def post(self, request):
clicks = request.data.get('clicks')
return JsonResponse({'status': True})
Here is my .js files ajax...
var image_movement = function(){ //Handles movement of tug of war image
this.total = 18
this.clicks = 0
this.move = function(num){ //Adds or subtracts one from total depending on which player calls it
if(this.total == 0){
$('#onewon').show();
$.ajax({
headers: {
'Content-Type':'application/json',
'X-CSRFToken': getCookie('csrftoken')
},
url: 'click',
type: "POST",
data: {clicks: this.clicks},
success:function(response){
alert("success: " + response);
},
error:function (xhr, textStatus, thrownError){
alert("failure: " + xhr.statusText);
}
}).done(function (response) {
alert("end");
});
Here is my .js files function for obtaining cookie to give to ajax header...
function getCookie(name) {
var cookieValue = null;
if (document.cookie && document.cookie != '') {
var cookies = document.cookie.split(';');
for (var i = 0; i < cookies.length; i++) {
var cookie = jQuery.trim(cookies[i]);
if (cookie.substring(0, name.length + 1) == (name + '=')) {
cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
break;
}
}
}
return cookieValue;
}
var csrftoken = getCookie('csrftoken');
}
Here is my url...
url(r'^click$', Clicks.as_view()),
Things that I have tried...
1) Using clicks = request.DATA.get('clicks') instead of clicks = request.data.get('clicks') (get the same error as above)
2) Switching to own specific class based view to avoid any interference.

I can't find anything in the Django Request object docs about request.data. Is it possible that you mean request.body?
On the other hand, Django Rest Framework does add a data attribute to the request object, but if that's the case - if your using DRF - you should make sure to import View from DRF and not from django.

Make a textbox visible and other css changes on ajax success

function getSearchClients() {
console.log('Inside searchClient');
$('#progressbar').show();
var searchClientPhone = document.getElementById('searchClientCellPhoneNo').value;
$.ajax({
type:"POST",
data: "searchClientPhone=" + searchClientPhone,
url: "searchClientCellPhoneNo",
success: function(result){
$("#progressbar").hide();
$("#example td").each( function() {
var thisCell = $(this);
var cellValue = parseInt(thisCell.text());
if (!isNaN(cellValue) && (cellValue >= document.getElementById("selectedClientRewardPoints").value)) {
thisCell.css("background-color","#FF0000");
}
}
);
$("#selectedClientName").show();
$("#selectedClientRewardPoints").show();
window.location.reload(true);
}
});
}
The textboxes do not become visible in the ajax success, though I have verified control goes to the success block.

I think this is because of window.location.reload(true), why do you think to reload the page again!!
As per my understand, when the page is reloaded for a second time, the search input parameter becomes null/empty, so in this snippet var cellValue = parseInt(thisCell.text()); cellValue is null/undefined.
Because of this, the following two lines do not function as expected
$("#selectedClientName").show();
$("#selectedClientRewardPoints").show();

If you want to keep your status like :
$("#progressbar").hide();
$("#selectedClientName").show();
$("#selectedClientRewardPoints").show();
you should store a boolean in the user localstore or a cookie (on ajax success). Then on the page just have a document ready:
$(document).ready({
if(localstorage/cookie) { / check the status of your cookie or localstorage
$("#progressbar").hide();
$("#selectedClientName").show();
$("#selectedClientRewardPoints").show();
// clear the cookie or the localstorage
}
});
I hope this gives you an idea man...

There were a few things wrong. Primarily you were reloading the page, which is probably the main issue.
Also you had a few small issues with your number parsing and validating. I have fixed it below.
function getSearchClients() {
console.log('Inside searchClient');
$('#progressbar').show();
var searchClientPhone = $('#searchClientCellPhoneNo').val();
$.ajax({
type: "POST",
data: "searchClientPhone=" + searchClientPhone,
url: "searchClientCellPhoneNo",
success: function (results) {
$("#progressbar").hide();
$("#example td").each(function () {
var thisCell = $(this);
var cellText = thisCell.text();
// This will update your textbox...
$("#selectedClientName").val(result.clientName);
// And this is an example of updating based on an array of data.
result.transactions.forEach(function(result){
// Create a list item and append it to the list.
$('<li></li>').text(result).appendTo('#resultList');
});
// If the cell text is a number...
if (!isNaN(cellText)) {
// Parse the text to a base 10 integer...
var cellValue = parseInt(thisCell.text(), 10);
if (cellValue >= $("#selectedClientRewardPoints").val()) {
thisCell.css("background-color", "#FF0000");
}
}
});
$("#selectedClientName").show();
$("#selectedClientRewardPoints").show();
// Do not reload the page.
}
});
}

Thanks #JimmyBoh for the pointers, this is how I fixed the issue :
1) Used struts2-json library. In struts.xml, added below:
<package name="json" extends="json-default">
<action name="searchClientCellPhoneNo" class="com.intracircle.action.RedeemAction" method="searchClientCellPhoneNo">
<result type="json">
<param name="root">jsonData</param>
</result>
</action>
</package>
2) In the action class, added a jsonData Map as follows :
private Map<String,Object> jsonData = new HashMap<String,Object>();
Added getters and setters for jsonData
public Map<String,Object> getJsonData() {
return jsonData;
}
public void setJsonData(Map<String,Object> jsonData) {
this.jsonData = jsonData;
}
In the action method, added data to be returned to jsp to the jsonData Map as follows :
public String searchClientCellPhoneNo() {
clientList = userdao.getClientsList(searchClientPhone);
if(clientList != null && clientList.size() > 0) {
selectedClientName = clientList.get(0).getProfileName();
jsonData.put("selectedClientName",selectedClientName);
int storeId = ((Stores)SecurityUtils.getSubject().getSession().getAttribute(SESSION_CONSTANTS.SESSION_STORE)).getStoreId();
selectedClientRewardPoints = redeemDao.getCountRewardPointsForClientForStore(storeId, clientList.get(0).getId());
jsonData.put("selectedClientRewardPoints", selectedClientRewardPoints);
}
viewRedeemScheme();
return SUCCESS;
}
3) In the jsp ajax method, did the following changes : Make sure, you add dataType:'json' and if you want to print the ajax result using alter, stringify it.
$.ajax({
type:"GET",
data: "searchClientPhone=" + searchClientPhone,
url: "searchClientCellPhoneNo",
dataType: 'json',
headers : {
Accept : "application/json; charset=utf-8",
"Content-Type" : "application/json; charset=utf-8"
},
success: function(result){
alert("result: " + JSON.stringify(result));
console.log("Result " + result);
$("#selectedClientName").val(result.selectedClientName);
$("#selectedClientRewardPoints").val(result.selectedClientRewardPoints);
$("#progressbar").hide();
$("#example td").each( function() {
var thisCell = $(this);
var cellValue = parseInt(thisCell.text());
if (!isNaN(cellValue) && (cellValue >= document.getElementById("selectedClientRewardPoints").value)) {
thisCell.css("background-color","#FF0000");
}
}
);
$("#selectedClientName").show();
$("#selectedClientNameLabel").show();
$("#selectedClientRewardPointsLabel").show();
$("#selectedClientRewardPoints").show();
}
});
Thanks everyone for the help, especially #JimmyBoh.

JQuery AJAX contents executing multiple times

I have a web page that searches for an address using a web-service from a GIS server. I call this web-service in a JQuery AJAX method on the click of a button. Within the AJAX success function I map the address values to controls on the page. Before that, I do a check on the user role.
The check itself is not important. If the check fails, I alert() the user. The issue I'm having is that the alert() is repeated 6 times whenever the check fails. When debugging it looks like the AJAX call is not repeated multiple times.
function SelectAddress() {
var url = $.url.build({
protocol: 'https',
host: 'maps.site.co.za',
path: '/arcgis/rest/services/Search_Layers/SL_ADD/MapServer/find',
params: {
'searchText': SelectedAddressIsisKey,
'Contains': 'True',
'searchFields': 'ISIS Key',
'Layers': 0,
'returnCountOnly': 'false',
'returnZ': 'false',
'returnM': 'false',
'f': 'pjson'
}
});
$.ajax({
url: url,
type: 'GET',
cache: false,
dataType: 'jsonp',
success: function (data) {
// call autocomplete callback method with results
$.map(data.results[0].value, function (item) {
var _role = document.getElementById('txtRole').value;
var _addressNo = data.results[0].attributes['Addr No'];
var _suffix = data.results[0].attributes['Address No Suffix'];
var _streetName = data.results[0].attributes['Street Name'];
var _streetType = data.results[0].attributes['Street Name Type'];
var _suburb = data.results[0].attributes['Official Suburb Name'];
var _ward = data.results[0].attributes['Ward Name'];
var _subCouncil = data.results[0].attributes['Subcouncil Name'];
var _erfNo = data.results[0].attributes['Property Number'];
var _isisKey = data.results[0].attributes['ISIS Key'];
var _subCouncilNo = _subCouncil.substr(_subCouncil.length - 2, 2);
//Check Subcouncil of logged in user
if (_role == "Admin" || _role.substr(_role.length - 2, 2) == _subCouncilNo) {
document.getElementById('<%=TextBoxAddressNumber.ClientID%>').value = _addressNo;
document.getElementById('<%=ddlAddressSuffix.ClientID%>').value = _addressNo;
document.getElementById('<%=TextBoxRoad.ClientID%>').value = _streetName + " " + _streetType;
document.getElementById('<%=TextBoxSuburb.ClientID%>').value = _suburb;
document.getElementById('<%=ddlWard.ClientID%>').value = _ward;
document.getElementById('<%=ddlSubCouncil.ClientID%>').selectedIndex = _subCouncilNo;
document.getElementById('<%=txtErf.ClientID%>').value = _erfNo;
document.getElementById('<%=lblLISKey.ClientID%>').value = _isisKey;
jQuery('#Search-modal').dialog('close');
//return;
}
else {
alert("Error: This address is in Sub-Council " + _subCouncilNo);
//jQuery('#Search-modal').dialog('close');
}
//return;
});
},
error: function (XMLHttpRequest, textStatus, errorThrown) {
alert('error - ' + textStatus + errorThrown + XMLHttpRequest);
//console.log('error', textStatus, errorThrown);
}
});
}

I see.
jQuery.map()
Description: Translate all items in an array or object to new array of items.
So, what I need to do is this:
$.map(data.results[0].value[0], function (item) { ... }

Crm 2013 button to open new lead form passing firstselected contact

I Have added a Add New Lead button to the Homepage Main form of contacts
This calls a script to open a new form passing Crm Parameter FirstSelectedItemId
So when I have selected a contact I can click create new lead & pass the Id as a parameter to the function:
function openNewLead(SelectedID) {
parameters["customer"] = SelectedID;
Xrm.Utility.openEntityForm("lead", null, parameters);
}
"customer" is a lookup field
Now I can use this and it populates the lookup but im not passing the full name so doesn't work correctly. if I save and refresh its fine!
So I tried:
function openNewLead(SelectedID) {
if (SelectedID != null) {
var parameters = {};
var request = Xrm.Page.context.getServerUrl() + "/XRMServices/2011/OrganizationData.svc/ContactSet?$select=FullName&$filter=ContactId eq guid'" + SelectedID + "'";
$.ajax({
type: "GET",
contentType: "application/json; charset=utf-8",
datatype: "json",
url: request,
async: false,
beforeSend: function (XMLHttpRequest) {
XMLHttpRequest.setRequestHeader("Accept", "application/json");
},
success: function (data, textStatus, XmlHttpRequest) {
if (data.d.results.length > 0) {
var lookupValue = new Array();
lookupValue[0] = new Object();
lookupValue[0].id = SelectedID;
lookupValue[0].name = data.d.results[0].FullName;
lookupValue[0].entityType = "contact";
parameters["customer"] = lookupValue;
}
},
error: function (XmlHttpRequest, textStatus, errorThrown) {
/*Error Occurred*/
}
});
Xrm.Utility.openEntityForm("lead", null, parameters);
}
else {
Xrm.Utility.openEntityForm("lead");
}
}
This doesn't work from the homepage/main screen as no reference can be added for Json
So the question is how do I reference json from here or is there a better way to write this?
Thank you

Try this change
success: function (data, textStatus, XmlHttpRequest) {
if (data.d.results.length > 0) {
parameters["customerid"] = SelectedID;
parameters["customeridname"] = data.d.results[0].FullName;
parameters["customeridtype"] = "contact";
}
}

Solution:
New lead Button on main/homepage This calls a script to open a new form passing CrmParameter FirstSelectedItemId
function openNewLead(SelectedID) {
if (SelectedID != null) {
var parameters = {};
var contact = {};
contact.Id = SelectedID;
var jsonContact = JSON.stringify(contact);
var PassContactReq = new XMLHttpRequest();
PassContactReq.open("GET", Xrm.Page.context.getServerUrl() + "/XRMServices/2011/OrganizationData.svc/ContactSet?$select=ContactId, FullName&$filter=ContactId eq guid'" + SelectedID + "'");
PassContactReq.setRequestHeader("Accept", "application/json");
PassContactReq.setRequestHeader("Content-Type", "application/json; charset=utf-8");
PassContactReq.onreadystatechange = function () {
PassContact(this);
};
PassContactReq.send(jsonContact);
function PassContact(PassContactReq) {
if (PassContactReq.readyState == 4 /* complete */) {
PassContactReq.onreadystatechange = null; //avoids memory leaks
if (PassContactReq.status == 200) {
//Success
parameters["customer"] = JSON.parse(PassContactReq.responseText).d.results[0].ContactId;
parameters["customername"] = JSON.parse(PassContactReq.responseText).d.results[0].FullName;
Xrm.Utility.openEntityForm("lead", null, parameters);
}
else {
//Failure
Xrm.Utility.openEntityForm("lead");
}
}
};
} else {
Xrm.Utility.openEntityForm("lead");
}
}
Awesome :) thanks #Nicknow for comment!
As this was a custom lookup field the name differs for the parameters too: Ignore the "id" part of the string & no type to set.
Took too long to find this solution so hopefully it will help others :)

try add javascript actions with referenced webresources and some dummy function name. Like "isNaN".
Ribbon Xml will looks like:
<Actions>
<JavaScriptFunction FunctionName="isNaN" Library="new_json2"></JavaScriptFunction>
<JavaScriptFunction FunctionName="isNaN" Library="new_jquery"></JavaScriptFunction>
<JavaScriptFunction FunctionName="someFunctionUsingCoolExternalLibs" Library="new_referencinglibrary"></JavaScriptFunction>
</Actions>
Sorry for my english :)