jquery - Triggering the return key on event unexpectedly refreshes page and gives undefined error - JavaScript -

when click in field, type text, , press return on keyboard triggers initializetable function refreshes page , gives error form[0] undefined. however, when use change event change dropdown selection, doesn't cause unexpected behavior. i'm not sure why pressing return key in text field causing this. response.

<script> (function($){  var listview = $('#listview');  var lists = (function(){     var criteria = {         dropfilter: {             insert: function(value){                 if(value)                      return {"filter" : value};              },             msg: "filtering..."         },         searchfilter: {             insert: function(value){                 if(value)                     return {"search" : value}             },             msg: "searching..."         }      }     return {           create: function(component){             var component = component.href.substring(component.href.lastindexof('#') + 1); //sites             return component;         },          setdefaults: function(component){             var parameter = {};             switch(component){                 case "sites":                     parameter = {                         'url': 'sites',                                                  'order': 'site_num',                         'per_page': '20'                     }             }             return parameter;         },         getcriteria: function(criterion){             return criteria[criterion];              },         addcriteria: function(criterion, method){             criteria[criterion] = method;            }     } })();    var form = function(form){     var fields = [];     $(form[0].elements).each(function(){           var field = $(this);           if(typeof field.attr('alter-data') !== 'undefined') fields.push(new field(field));       })   }  form.prototype = {     initiate: function(){         for(field in this.fields){             this.fields[field].calculate();           }     },      iscalculable: function(){           for(field in this.fields){                   if(!this.fields[field].alterdata){                  return false;              }         }          return true;       }  }  var field = function(field){      this.field = field;       this.alterdata = true;       this.component = {'url' : window.location.hash.substring(window.location.hash.indexof('#') + 1)};     this.attach("change");       this.attach("keypress");   }  field.prototype = {      attach: function(event){         var obj = this; //our field object         if(event == "change"){             obj.field.bind("change", function(){                  return obj.calculate();             })         }         if(event == "keypress"){             obj.field.bind("keypress", function(e){                   var code = (e.keycode ? e.keycode : e.which);                 if(code == 13){                      return obj.calculate();                 }             })         }     },     calculate: function(){         var obj = this,              field = obj.field,               component = obj.component,             msgclass = "msgclass",             msglist = $(document.createelement("ul")).addclass("msgclass"),               types = field.attr("alter-data").split(" "),               container = field.parent(),               messages = [];          field.next(".msgclass").remove();           for(var type in types){               var criterion = lists.getcriteria(types[type]);               if(field.val()){                  var result = criterion.insert(field.val());                   container.addclass("waitingmsg");                   messages.push(criterion.msg);                    obj.alterdata = true;                    initializetable(component, result);                }             else {                  return false;                  obj.alterdata = false;              }         }         if(messages.length){             for(msg in messages){                 msglist.append("<li>" + messages[msg] + "</li");               }         }         else{             msglist.remove();           }     } }  $('#dashboard a').click(function(){     var currentcomponent = lists.create(this);     var defaults = lists.setdefaults(currentcomponent);     initializetable(defaults); });  var initializetable = function(defaults, custom){      var custom = custom || {};      var query_string = $.extend(defaults, custom);      var params = [];     $.each(query_string, function(key,value){         params += key + '=' + value + "&";      })     var url = params.substring(params.indexof("url")+4,9);     params = params.substring(params.indexof("&")+1).replace(params.substring(params.lastindexof("&")),"");      $.ajax({         type: 'get',         url: '/' + url,         data: params,         datatype: 'html',         error: function(){},         beforesend: function(){},         complete: function() {},         success: function(response) {              listview.html(response);                  var form = $('form');                 form.calculation();            }     })   }  $.extend($.fn, {        calculation: function(){              var formready = new form($(this));              if(!formready.iscalculable){                 return false;              }      } })   })(jquery)  </script> 

rather going through whole script, actual issue this:

if(event == "keypress"){             obj.field.bind("keypress", function(e){                  var code = (e.keycode ? e.keycode : e.which);                 if(code == 13){                      return obj.calculate();                 }             })         }     } 

finally, got work this:

            if(event == "keypress"){             obj.field.bind("keypress", function(e){                  var code = (e.keycode ? e.keycode : e.which);                 if(code == 13){                      e.preventdefault();                     return obj.calculate();                 }             })         }     }, 

hence, first prevent default , execute our custom function.