Setting property to be null again within Class - javascript

I have a class called MapFilter, which conditionally creates an array of objects.
When the class is created, the property named postCodeFilter is automatically set to be null. When using the class with this initial null value the logic works fine:
MapFilter.prototype.filterByPostcode = function(res){
var newRes = [];
console.log(this.postcodeFilter);
if(typeof this.postcodeFilter !== 'undefined') {
for( var i = 0; i < res.length; i++ ) {
if(res[i].postcode == this.postCodeFilter) {
newRes.push(res[i]);
}
}
} else {
newRes = res.slice();
}
return newRes;
};
When it is initially running the method that calls this method, it will run what is in the else block
HOWEVER
after setting a value for postcodeFilter I can not set it back to be null or undefined again.
I have tried the following approaches, with no success
delete this.serviceFilter;
this.serviceFilter = null;
this.serviceFilter = undefined;
I have tried doing the same on the instance of the MapFilter class to no avail
How do I reset a property of a class to be null or undefined again?

function MapFilter (){
this.postcodeFilter=null
}
MapFilter.prototype.filterByPostcode = function(){
console.log(this.postcodeFilter);
if(this.postcodeFilter !== null) {
console.log('is bull')
} else {
console.log('is null')
}
}
var test = new MapFilter()
test.filterByPostcode()
test.postcodeFilter='bull'
test.filterByPostcode()
dont use type of null it will not return null
if you calling prototype inside function
dont call with this.postcodeFilter try use instance name like test.postcodeFilter

Related

Object in jquery not set on submit

I would like to get inputs values of a form and place in an object (for an offer).
So i tried to place this code on submit :
$(document).ready(function(){
$('#formOffre').on('submit', function(e) {
e.preventDefault();
console.log(Offre); // give undefined in console
if ( typeof Offre == 'undefined'){
// if undefined, create object
var Offre = {
BuyerID: 1, //I will handle this later
Total: 0,
OffreItem: [] //array with json objects
};
Offre.OffreItem.id = 0;
console.log("object created");
for (i=0; i > Offre.OffreItem.id ; i++) {
Offre.OffreItem.modele = formOffre.modele.value;
Offre.OffreItem.longueur = formOffre.longueur.value;
Offre.OffreItem.hauteur = formOffre.hauteur.value;
Offre.OffreItem.qte = formOffre.qte.value;
Offre.OffreItem.rix = formOffre.prix.value;
console.log("getting parameters of inputs to offer");
}
} else {
//if object exists ony get informations of inputs
Offre.OffreItem.id = 0;
for (i=0; Offre.OffreItem.id < i; i++){
Offre.OffreItem.modele = formOffre.modele.value;
Offre.OffreItem.longueur = formOffre.longueur.value;
Offre.OffreItem.hauteur = formOffre.hauteur.value;
Offre.OffreItem.qte = formOffre.qte.value;
Offre.OffreItem.rix = formOffre.prix.value;
}
}
this is my code. when i click on submit for the first time, it go to the if statement and create the object. But when i click again, I go through the if statement like the object is not set.
i put a console log and in every case the object is undefined.
Can you someone help me please?
Thanks
You are checking Offre out side of scope in which it is defined .
enter coconsole.log(Offre); // give undefined in console
if ( typeof Offre == 'undefined'){
// if undefined, create object
var Offre = { //here is issue this should be above submit function
BuyerID: 1, //I will handle this later
Total: 0,
OffreItem: [] //array with json objects
};
Also make sure your page is maintaining state.
For you I have created example give a look. here
Hoping this will solve your problem.
Fiddle
The problem here is that you're defining your variable inside the function.
To simplify your code:
$('#formOffre').on('submit', function(e) {
if ( typeof Offre == 'undefined'){
var Offre = { }; // This variable is only accessible inside this function
} else {
//
}
}
The var Offre will define a variable within the scope of the function, the next time you run the function, a new variable with that name will be created (Meaning it will always be undefined initially)
To get around this, you can define your variable outside of the function:
var Offre;
$('#formOffre').on('submit', function(e) {
if ( typeof Offre == 'undefined'){
Offre = { }; // Notice that we're not creating a new variable here, just accessing the one defined above
} else {
//
}
}

failed updating a property in javascript object result, but object is updated

I have this erratic behavior:
I have an object, I extend its property and initalize it.
I do a callback to populate the property.
Then, if I check the property outside the callback, it results as initialized; but if I check the whole object,also the property is updated.
Am I doing something wrong in updating my property?
Am I doing smtg conceptually wrong with local variables?
I update my property with this function:
function extend(obj, props) {
for(var prop in props) {
if(props.hasOwnProperty(prop)) {
obj[prop] = props[prop];
}
}
};
And then:
graphics.node(function (node) {
extend(node,{
thumbnail : {
source: '',
width: '',
height: ''
}
});
// UI
if (typeof node.data === 'undefined') {
var nameTopic = 'NOT YET MAPPED'; // YOU DONT NEED THIS INFO
var sourceId = 'ID NOT YET MAPPED' // YOU DONT NEED THIS INFO
} else {
var nameTopic = node.data.name;
var sourceId = node.data.source;
// I POPULATE MY PROPERTY WITH FOLLOWING FUNCTION: node.thumbnail...
fetchWikipediaDecorator(sourceId,function(data){
var infopage = data.query.pages[sourceId];
if (infopage.thumbnail) {
node.thumbnail.source = infopage.thumbnail.source;
node.thumbnail.width = infopage.thumbnail.width;
node.thumbnail.height = infopage.thumbnail.height;
}
});
// NOW ODD THING IS:
console.log('registro il source',node.thumbnail);
// RESULT: {source:'',width:'',height:''}
// INSTEAD
console.log('registro il source', node);
// RESULT WITH UPDATED PROPERTIES FOR ALL THE OBJECT
// {...,thumbail{source:'http...',etc.}, ..}
}
// SO BASICALLY I CANT CALL THE PROPERTY..

JavaScript error when creating custom object

I am finding that when I call record.create() then sometimes it succeeds, and at other times it throws an error saying that no such method exists, even though record object has its properties set appropriately.
Am I using create method incorrectly? May be I am missing something about JavaScript custom object syntax.
<script language="javascript" type="text/javascript">
var record = {
RecordID : null,
CustomerID : null,
CompanyID : null,
create : function() {
var obj = new Object();
obj.RecordID = "";
obj.CustomerID = "";
return obj;
}
};
function pageLoad(sender, eventArgs) {
{
//*******SUCCEEDS********
record = record.create()
}
function RadGrid1_RowSelected(sender, args) {
currentRowIndex = args.get_gridDataItem().get_element().rowIndex;
var dataItem = args.get_gridDataItem().get_dataItem();
recordId = dataItem["Record_ID"];
if (tableView.get_selectedItems().length == 1) {
record = record.create();
record.RecordID = dataItem["Record_ID"];
record.CustomerID = dataItem["Customer_ID"];
setValues();
}
else if (tableView.get_selectedItems().length > 1) {
record= record.create();//****FAILS ALWAYS even when record object has non-null properties*******
}
if ($.inArray(recordId, recordIds) == -1) {
recordIds.push(recordId);
}
}
</script>
UPDATE : This is what worked for me.
Instead of using the create method on 'record' global object, I ended up using a simple approach. Just call a custom method 'resetRecord' everytime I wanted to call the create( ) method on record object. That way I have no errors and my logic works perfectly.
function resetRecord() {
record.RecordID = "";
record.CustomerID = "";
record.CompanyID = "";
}
It won't work after the first call because you are overwriting the record object. This will destroy any create() method as the object returned does not have this method/property.
For you update, variables have function level scope. You are using the global record inside of RadGrid1_RowSelected.
I'm not entirely sure what you are doing but this will get you past your first problem.
function RadGrid1_RowSelected(sender, args) {
var newRecord;
currentRowIndex = args.get_gridDataItem().get_element().rowIndex;
var dataItem = args.get_gridDataItem().get_dataItem();
recordId = dataItem["Record_ID"];
if (tableView.get_selectedItems().length == 1) {
record = record.create();
record.RecordID = dataItem["Record_ID"];
record.CustomerID = dataItem["Customer_ID"];
setValues();
}
else if (tableView.get_selectedItems().length > 1) {
newRecord= record.create();//****FAILS ALWAYS even when record object has non-null properties*******
}
if ($.inArray(recordId, recordIds) == -1) {
recordIds.push(recordId);
}
}

Setting variable by string name in javascript?

//window["Fluent"]["Include"]
function setGlobalVariableByName(name,value)
{
var indexes = name.split(".");
var variable = null;
$.each(indexes, function()
{
if (variable == null){
variable = window[this];
}else{
variable = variable[this];
}
});
variable = value;
}
setGlobalVariableByName("Fluent.Include.JqueryPulse",true);
console.log(Fluent.Include.JqueryPulse) // prints false
this doesn't work, obviously. It would work if I just wanted to get the variable's value, but not for setting it.
window["Fluent"]["Include"]["JqueryPulse"] = true;
console.log(Fluent.Include.JqueryPulse) // prints true
how could I achieve something like this without using eval?
I'd need some way to programmatically add array indices to this, I'd guess
The following works, can you suggest a better way to code it in order to make it more DRY?
function setGlobalVariableByName(name,value)
{
var indices = name.split(".");
var parent;
$.each(indices, function(i)
{
if(i==indices.length-1){
if (!parent){
window[this] = value;
}else{
parent[this] = value;
}
}else if (!parent){
parent = window[this];
}else{
parent = variable[this];
}
});
}
setGlobalVariableByName : function(name, value)
{
var indices = name.split(".");
var last = indices.pop();
var parent;
$.each(indices, function(i)
{
if (!parent){
parent = window[this];
}else{
parent = variable[this];
}
});
if (!parent){
window[last] = value;
}else{
parent[last] = value;
}
}
You need to call
variable[this] = value
somehow. So you need to break the loop of the splited string before reching the last name, and then assign the value.
Ultimatively you need to call:
variable = window['Fluent']['Include']; // build this in a loop
variable['JqueryPulse'] = someValue; // then call this
Ultimately you're just building an object chain and setting the final item in the chain to a value. Also, I would add a check to ensure that items which are already objects do not get overwritten so that their existing properties don't get lost:
//bootstrap the object for demonstration purposes--not necessary to make code work
window.Fluent = {
Include: {
foo: 'bar', //don't want to lose this'
JqueryPulse: false //want to set this to true
}
};
//define function
function setGlobalItemByName( name, value )
{
var names,
finalName,
//no need to figure out if this should be assigned in the loop--assign it now
currentOp = window;
if( typeof name === 'string' && name !== '' )
{
names = name.split( '.' );
//no need to track where we are in the looping--just pull the last off and use it after
finalName = names.pop();
$.each( names, function()
{
//If the current item is not an object, make it so. If it is, just leave it alone and use it
if( typeof currentOp[this] !== 'object' || currentOp[this] === null )
{
currentOp[this] = {};
}
//move the reference for the next iteration
currentOp = currentOp[this];
} );
//object chain build complete, assign final value
currentOp[finalName] = value;
}
}
//use function
setGlobalItemByName( 'Fluent.Include.JqueryPulse', true );
//Check that Fluent.Include.foo did not get lost
console.log( Fluent.Include.foo );
//Check that Fluent.Include.JqueryPulse got set
console.log( Fluent.Include.JqueryPulse );
However, I would do it without using jQuery, even if you have jQuery available on the page. There is no need for the overhead of executing a function for each index.
//bootstrap the object for demonstration purposes--not necessary to make code work
window.Fluent = {
Include: {
foo: 'bar', //don't want to lose this'
JqueryPulse: false //want to set this to true
}
};
//define function
function setGlobalItemByName( name, value )
{
var names,
finalName,
indexCount,
currentIndex,
currentName,
//no need to figure out if this should be assigned in the loop--assign it now
currentOp = window;
if( typeof name === 'string' && name !== '' )
{
names = name.split( '.' );
//no need to track where we are in the looping--just pull the last off and use it after
finalName = names.pop();
indexCount = names.length;
for( currentIndex = 0; currentIndex < indexCount; currentIndex += 1 )
{
currentName = names[currentIndex];
//If the current item is not an object, make it so. If it is, just leave it alone and use it
if( typeof currentOp[currentName] !== 'object' || currentOp[currentName] === null )
{
currentOp[currentName] = {};
}
//move the reference for the next iteration
currentOp = currentOp[currentName];
}
//object chain build complete, assign final value
currentOp[finalName] = value;
}
}
//use function
setGlobalItemByName( 'Fluent.Include.JqueryPulse', true );
//Check that Fluent.Include.foo did not get lost
console.log( Fluent.Include.foo );
//Check that Fluent.Include.JqueryPulse got set
console.log( Fluent.Include.JqueryPulse );

Getting null or not an object error in javascript code

Here is the line which is causing null or not an object error
if(frm.elements["hdn_retain"+indexval].value==""){
....
} else {
....
}
frm.elements["hdn_retain"+indexval] may be a null object. So, it will have error when getting the value. You can check the frm.elements["hdn_retain"+indexval] if it is null first.
if(frm.elements["hdn_retain"+indexval] != null && frm.elements["hdn_retain"+indexval].value=="")
Either frm or frm.elements["hdn_retain"+indexval] isn't a valid object (doesn't exist in the dom) and therefore you can't access it's property.
you could try something like:
if(frm.elements["hdn_retain"+indexval] && frm.elements["hdn_retain"+indexval].value==""){
Following is the result of alert statement:
alert("frm:::"+frm);
alert("frm elements::::"+frm.elements);
alert("frm hdn_retain :: "+frm.elements["hdn_retain"+indexval]);
frm:::[object]
frm elements::::[object]
frm hdn_retain :: undefined
you can use this utility method getProperty i always use to make sure i get a nested namespace back without worrying about whether or not something is defined:
function getProperty(ns, obj) {
var nsArray = ns.split('.'),
i = 0,
nsLen = nsArray.length;
while (nsLen > 0) {
var newNs = nsArray.shift();
if (obj[newNs]) {
obj = obj[newNs];
} else {
return false;
}
nsLen = nsArray.length;
}
return obj;
};
var index = "hdn_retain" + indexval;
// the following `value` will come back as a valid object/value or a false
value = getProperty('elements.' + index + '.value', frm);
if (value) {
// do whatever
} else {
// do not whatever
}
this can be applied not only to this situation but to any other situation you need to make sure a certain namespace is available before usage.

Categories

Resources