JavaScript Objects Error using dot notation - javascript

$(document.body).on("click",'.sub-unfollow', function(){
var unfollow_tag = {element:"",un:"",type:"",text:""};
var unfollow_tag.element = $(this).parents("li");
var unfollow_tag.un = $(this).parents("li").attr("data-un");
var unfollow_tag.type = $(this).parents("li").attr("data-type");
var unfollow_tag.text = $(this).parents("li").text();
alert(unfollow_tag.text);
});
Getting an error with this seemingly basic object setup. Any ideas?

You should remove var after once declaring unfollow_tag, it redeclares it instead of trying to access a property.
$(document).on("click",'.sub-unfollow', function(){
var unfollow_tag = {};
unfollow_tag.element = $(this).parents("li");
unfollow_tag.un = $(this).parents("li").attr("data-un");
unfollow_tag.type = $(this).parents("li").attr("data-type");
unfollow_tag.text = $(this).parents("li").text();
alert(unfollow_tag.text);
});

Related

AngularJS querySelector by ID Returns Undefined

Here is what my index.html looks like:
And this is the Javascript code (angular):
var controllerElement = document.querySelector('[id="tile3"]');
console.log(controllerElement.getAttribute('class'));
var controllerScope = angular.element(controllerElement).scope();
As you can see, I'm trying to find the controllerElement by searching for an id equal to tile3. However, whenever I get to the next line the program crashes with this error:
Uncaught TypeError: Cannot read property 'getAttribute' of null
Is there something obvious I'm missing?
EDIT
Here is the full code, now the controllerScope var is being undefined for some reason...
var update = function(id, channel){
var controllerElement = document.querySelector('#tile3');
console.log(controllerElement.getAttribute('ng-controller'));
var controllerScope = angular.element(controllerElement).scope();
console.log(controllerScope);
controllerScope.$apply(function () {
controllerScope[id].username = channel.username;
controllerScope[id].keyword = channel.keyword;
controllerScope[id].percent = channel.percent;
controllerScope[id].views = channel.views;
controllerScope[id].link = channel.link;
});
};
(function(){
var app = angular.module("testApp", []);
var TileController = function($scope){
$scope.channels = [];
for(i = 0; i < 25; i++){
var channel = {
username:"John",
keyword:"Doe",
percent:"50%",
views:5000,
link:"http://www.twitch.tv/lolyou"
};
$scope.channels.push(channel);
}
};
app.controller("TileController", ["$scope", TileController]);
update(3, {username:"Yo",
keyword:"Bro",
percent:"40%",
views:35,
link:"http://www.twitch.tv/nickbunyun"});
})();
The line where it says console.log(controllerScope); is just printing "undefined".
If you are using querySelector then you could/should just use #tile3 as value passed to the function, so:
var tile3 = document.querySelector('#tile3')

JavaScript "Prompt" command not working when inserting code

I'm trying to make a project that searches through a block of text, then pushes certain values to the properties of an object, but whenever I put a variable inside of the ingamePrices object at near the bottom of this block of text,
var testPrompt = prompt("Let's figure out how this works");
var rawUSDValue = 0.125;
function item(craftGamePrice, craftMarketPrice, uncraftGamePrice, uncraftMarketPrice, strangeGamePrice, strangeMarketPrice, genuineGamePrice, genuineMarketPrice, vintageGamePrice, vintageMarketPrice, unusualGamePrice, unusualMarketPrice, hauntedGamePrice, hauntedMarketPrice, collectorGamePrice, collectorMarketPrice )
{
this.craftGamePrice = craftGamePrice,
this.craftMarketPrice = craftMarketPrice,
this.uncraftGamePrice = uncraftGamePrice,
this.uncraftMarketPrice = uncraftMarketPrice,
this.strangeGamePrice = strangeGamePrice,
this.strangeMarketPrice = strangeMarketPrice,
this.genuineGamePrice = genuineGamePrice,
this.genuineMarketPrice = genuineMarketPrice,
this.vintageGamePrice = vintageGamePrice,
this.vintageMarketPrice = vintageMarketPrice,
this.unusualGamePrice = unusualGamePrice,
this.unusualMarketPrice = unusualMarketPrice,
this.hauntedGamePrice = hauntedGamePrice,
this.hauntedMarketPrice = hauntedMarketPrice,
this.collectorGamePrice = collectorGamePrice,
this.collectorMarketPrice = collectorMarketPrice
}
var ingamePrices =
{
};
document.write(testPrompt);
so that it's like this
var testPrompt = prompt("Let's figure out how this works");
var rawUSDValue = 0.125;
function item(craftGamePrice, craftMarketPrice, uncraftGamePrice, uncraftMarketPrice, strangeGamePrice, strangeMarketPrice, genuineGamePrice, genuineMarketPrice, vintageGamePrice, vintageMarketPrice, unusualGamePrice, unusualMarketPrice, hauntedGamePrice, hauntedMarketPrice, collectorGamePrice, collectorMarketPrice )
{
this.craftGamePrice = craftGamePrice,
this.craftMarketPrice = craftMarketPrice,
this.uncraftGamePrice = uncraftGamePrice,
this.uncraftMarketPrice = uncraftMarketPrice,
this.strangeGamePrice = strangeGamePrice,
this.strangeMarketPrice = strangeMarketPrice,
this.genuineGamePrice = genuineGamePrice,
this.genuineMarketPrice = genuineMarketPrice,
this.vintageGamePrice = vintageGamePrice,
this.vintageMarketPrice = vintageMarketPrice,
this.unusualGamePrice = unusualGamePrice,
this.unusualMarketPrice = unusualMarketPrice,
this.hauntedGamePrice = hauntedGamePrice,
this.hauntedMarketPrice = hauntedMarketPrice,
this.collectorGamePrice = collectorGamePrice,
this.collectorMarketPrice = collectorMarketPrice
}
var ingamePrices =
{
var testVariable = "sampleString";
};
document.write(testPrompt);
it causes the "prompt" command to stop working. Does anyone know why, or how to fix it?
var ingamePrices =
{
var testVariable = "sampleString";
};
This might be an attempt at one of two things: an object literal, or block syntax which you imagine will contain testVariable. Object literals contain keys and values, they don't contain arbitrary expressions or variable definitions. As an object literal this should be
var ingamePrices =
{
testVariable: "sampleString"
};
Or possibly, if you really did want a testVariable as context for some of the contents of this object, then:
var testVariable = "sampleString",
ingamePrices =
{
blah: [testVariable, "a use of testVariable"]
};
If you were looking for block syntax, and lexical variables, then JavaScript doesn't have them. It only has global and function variables. Which means cases like this become a self-executing function, purely to provide scope:
var ingamePrices = (function() {
var testVariable = "sampleString";
...
return { blah: testVariable };
})()

Js function pass multiple parameters as a single object

I have the following constructor:
var one = new HB.hideShowFacilites.Selectors(".facilities .more-centered", "more-centered", "less-centered", "container-max-height", ".facilities .container-min-height");
Is there a way of passing all of these selectors as a single object?
HB.hideShowFacilites = HB.hideShowFacilites || {};
HB.hideShowFacilites.Selectors = function(sel1, sel2, sel3, sel4, sel5){
this.sel1 = sel1;
this.sel2 = sel2;
this.sel3 = sel3;
this.sel4 = sel4;
this.sel5 = sel5;
};
HB.hideShowFacilites.Selectors.prototype.hideShow = function(){
var $obj1 = $(this.sel1),
$obj2 = this.sel2,
$obj3 = this.sel3;
$obj4 = this.sel4,
$obj5 = $(this.sel5);
$obj1.on('click', function(e){
e.preventDefault();
if($obj1.hasClass($obj2)){
$obj1.removeClass($obj2).addClass($obj3);
$obj5.addClass($obj4);
}
else{
$obj1.removeClass($obj3).addClass($obj2);
$obj5.removeClass($obj4);
}
});
};
$(document).ready(function(){
var one = new HB.hideShowFacilites.Selectors(".facilities .more-centered", "more-centered", "less-centered", "container-max-height", ".facilities .container-min-height");
one.hideShow();
});
Depending on how HB.hideShowFacilites.Selectors is implemented, you could use Function.prototype.apply like this
function foo(args) {
var instance = Object.create(HB.hideShowFacilites.Selectors.prototype);
HB.hideShowFacilites.Selectors.apply(instance, args);
return instance;
}
var one = foo([".facilities .more-centered", "more-centered", "less-centered", "container-max-height", ".facilities .container-min-height"]);
From your edit of how it's defined, this method should work.
It is impossible in pure JS to pass in function with argument list an object with members to be treated as arguments, without modifying function like this:
HB.hideShowFacilites.Selectors = function(selectors){
this.sel1 = selectors.sel1;
this.sel2 = selectors.sel2;
this.sel3 = selectors.sel3;
this.sel4 = selectors.sel4;
this.sel5 = selectors.sel5;
};
function like this expect one argument and treat it as object with sel1, sel2 etc fields.
But in reverse it is possible to use passed argument list as array inside a function like this:
HB.hideShowFacilites.Selectors = function(sel1, sel2, sel3, sel4, sel5){
this.sel1 = arguments[0];
this.sel2 = arguments[1];
this.sel3 = arguments[2];
this.sel4 = arguments[3];
this.sel5 = arguments[4];
};
futhermore, if you do not like modify that function, it is possible to redefine it using something like this
HB.myHideShowFacilites = function(){};
HB.myHideShowFacilites.prototype = HB.hideShowFacilites;
HB.hideShowFacilites.Selectors = function(selectors){
this.sel1 = selectors.sel1;
this.sel2 = selectors.sel2;
this.sel3 = selectors.sel3;
this.sel4 = selectors.sel4;
this.sel5 = selectors.sel5;
};
and then use HB.myHideShowFacilites instead HB.hideShowFacilites

object access in a function doesn't work

This is the code:
(function(Info, undefined) {
var createInfoTableForFeature = function (obj) {
var data2form = {};
data2form.name = obj.name;
data2form.state = obj.state;
data2form.stateid=obj.stateId;
data2form.city = obj.city;
data2form.cityId=obj.cityId;
data2form.sector = obj.sector;
data2form.sectorId=obj.sectorId;
data2form.municipality = obj.municipality;
data2form.municipalityId=obj.municipalityId;
data2form.parish = obj.parish;
data2form.parishId = obj.parishId;
data2form.postcode = obj.postcode;
}
Info.copy2form = function(data){
console.log(data);
}
})(window.Info = window.Info || {});
When I call Info.copy2form(data2form), data2form is undefined
You want data2form to be global, then you'll have to remove de var keyword before the declaration of the variable data2form to make it global.
If you want to make it accesible from everywhere but within Info container, then you can declare it like this:
Info.data2form = {};
and then call your function like this:
Info.copy2form(Info.data2form)
Your post doesn't seem JSON related so far, oh well.
Your data2form doesn't exist outside the function. You should assign it to window.data2form or define the var data2form outside the function.
This won't work because data2form is a local variable inside of the anonymous function (createInfoTableForFeature).
This is one of 1000 solutions:
function createInfoTableForFeature(obj) {
var data2form = {};
data2form.name = obj.name;
data2form.state = obj.state;
data2form.stateid=obj.stateId;
data2form.city = obj.city;
data2form.cityId=obj.cityId;
data2form.sector = obj.sector;
data2form.sectorId=obj.sectorId;
data2form.municipality = obj.municipality;
data2form.municipalityId=obj.municipalityId;
data2form.parish = obj.parish;
data2form.parishId = obj.parishId;
data2form.postcode = obj.postcode;
return data2form;
}
var data2form = createInfoTableForFeature(obj);
Info.copy2form(data2form);

listing variables inside a function in javascript

function show_alert(){
var month = oMonthList.value;
var day = oDayField.value;
var gametype = oGameTypeList.value;
var gamenum = oGameNumberField.value;
var gamename = oGameNameField.value;
var modname = oModNameField.value;
var phase = oPhaseList.value;
var phasenum = oPhaseNumberField.value;
var pagenum = oNameNumberField.value;
var repname = oReplacementNameField.value;
var modlink = oModLinkField.value;
alert(phase);
}
Why does this not show the alert when the function is called, but removing all variables except the one in question (var phase) does? I'm guessing it's something to do with syntax, but I cannot pin down the issue.
Did you make sure that your javascript code doesn't throw any exception? If some object is undeclared or undefined, the code may be aborted early thus alert() is not not executed.

Categories