Namenone
Namenone

Reputation: 344

Javascript Object literal, POST problems

Im trying to get autocomplete-rails.js working in Rails with Ajax,

i Have the following function

<script type="text/javascript">
function reply_click(clicked_id)
{
 var x = "work";
 var y = "monday"
 alert(y)
 $.ajax({
  type    : 'POST',
  url     : "/whens", 
  data: { y : x},
success : function(data) {
            alert(data);          
          },  
});
}
</script>

The problem im getting is that this returns

"y"=>"work"

and i want it to return the value of y instead

"monday"=>"work"

Also, if i do the following

<script type="text/javascript">
function reply_click(clicked_id)
{
 var x = "work";
 var y = "monday"
 var data = {};
 data[x] = y;
 $.ajax({
  type    : 'POST',
  url     : "/whens", 
  data,
success : function(data) {
            alert(data);          
          },  
});
}
</script>

it seems to return The problem im getting is that this returns

"term"=>"work"

Any idea how i can get it returning the contents of y

Upvotes: 0

Views: 561

Answers (4)

Elias Van Ootegem
Elias Van Ootegem

Reputation: 76395

You can't, the second snippet (data[y] =) is the only way. Here's why:

An object literal, like all things in JS is an object (duh) and has properties. All variables declared in the global scope are properties of the global (nameless) object. The only (semi-)true variables you have are the ones you declare in a closure scope. So looking at it from that viewpoint, it stands to reason that properties should not be quoted when constructing an object literal.
I'd even go as far as to say that allowing quoted properties in the declaration of an object literal should be considered wrong, or it should -at the very least- be discouraged.

JS is a wonderful language, covered up by a pile of inconsistencies, quirks and bad ideas. Sadly, if all you know is the gunk (almost everybody knows the gunk, few know the actual language and where it gets its power) the rare features that are consistent and good look like an obstacle at first. Thankfully, you have tons of constructs that enable you to do just what you want, and do it well.

In this case, you could just write it all out data[a] = b; data[c] = d;... OR you could use a power-constructor (google it)
An other option is just a very small loop, assuming your data object will be filled using the arguments passed to the function:

var data = {};
var argArray = Array.prototype.slice.apply(arguments,[0]);//returns array of arguments
var duo;
while(duo = argArray.splice(0,2))
{
    data[duo[0]] = duo[1];
    if (argArray.length < 2)
    {
        break;
    }
}

just to give an example. I'd recommend you (and everyone else) to look into crockfords constructions when it comes to objects, and what a function call entails in JS: a function isn't just called, a call-object is created.

Upvotes: 0

sumskyi
sumskyi

Reputation: 1835

variable as index in an associative array - Javascript

> var x = "work"
> var y = "monday"

> data= {}
{}
> data[x]=y
'monday'
> data
{ work: 'monday' }

Upvotes: 0

Prasad Surase
Prasad Surase

Reputation: 6574

if u want to load some data using ajax which in return can be used for auto-complete then load the array of strings by ajax. eg. in controller do-

def get_characteristics
  unless ['Threads', 'Note'].include?(params[:name])
  @characteristics = Category.all.collect(&:characteristic)
  respond_to do |format|
    format.js{}
  end
end

in get_characteristics.js.haml (eg is in haml)

var characteristics = #{@characteristics.to_json};
$('#characteristic').autocomplete( //the id of the text fields where u want autocomplete
  source: characteristics  //the array of string that u want for autocomplete
)

for additional info http://jqueryui.com/demos/autocomplete/

Upvotes: 0

AlanFoster
AlanFoster

Reputation: 8306

If a key doesn't have quotes, that doesn't mean it's using a variable.

The correct way of doing it, as you mention is

var data = {};
data[y] = x;
$.ajax({
  type    : 'POST',
  url     : "/whens", 
  data    : data,
  success : function(data) {
            alert(data);          
          },  
 });

Note I changed it to data[y] = x;

Upvotes: 2

Related Questions