Creating a for each loop on multitple letters using jquery - javascript

im working on an mobile web application, which uses data from a .jsp page in the same directory. I made it possible to get formdata and put it in a variable using jQuery's .val().
now i have created an array of the input, and want to loop it using the $.each.
Only problem is when i try to create the loop, it separates every letter, instead of words..
This is the code i wrote:
var entrylist= $('#entrylistForm').val ();
/* gettin the formvalue. This looks like this:
[{s.ENTRYID=1480565, s.SHEETID=131444777, s.ENTRYDATE=2012-14-04}]
*/
$.each (entrylist, function (key, value) {
alert( key + "=>" + value+"");
// ...
}
I'm tying to get the array like this:
[0]ENTRYID=1480565,
[1]SHEETID=131444777, etc...
help anyone, i cant figure out what i'm doing wrong..
thnx in advance!

Why don't you use the native .split function, and split by whitespace? Assuming the value is a string.
entrylist = entrylist.split(', ');

You should be able to use the split function.
var entrylist = $('#entrylistForm').val();
var list = str.split(', ');
Which would split it after ", " and put it into an array which you can access.
See: http://www.w3schools.com/jsref/jsref_split.asp

Related

How do I create a custom javascript variable that selects part of an already existing javascript variable?

I am trying to create a custom javascript variable in GTM that returns part of a javascript variable that already exists.
Variable that already exists: window.ShopifyAnalytics.meta.product.variants.0.name
returns this: "Bamboo Basic String - Schwarz - S"
However I want to code a custom javascript variable to just return the Schwarz part, is this possible? If so what is the code that I would need?
Please can someone let me know what code to put into GTM to create this variable?
TIA
If all names are pretty much the same you could use split to get that part of string and then remove whitespaces. It would look like this:
window.ShopifyAnalytics.meta.product.variants.0.name.split('-')[1].replace(/
/g,'');
If the already existing variable is always structured the same way you could do something like this:
let variable = window.ShopifyAnalytics.meta.product.variants.0.name.split('-')
Then by calling varaible[1] you get the 'Schwartz' part of the variable.
If you want a return value you can use a function like the following and call it wherever you want.
Simply make sure to pass the correct argument content
// Declaring a function getColor that returns the second element in the list,
// trimmed (without spaces before and after)
const getColor = (content) => {
return content.split('-')[1].trim();
}
const test = "Bamboo Basic String - Schwarz - S";
console.log(getColor(test));
//console.log(getColor(window.ShopifyAnalytics.meta.product.variants.0.name));
You could split the string on the hypens (-) like this:
const productName = window.ShopifyAnalytics.meta.product.variants.0.name;
const part = productName.split(' - ')[1];
Assuming you have a consistent format, and you always want the second part after that hyphen.
split will separate parts of a string into an array where it finds a match for the argument. The first index [0] will be the product name, the second [1] will be the part you're looking for.
This could cause issues if you have a product name with a - in it too though so use with care!
If it needs to be an anonymous function for GTM, you could try the following (though I'm not a GTM expert):
function () {
const productName = window.ShopifyAnalytics.meta.product.variants.0.name;
return productName.split(' - ')[1] || 'Unknown';
}

Converting Javascript hashtag

What I'm trying to do is fetch a single piece of a string without using the hashtag element in the url. I already have a functioning code but it needs altering. So, how do I fetch any part of the url after ?.
Say I have ?fx=shipment+toys/fish-fix-fx/ as my url string; I want the button to show if shipment or fish or fx was my choice of selections for example.
Buttons showing with hastag: http://jsfiddle.net/66kCf/2/show/#iphone
Original JSFiddle (buttons not showing): http://jsfiddle.net/66kCf/2/
I want the iPhone buttons to show if fix was my choice: http://jsfiddle.net/66kCf/2/show/?fx=shipment+toys/fish-fix-fx/
try doing it with .split() and.match() like this...
var keys = window.location.href.split('?');
if (keys[1].match(/(fix|fish|fx)/))
{
$("#linkdiv").append(nextLink);
$("#linkdiv1").append(nextLink);
$("#linkdiv2").append(nextLink);
}
demo button showing : http://jsfiddle.net/LbKmf/show/?fx=shipment+toys/fish-fix-fx/
demo button not showing: http://jsfiddle.net/LbKmf/show/?reigel
Is this what your looking for:
"?fx=shipment+toys/fish-fix-fx/".split(/[\?=+\/-]/g);
window.location.search and split into array for comparisons
explained in How can I get a specific parameter from location.search?
http://css-tricks.com/snippets/javascript/get-url-and-url-parts-in-javascript/
Generally, Javascript doesn't have a built-in functionality for query string parameters. You can use string manipulation on window.location.search to get your parameters out of the URL string. Note that location.search includes the ? character too.
Something like this should do:
var queryString = function () {
// Anonymous function - executed immediately
// get rid of the '?' char
var str = "?fx=shipment+toys/fish-fix-fx/";
var query = str.substring(str.lastIndexOf('=')+1,str.indexOf('/'));
var vars = query.split("+");
for (var i=0;i<vars.length;i++){
console.log(vars[i]);
}
return vars;
} ();

how to pass a function name via JSON and call it in javascript/jQuery?

I have a JSON string which includes a function I need to call.
My JSON looks like this:
{
"type":"listview",
// the function I would like to call
"content":"dynoData.getRetailers()",
"custom_classes":["","nMT pickList","",""],
"lib":"static_listview.html",
"tmp":"tmp_listview_inset",
"lang":"locale_search",
...
I'm using this to assemble a jQuery Mobile listview on the client. To get the dynamic data, I need to call dynoData.getRetailers().
However I'm struggling to make the call :-)
This is what I'm trying:
var dyn = $.parseJSON( passed_JSON_string ),
content = dyn.content;
I had hoped calling it would trigger the function but it just returns the function name as a string.
Question:
How can trigger the actual function?
Thanks!
EDIT:
I'm putting the JSON string on the HTML element on the actual page, which I will replace with the element I'm building. Here is the HTML:
<ul data-template="true" data-config='{
"type":"listview",
"content":"dynoData.getRetailers()",
"custom_classes":["","nMT pickList","",""],
"lib":"static_listview.html",
"tmp":"tmp_listview_inset",
"lang":"locale_search",
"theme":"c",
"filter":"true"
}'></ul>
I could put all of these into data- attributes, but that would be messy...
Solution:
This worked:
1) change JSON to:
..."method":"getRetailers", ...
2) call from Javascript:
content = dynoData[ dyn.method ]();
Thanks everyone!
Assuming the function is always part of the dyn object you can use notation like following to call a function:
dyn['dynoData']['getRetailers']();
So if you are able to adjust json you could send back something like:
"content":{ "mainObject": "dynoData" , "method" :"getRetailers"}
And translate it to your dynamic function using variables:
dyn[content.mainObject][content.method]();
As an example using jQuery try using the following :
$('div')['hide']();
Which is the same as :
$('div').hide()
As charlietfl pointed out you can use object notation to call functions. For your case you have to get rid off () and split it, then call it like this;
jQuery(function($) {
var temp = $('ul').data('config').content.replace(/\(\)/g, '').split('.');
window[temp[0]][temp[1]]();
});
However this could solve your problem, if you think about future, you have to extend it a little bit. This way even you don't know the depth, you can call it anyway;
jQuery(function($) {
var temp = $('ul').data('config').content.replace(/\(\)/g, '').split('.'), func, i, il = temp.length;
for(i = 0; i < il; i++) {
if(func == null) {
func = window[temp[i]];
continue;
}
func = func[temp[i]];
}
func();
});
Try ConversationJS. It makes dynamic calls pretty easy and its a great way to decouple your codebase: https://github.com/rhyneandrew/Conversation.JS
JSON is purely data notation to be passed around so it is easily read and parsed, therefore it has no concept of functions. However, there are other ways of dealing with this and if you are starting to think that that is the only way to deal with your dilemma, then take a step back and examine your design. Instead of using this:
eval(yourCode);
Try this
var tempFun = new Function(yourCode);
tempFun();

Concatenate a string and a variable into a variable name for Jade

Is there a nice, clean way to concatenate a string and a variable into a variable name that Jade can understand?
Ideally, it would look something like this:
each #{shape + 'Text'} in #{shape + 'Texts'}
li #{shape + 'Text'}
I tried using window[shape + 'Text'] but that didn't seem to work. Maybe I was doing it wrong?
Here's why I want to do this:
I have an array called shapes that looks like this: ['square', 'triangle', 'circle']
I'm using Jade's each ... in ... function to iterate through this array. Within each iteration of my function, I need to do another each ... in ... of one of a few other arrays. Instead of using a straight-up variable to select which array to iterate over, like each shape in shapes, I want to concatenate shape with a string in order to get something like each squareText in squareTexts or each circleText in circleTexts.
Currently, I'm using conditionals to achieve my desired result, but it's verbose and not in the minimalist spirit of the language.
Thanks in advance for any advice.
So it looks like in my case, the trick is to use Javascript's eval() function to concatenate the variable name and the string into a new variable name. Here's my successful (and succinct) implementation.
- var items = eval(shape + 'Texts');
each item, i in items
li #{items[i]}
I'd suggest looking at an option to create/eval this out of Jade, keep the jade code (and any templare for this matter) as simple as possible.
You can wrap a variable and string in parentheses.
each item, i in items
li=(shape + 'Texts')
I am not exactly following what you are referring to since I don't know jade at all, but you would loop through an array like this.
var a = ['square', 'triangle', 'circle'];
var i, l, item;
l = a.length;
for (i = 0; i < l; i++) {
item = a[i];
// At this point, you can refer to window[item + 'Text']
// but I'm not sure what that is supposed to mean.
}
There is also an Array.prototype.every available, but I usually don't bother to monkeypatch it in to older browsers.

How do I retrieve nodes with one or another value with XPATH

I have a javascript function that needs to retrieve certain nodes through xpath using document.evaluate, till now I am using something like
.//span[contains(#title, 'alerting')] | .//span[contains(#title, 'caution')]
But it turn in a very long string when values to match are more. I cannot use [#title = word], because I need to retrieve the elements whose atributes contains some string. I have tried things like
.//span[contains(#title, ('alerting'|'caution'))]
But it does not retrieve anything.
Can you give me an idea to shorten the first sintax?
Why not just create a function that creates the string and build the expression programmatically, and not worry about it? Roughly:
function spanContains(s) {
return ".//span[contains(#title, '" + s + "')]";
}
var contains = [spanContains('word1'), spanContains('word2')].join("|");
You could also try using matches instead of contains, although I'm not sure what the JavaScript syntax for that would be, or if it's supported.
XPath should be this way:-
.//span[contains(#title, 'alerting') or contains(#title, 'caution')]
.//span[contains(#title, ('alerting'|'caution'))]
This is invalid XPath -- the union operator | can only have arguments that are node-sets -- not strings.
Use:
.//span[#title
[contains(.,'alerting')
or
contains(.,'caution')
]
]
Instead of using document.evaluate(), you could use jquery in which case you could do:
$('span').filter(function() {
var title = $(this).attr('title');
return title != undefined && title.search(/(alerting|caution)/) != -1;
});

Categories

Resources