My code is like this
var searchPreferences = new function() {
this.setValues = localStorage.setItem('searchPreferenceData', JSON.stringify({
clientName: document.getElementById('clientName').value,
carrier: document.getElementById('carrierName').value,
status: document.getElementById('ShipmentStatus').value,
genericView: document.getElementById('ddl_view').value
}));
this.getData = JSON.parse(localStorage.getItem('searchPreferenceData'));
this.showValues = new function() {
document.getElementById('clientName').value = GetData.clientName;
}
}
And I a calling this function like this
searchPreferences.setValues();
inside a button click. But no value is added to local storage. Can any one point out what I am doing wrong?
My code is like this
var searchPreferences = new function() {
this.setValues = localStorage.setItem('searchPreferenceData', JSON.stringify({
clientName: document.getElementById('clientName').value,
carrier: document.getElementById('carrierName').value,
status: document.getElementById('ShipmentStatus').value,
genericView: document.getElementById('ddl_view').value
}));
this.getData = JSON.parse(localStorage.getItem('searchPreferenceData'));
this.showValues = new function() {
document.getElementById('clientName').value = GetData.clientName;
}
}
And I a calling this function like this
searchPreferences.setValues();
inside a button click. But no value is added to local storage. Can any one point out what I am doing wrong?
Share Improve this question edited Nov 18, 2014 at 8:27 CodingIntrigue 78.7k32 gold badges176 silver badges177 bronze badges asked Nov 18, 2014 at 8:25 NoneNone 5,68023 gold badges93 silver badges178 bronze badges 2- 1 new function () ?, should be just "function()" – Hacketo Commented Nov 18, 2014 at 8:28
- @Hacketo I think he's instantiating while assigning, Not a good practice. It will threw errors if in restrict mode. – Reyraa Commented Nov 18, 2014 at 8:37
5 Answers
Reset to default 3you've instantiated the function. you need to call it like a member of object not a function
I'd like to edit my answer to explain more:
the code seems like implementation of Singleton design pattern, but in a wrong manner.
have it in mind that instantiating a function while assigning at the same statement of code, is not a good idea. when you instantiate a function the type of members bee "data" not "function":
typeof searchPreferences.getData == "object"
I mean a statement like
var fuc = new function () {}
executes the function and the returned result is assigned to func.
what do you think we get if we call searchPreferences.getData immediately after defining searchPreferences like you did?
you expect it to return null because you've not set anything to localstorage yet, but it returns an object with values of inputs.
the correct way is to define a funjction and instantiate it when you need, or in the best approach, just define a function and call it when you need:
var searchPreferences = function() {}
the problem is that you are using new keyword to instantiate the function before you need to use it. the result bees an object and the stored in searchPreferences. it's not a function to get called
setValues is not a function. It is set to the result of the call to setItem which will be undefined.
You probably have an error like this in your console:
Uncaught TypeError: undefined is not a function
Wrap it in a function:
this.setValues = function() {
localStorage.setItem('searchPreferenceData', JSON.stringify({
clientName: document.getElementById('clientName').value,
carrier: document.getElementById('carrierName').value,
status: document.getElementById('ShipmentStatus').value,
genericView: document.getElementById('ddl_view').value
})
};
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
var searchPreferences = new function() {
this.setValues =function(){
try{
alert("i m in");
localStorage.setItem('searchPreferenceData', JSON.stringify({
clientName: document.getElementById('clientName').value,
carrier: document.getElementById('carrierName').value,
status: document.getElementById('ShipmentStatus').value,
genericView: document.getElementById('ddl_view').value
}));
}catch(err){alert(err.message);}
}
this.getData =function(){
return JSON.parse(localStorage.getItem('searchPreferenceData'));
}
this.showValues = function() {
try{
document.getElementById('clientName').value = this.getData().clientName;
}catch(err){alert(err.message)}
}
}
</script>
</head>
<body>
<input type="text" id="clientName" />
<input type="text" id="carrierName" />
<input type="text" id="ShipmentStatus" />
<input type="text" id="ddl_view" />
<button onclick="searchPreferences.setValues()">Store data</button>
<button onclick="searchPreferences.showValues()">Get data</button>
</body>
</html>