Can JavaScript data be attached to HTML elements? - javascript

I have an array (below)
var img_name = new Array("images/test.jpg", "images/test.jpg");
var imgTotal = img_name.length;
var rnd_no = Math.floor(imgTotal*Math.random());
var ojimg = img_name[rnd_no];
What I need to do is pass another piece of information and attach that to the body tag. So. if test1.jpg is loaded I need to pass "light" to the body tag and if the other image is selected I need to pass "dark". What this does is alows a user in CMS to select a light or dark theme depending on the image. The image will be output randomly.

You could store objects in your array:
// I'm using an Array literal instead of a Array constructor here, because it's shorter
var img_name = [ {image:"images/test.jpg", style:"light"}, {image:"images/test.jpg", style:"dark"} ];
var imgTotal = img_name.length;
var rnd_no = Math.floor(imgTotal*Math.random());
var ojimg = img_name[rnd_no].image;
var ojstyle = img_name[rnd_no].style;

How about nested arrays:
var img_name = [["images/test1.jpg", "light"], ["images/test2.jpg", "dark"]]];
var imgTotal = img_name.length;
var rnd_no = Math.floor(imgTotal*Math.random());
var ojimg = img_name[rnd_no][0];
var cssclass = img_name[rnd_no][1];

In your array, you can just have some additional string with a seperator.
var img_name = new Array("images/test.jpg:light", "images/test.jpg:dark");
For your example, I have used : as seperator. In the consuming method, you can split the data based on seperator : and use both items accordingly.

You could use a map of image srcs strings to theme names. Then you can use a selected image src to directly access the theme name.
var themeMap = {};
themeMap["testImg1.jpg"] = myDarkTheme; //myDarkTheme can be a full object or just a string
You can then do
getTheme(img_name[rnd_no]);
function getTheme(imgSrcString)
{
return themeMap[imgSrcString];
}

Related

How to split a string and make particular data only to be stored in a variable

I have a string like
var directoryPath = "file:///storage/sdcard0/Android/data/com.ionicframework.ftptranfer949961/cache/1467013143014.png"
in the above variable I would like storing only a particular string like this
var updatedPath = "/storage/sdcard0/Android/data/com.ionicframework.ftptranfer949961/cache/"
I have tried the split() method but I don't know how to store the particular path in my updatedPath variable.
What you could do is something like this:
var directoryPath = "file:///storage/sdcard0/Android/data/com.ionicframework.ftptranfer949961/cache/1467013143014.png";
var stringToReplace = 'file://';
var lastIndexOfSlash = directoryPath.lastIndexOf('/');
var offset = stringToReplace.length;
var updatedPath = directoryPath.substr(offset, lastIndexOfSlash - offset + 1);
alert(updatedPath);
This will set the updatePath variable to the directoryPath withouth the string you wish to remove (i.e. "file://") and remove the last part of the url where the .png location is set.

I want to insert values dynamically to hash map

var markerList1={};
var markerList=[];
and adding iterator values from the one for loop
function addSomething() // this function will multiple times from a for loop
{
image ='../css/abc/'+image[iterator]+'.png';
var data = respData[iterator];
var box = getbox(data);
var markerOpts = {
position : coordinates[iterator],
map : map,
icon :image,
title :data[1],
id : data[11]
};
var vmarks = new google.maps.Marker(markerOpts);
markerList.push(vmarks);
markerList1[markerOpts.title].push(vmarks);
}
whenever we call the function i want append the array's values to same index
markerList1[data[11]].push(vmarks);
but i'm not getting above result, when i markerList1[data[11]) then i'm getting only the last value i.e thirdvmark
i want output like this= markerList1[data[11]] = {firstvmark, secondvmark, thirdvmark};
You cannot do push to an object markerList1, only to an array.
change this
markerList1[markerOpts.title].push(vmarks);`
To this
markerList1[markerOpts.title] = vmarks;
markerList1[data[11]] is never initialized before you push something inside.
You can initialize it only once with a simple test:
if (! (data[11] in markerList1) ) {
markerList1[data[11]] = [];
}
markerList1[data[11]].push(vmarks);
Or in a shorter and safer way:
markerList1[data[11]] = markerList1[data[11]] || [];
markerList1[data[11]].push(vmarks);
(And please put data[11] in a variable)
Try this-
var vmarks = new google.maps.Marker(markerOpts);
markerList.push(vmarks);//you already pushing vmarks to array
markerList1[markerOpts.title]=markerList;//assign array to your markerList1 map

AngularJS Convert Array to JSON

I have an array containing 3 elements
var a = [];
a["username"]=$scope.username;
a["phoneNo"]=$scope.phoneNo;
a["altPhoneNo"]=$scope.altPhoneNo;
Now, I want to send this data to server in JSON format. Therefore, I used
var aa = JSON.stringify(a);
console.log("aa = "+aa);
But the console displays empty array
aa = []
How can I convert this array into JSON?
That's not the correct way to add elements to an array, you're adding properties instead.
If you did console.log(a.username); you'd see your $scope.username value.
You could either do
var a = [];
a.push({"username": $scope.username});
a.push({"phoneNo": $scope.phoneNo});
a.push({"altPhoneNo": $scope.altPhoneNo});
But it looks more like what you're trying to do is
var a = {};
a["username"] = $scope.username;
a["phoneNo"] = $scope.phoneNo;
a["altPhoneNo"] = $scope.altPhoneNo;
That is, you want your a to be an object if you're going to add properties to it.
And that would be better written as
var a = {};
a.username = $scope.username;
a.phoneNo = $scope.phoneNo;
a.altPhoneNo = $scope.altPhoneNo;

Assign a user input string as a new variable name in javascript

I have a text field in which the user inputs some text. I'd like to take the first word of that text and turn it into a global variable name for an object holding the rest of the string content. More string content will be added to object later, so internal indexing inside the object is required.
var textInput = $('#inputText').val();
var splitString = textInput.split(" ");
var firstWord = splitString[0];
This is where I get stuck. How please do I create a new object with the string referenced by firstWord as the object's reference?
Many thanks in advance.
I would try something like this:
globalUserObjects = {};
var textInput = $('#inputText').val();
var splitString = textInput.split(" ");
var firstWord = splitString[0];
globalUserObjects[firstWord] = {};
// Now later you can add stuff to it
globalUserObjects[firstWord]["firstName"] = "John";
globalUserObjects[firstWord]["lastName"] = "Smith";

Push to array a key name taken from variable

I have an array:
var pages = new Array();
I want to push my pages data to this array like this:
$('li.page').each(function () {
var datatype = $(this).attr('data-type');
var info = $(this).attr('data-info');
pages_order.push({datatype:info});
});
but this code doesn't replace datatype as variable, just puts datatype string as a key.
How do I make it place there actual string value as a key name?
I finally saw what you were trying to do:
var pages = new Array();
$('li.page').each(function () {
var datatype = $(this).attr('data-type');
var info = $(this).attr('data-info');
var temp = {};
temp[datatype] = info;
pages_order.push(temp);
});
$('li.page').each(function () {
//get type and info, then setup an object to push onto the array
var datatype = $(this).attr('data-type'),
info = $(this).attr('data-info'),
obj = {};
//now set the index and the value for the object
obj[datatype] = info;
pages_order.push(obj);
});
Notice that you can put a comma between variable declarations rather than reusing the var keyword.
It looks like you just want to store two pieces of information for each page. You can do that by pushing an array instead of an object:
pages_order.push([datatype, info]);
You have to use datatype in a context where it will be evaluated.
Like so.
var pages = [];
$('li.page').each(function () {
var datatype = $(this).attr('data-type'),
info = $(this).attr('data-info'),
record = {};
record[datatype] = info;
pages_order.push(record);
});
You only need one var it can be followed by multiple assignments that are separated by ,.
No need to use new Array just use the array literal []
You may add below single line to push value with key:
pages_order.yourkey = value;

Categories

Resources