google maps store locator modify hardcoded initialization to dynamic - javascript

I'm trying to modify this example
http://storelocator.googlecode.com/git/examples/panel.html
the javascript code is here:
https://gist.github.com/2725336
the aspect I'm having difficulties with is changing this:
MedicareDataSource.prototype.FEATURES_ = new storeLocator.FeatureSet(
new storeLocator.Feature('Wheelchair-YES', 'Wheelchair access'),
new storeLocator.Feature('Audio-YES', 'Audio')
);
to create the FeatureSet from a function, so for example I have this function which parses a JSON object
WPmmDataSource.prototype.setFeatures_ = function(json) {
var features = [];
// convert features JSON to js object
var rows = jQuery.parseJSON(json);
// iterate through features collection
jQuery.each(rows, function(i, row){
var feature = new storeLocator.Feature(row.slug + '-YES', row.name)
features.push(feature);
});
return new storeLocator.FeatureSet(features);
};
so then change the first code snippet to something like
WPmmDataSource.prototype.FEATURES_ = this.setFeatures_(wpmm_features);
which returns an error:
Uncaught TypeError: Object [object Window] has no method 'setFeatures_'

I think you just have to make some changes to the WPmmDataSource.prototype and your setFeatures_ method:
WPmmDataSource.prototype = {
FEATURES_ : null,
setFeatures_ : function( json ) {
//Set up an empty FEATURES_ FeatureSet
this.FEATURES_ = new storeLocator.FeatureSet();
//avoid the use of "this" within the jQuery loop by creating a local var
var featureSet = this.FEATURES_;
// convert features JSON to js object
var rows = jQuery.parseJSON( json );
// iterate through features collection
jQuery.each( rows, function( i, row ) {
featureSet.add(
new storeLocator.Feature( row.slug + '-YES', row.name ) );
});
}
}
And with this, you don't have to do the assignment by returning a value from setFeatures_; it has direct access to the FEATURES_ member. So the line:
WPmmDataSource.prototype.FEATURES_ = this.setFeatures_(wpmm_features);
is no longer necessary. This also means that later, when you have created an instance of WPmmDataSource, your code can work like this:
var wpmd = new WPmmDataSource( /* whatever options, etc. you want */ );
wpmd.setFeatures_( json );
// Thereafter, wpmd will have its FEATURES_ set
I'm not exactly sure what you are trying to achieve, but I believe this will get you over the hurdle of your current stall. I hope this gets you moving forward -

Related

ServiceNow UI Page GlideAjax

I created a form using UI Page and am trying to have some fields autopopulated onChange. I have a client script that works for the most part, but the issue arises when certain fields need to be dot-walked in order to be autopopulated. I've read that dot-walking will not work in client scripts for scoped applications and that a GlideAjax code will need to be used instead. I'm not familiar with GlideAjax and Script Includes, can someone help me with transitioning my code?
My current client script looks like this:
function beneficiary_1(){
var usr = g_user.userID;
var related = $('family_member_1').value;
var rec = new GlideRecord('hr_beneficiary');
rec.addQuery('employee',usr);
rec.addQuery('sys_id',related);
rec.query(dataReturned);
}
function dataReturned(rec){
//autopopulate the beneficiary fields pending on the user selection
if(rec.next()) {
$('fm1_ssn').value = rec.ssn;
$('fm1_address').value = rec.beneficiary_contact.address;
$('fm1_email').value = rec.beneficiary_contact.email;
$('fm1_phone').value = rec.beneficiary_contact.mobile_phone;
var dob = rec.date_of_birth;
var arr = dob.split("-");
var date = arr[1] + "/"+ arr[2] + "/" + arr[0] ;
$('fm1_date_of_birth').value = date;
}
}
fm1_address, fm1_email, and fm1_phone do not auto populate because the value is dot walking from the HR_Beneficiary table to the HR_Emergency_Contact table.
How can I transform the above code to GlideAjax format?
I haven't tested this code so you may need to debug it, but hopefully gets you on the right track. However there are a couple of steps for this.
Create a script include that pull the data and send a response to an ajax call.
Call this script include from a client script using GlideAjax.
Handle the AJAX response and populate the form.
This is part of the client script in #2
A couple of good websites to look at for this
GlideAjax documentation for reference
Returning multiple values with GlideAjax
1. Script Include - Here you will create your method to pull the data and respond to an ajax call.
This script include object has the following details
Name: BeneficiaryContact
Parateters:
sysparm_my_userid - user ID of the employee
sysparm_my_relativeid - relative sys_id
Make certain to check "Client callable" in the script include options.
var BeneficiaryContact = Class.create();
BeneficiaryContact.prototype = Object.extendsObject(AbstractAjaxProcessor, {
getContact : function() {
// parameters
var userID = this.getParameter('sysparm_my_userid');
var relativeID = this.getParameter('sysparm_my_relativeid');
// query
var rec = new GlideRecord('hr_beneficiary');
rec.addQuery('employee', userID);
rec.addQuery('sys_id', relativeID);
rec.query();
// build object
var obj = {};
obj.has_value = rec.hasNext(); // set if a record was found
// populate object
if(rec.next()) {
obj.ssn = rec.ssn;
obj.date_of_birth = rec.date_of_birth.toString();
obj.address = rec.beneficiary_contact.address.toString();
obj.email = rec.beneficiary_contact.email.toString();
obj.mobile_phone = rec.beneficiary_contact.mobile_phone.toString();
}
// encode to json
var json = new JSON();
var data = json.encode(obj);
return data;
},
type : "BeneficiaryContact"
});
2. Client Script - Here you will call BeneficiaryContact from #1 with a client script
function onChange(control, oldValue, newValue, isLoading, isTemplate) {
if (isLoading || newValue === '') {
return;
}
var usr = g_user.userID;
var related = $('family_member_1').value;
var ga = new GlideAjax('BeneficiaryContact'); // call the object
ga.addParam('sysparm_name', 'getContact'); // call the function
ga.addParam('sysparm_my_userid', usr); // pass in userID
ga.addParam('sysparm_my_relativeid', related); // pass in relative sys_id
ga.getXML(populateBeneficiary);
}
3. Handle AJAX response - Deal with the response from #2
This is part of your client script
Here I put in the answer.has_value check as an example, but you may want to remove that until this works and you're done debugging.
function populateBeneficiary(response) {
var answer = response.responseXML.documentElement.getAttribute("answer");
answer = answer.evalJSON(); // convert json in to an object
// check if a value was found
if (answer.has_value) {
var dob = answer.date_of_birth;
var arr = dob.split("-");
var date = arr[1] + "/"+ arr[2] + "/" + arr[0];
$('fm1_ssn').value = answer.ssn;
$('fm1_address').value = answer.address;
$('fm1_email').value = answer.email;
$('fm1_phone').value = answer.mobile_phone;
$('fm1_date_of_birth').value = date;
}
else {
g_form.addErrorMessage('A beneficiary was not found.');
}
}

Cloud Code add attribute to response

I need to modify / add an attribute to a Parse object before returning it, but not save it to the database.
Here's my scenario:
I do a query for a single record and when successful, I need to add a field to that object:
...
query.first({
success: function(result) {
// get current and expiration date and calculate expiration
var now = new Date();
var expiresInHours = moment(results.get("expiresAt")).diff(now, 'hours');
// set attribute
result.add("expiration", expiresInHours);
// respond to client
response.success(result);
The problem is that I always get an error, because I modified an object and didn't save it.
I would really like to return just the object instead of having to create a new object like
var answer = {"data": result, "expiration": expiresInHours};
which would work, but then I would need to change a lot of code on the client side....
Any help? Thx,
Martin.
On using the "set" method for the object, it will try to save the object where that particular column will not be there so try converting the result to a JSON and try inserting attr to the objects.
var resultsJson = [];
for (var i = 0; i<results.length; i++) {
var resultJson = (results[i].toJSON());
if (relations[results[i].get("user").id] != null) {
resultJson["relationship"] = someValue;
}
resultsJson.push(resultJson);
}
response.success(resultsJson);`

Obtain Data from two parse classes based on column in one table

I have to Parse Classes in my data browser, 'Details' and 'Content'. The 'Details' class has the following --> 'objectId', 'uuid' and 'proximity'. The 'Content' class has 'objectId', 'descId' and 'offer'.
I have created a web UI using the Javascript SDK so when the user enters the uuid, proximity and offer, uuid and proximity get stored in the 'Details' class, on success I then get the objectId of the newly created object. I then store that objectId in the 'Content' class under descId and the offer that was inputted by the user.
My problem is I have a html table that I need to populate, so I need to pull the data from both classes. The uuid and proximity from 'Details' and the offer from 'Content' so I need to do this in one query. This is my reason for storing the 'Details' objectId in the 'Content' class as a type of foreign key.
I am stuck at this cross roads and have tried include etc but I am just trying things and I'm not sure what I need to do. If anyone can help, perhaps show me a sample, I'd greatly appreciate it
Here is my js save code:
//Creating Beacon Content Parse Object
var iBeaconContent = Parse.Object.extend("Content");
var beaconContent = new iBeaconContent();
//Creating Object to save to iBeacon Description Table
var iBeaconDescription = Parse.Object.extend("Details");
var beaconDescription = new iBeaconDescription();
beaconDescription.set("uuid", tdUuid.children("input[type=text]").val().toString());
beaconDescription.set("proximity", parseInt(tdProximity.children($('prox')).val().toString()));
beaconDescription.save(null, {
success: function(beaconDescriptionObject) {
var query = new Parse.Query("Details");
query.equalTo("uuid", tdUuid.children("input[type=text]").val().toString());
query.find({
success: function(results) {
objectId = results[0].id;
beaconContent.set("descId", objectId);
beaconContent.set("offer", tdOffer.children("input[type=text]").val().toString());
beaconContent.save(null, {
success: function(object) {
document.location.reload(true);
}, error: function(beaconContent, error) {
}
});
}
});
},
error: function(error) {
}
});
NEW JAVASCRIPT
var BeaconDetail = Parse.Object.extend("Details");
var BeaconContent = Parse.Object.extend("Content");
var innerQuery = new Parse.Query(BeaconDetail);
innerQuery.exists("descId");
var query = Parse.Query(BeaconDetail);
query.matchesQuery("objectId", innerQuery);
query.find({
success:function(beaconContent){
alert("Success----lenght: " + beaconContent.length);
}
})
Sound like you need to use a compound query or relationship query. Here are some links
https://docs.parseplatform.org/js/guide/#relational-queries
https://docs.parseplatform.org/js/guide/#compound-queries
https://parse.com/questions/compound-relational-queries
An example of a query from two classes is as follows
It would also be good to see the code, would help give a more relative answer.
CODE
var lotsOfWins = new Parse.Query("Player");
lotsOfWins.greaterThan("wins", 150);
var fewWins = new Parse.Query("Player");
fewWins.lessThan("wins", 5);
var mainQuery = Parse.Query.or(lotsOfWins, fewWins);
mainQuery.find({
success: function(results) {
// results contains a list of players that either have won a lot of games or won only a few games.
},
error: function(error) {
// There was an error.
}
});
If I understand correctly, your Content class contains a pointer to your Details class in the descId property, and you want to be able to query based on some Details fields and return both objects?
NOTE: I must point out that descId is a very poorly named property that will just cause confusion. If it is a pointer, just give it a name like desc, leave off the Id suffix.
Anyway, if that is what you want:
var query = new Parse.Query("Content");
var uuid = tdUuid.children("input[type=text]").val().toString();
var proximity = parseInt(tdProximity.children($('prox')).val().toString());
// consider logging those two variable to confirm they're what you want
// query properties of a pointer
query.equalTo("descId.uuid", uuid);
query.equalTo("descId.proximity", proximity);
// include the pointer in the output
query.include("descId");
query.find({
success: function(beaconContent) {
alert("Success -- length: " + beaconContent.length);
// sample output of first result:
var content = beaconContent[0];
var detail = content.get("descId");
console.log("uuid", detail.get("uuid"));
console.log("proximity", detail.get("proximity"));
console.log("offer", content.get("offer"));
}
});

Reading unlabelled JSON arrays

I am trying to pull data, using JQuery, out of an unlabelled array of unlabelled objects (each containing 4 types of data) from a JSON api feed. I want to pull data from the first or second object only. The source of my data is Vircurex crypto-currency exchange.
https://api.vircurex.com/api/trades.json?base=BTC&alt=LTC
By 'unlabelled' I mean of this format (objects without names):
[{"date":1392775971,"tid":1491604,"amount":"0.00710742","price":"40.0534"},{ .... }]
My Javascript look like this:
var turl = 'https://api.vircurex.com/api/trades.json?base=BTC&alt=LTC';
$.getJSON(turl, function (data) {
$.each(data, function(key,obj) {
var ticker1tid = obj[1].tid;
var ticker1amount = obj[1].amount;
var ticker1date = obj[1].date;
var ticker1price = obj[1].price;
});
});
Somehow I am not calling in any data using this. Here is link to my sand-box in JSFiddle: http://jsfiddle.net/s85ER/2/
If you just need the second element in the array, remove the traversing and access it directly from the data:
var turl = 'https://api.vircurex.com/api/trades.json?base=BTC&alt=LTC';
$.getJSON(turl, function (data) {
var ticker1tid = data[1].tid;
var ticker1amount = data[1].amount;
var ticker1date = data[1].date;
var ticker1price = data[1].price;
// Or isn't it better to just have this object?
var ticker = data[1];
ticker.tid // 1491736
ticker.amount // 0.01536367
// etc
});

How to make YUI datasource parse Null values in the dataset?

I am using YUI datatable and datasource to render data in one of my projects. The data returned happens to be NULL and YUI datasource is unable to parse it.
Below is the declaration code of datasource and datatable. For readability sake, I am seperating each of the declarations.
Column Descriptions declaration
var columnDescription =
[
{key:'Requirements'},
{key:'abc'},
{key:'xyz'}
];
This columnDescription is set in the function below.
DataSource Declaration
var dataSrcSample = new YAHOO.util.FunctionDataSource(getDataGrid);
myDataSource.connMethodPost = true;
myDataSource.responseType = YAHOO.util.DataSource.TYPE_JSON;
myDataSource.responseSchema = {
fields:['Requirements',
{key:'abc',parser:YAHOO.util.DataSource.parseString},
{key:'xyz',parser:YAHOO.util.DataSource.parseString}]
};
getDataGrid function makes the call to server side to get the data from the server.
Below is the table definition itself.
YAHOO.example.sampleTable = function()
{
var columnDesc=columnDescription;
var myDataSource = dataSrcSample;
var oConfigs =
{
width:'100%'
};
var myDataTable = new YAHOO.widget.DataTable("tableContainerDiv", columnDesc, myDataSource, oConfigs);
}();
tableContainerDiv is declared in the html page. This is the container div.
The function that gets the JSON data from server.
function getDataGrid()
{
//calls backend and gets the data
}
The function is returning json string that has some null values. Datasource constructor is complaining following problems.
ERROR_DATAINVALID
ERROR_DATANULL
I checked the yui documentation and found that the string parser does not parse null values. I am wondering if there is any way to parse this data. Do I have to handleResponse parse the raw data? Any suggestions appreciated.
You need to create your own parser perhaps?
function parseNull(value) {
// This exact logic may be incorrect, depends on what you get for value in the null case
if (value=='null') {
return null;
}
YAHOO.util.DataSource.parseString(value);
}
Then you can specify:
{key:'abc',parser:parseNull}
To use your new parser

Categories

Resources