I seem to have a problem with objects' properties' scope. I would like to output each of the Message
objects' title
and message
properties to a select
element, but it is Not Working! What am I doing incorrectly
<html><head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
function Message(title, message) {
this.title=title;
this.message=message;
this.getTitle = function(){
return this.title;
};
this.getMessage = function(){
return this.message;
};
}
var messages = new Array(
new Message("First Title", "This is the first message"),
new Message("Second Title", "This is another message")
);
function updateSelect () {
$("#cannedMessages_button").empty();
for (c in messages) {
// First try, with getters and setters
$("#cannedMessages_button").append($('<option>', { value : c.getMessage() , text : c.getTitle() }));
// Second try, directly
$("#cannedMessages_button").append($('<option>', { value : c.message , text : c.title }));
}
}
updateSelect();
});
</script>
</head><body>
<form><select id="cannedMessages_button"></select></form>
</body></html>
I can verify that the foreach is in fact running two iterations, but I cannot get the values out of the objects.