Question

I swear this used to work. I am trying to do breadcrumbs. I have a JS function in the global namespace called “breadcrumb”. It accepts a string as its only parameter:

function breadcrumb(attr) {
  hash = { type: "POST", url: "brands/get_attributes", data: $("#attributeform").serialize() };
  $.ajax(hash);
  return false;
}

I have my breadcrumb link on the HTML page defined as follows:

<a href="javascript:breadcrumb(\'<%= brand_attribute.attributename %>\');"><%= value %></a>

Fine so far. But when I click the breadcrumb link, I get this in the URL:

javascript:breadcrumb('Whirlpool');

And a blank page with the word “false”, which is what the function returns. My question is, why is it actually navigating to the javascript function itself? Why is the Ajax result not being rendered?

Answer 1

Use onclick rather than href. Also, the OCD in me suggests the following syntax change:

var hash = { //use braces to define an object
               type: "POST", 
               url: "brands/get_attributes", 
               data: $("#attributeform").serialize()
};