{"id":6756,"date":"2014-04-23T02:59:13","date_gmt":"2014-04-23T02:59:13","guid":{"rendered":"https:\/\/unknownerror.org\/index.php\/2014\/04\/23\/multi-column-autocomplete-using-jquery-collection-of-common-programming-errors-2\/"},"modified":"2014-04-23T02:59:13","modified_gmt":"2014-04-23T02:59:13","slug":"multi-column-autocomplete-using-jquery-collection-of-common-programming-errors-2","status":"publish","type":"post","link":"https:\/\/unknownerror.org\/index.php\/2014\/04\/23\/multi-column-autocomplete-using-jquery-collection-of-common-programming-errors-2\/","title":{"rendered":"Multi Column AutoComplete using JQUERY-Collection of common programming errors"},"content":{"rendered":"<p>I am looking at the JQUERY example on the http:\/\/jsfiddle.net\/g4stL\/212\/ link in Jsfiddle website.<\/p>\n<p>I am very impressed by the feature. Infact we have to implement the exact same feature on our application.<\/p>\n<p>If I copy the code as it is, I am able to see the multicolumn autocomplete. However the selection part does not work. If I select using mouse cursor or using Arrow keys the program fails.<\/p>\n<p>The error I get is<\/p>\n<p>&#8220;htmlfile: Unexpected call to method or property access.&#8221;<\/p>\n<p>In the append function of jQuery.fn.extend code in Jquery-1.7.2.js.<\/p>\n<p>mcautocomplete widget is in the custom js file under script folder in MVC.<\/p>\n<p>Can you please help?<\/p>\n<pre><code>$.widget('custom.mcautocomplete', $.ui.autocomplete, {\n    _renderMenu: function(ul, items) {\n        var self = this,\n            thead;\n\n        if (this.options.showHeader) {\n            table = $('');\n            $.each(this.options.columns, function(index, item) {\n                table.append('' + item.name + '');\n            });\n            table.append('');\n            ul.append(table);\n        }\n        $.each(items, function(index, item) {\n            self._renderItem(ul, item);\n        });\n    },\n    _renderItem: function(ul, item) {\n        var t = '',\n            result = '';\n\n        $.each(this.options.columns, function(index, column) {\n            t += '' + item[column.valueField ? column.valueField : index] + ''\n        });\n\n        result = $('<\/code><\/pre>\n<pre>').data('item.autocomplete', item).append('' + t + '').appendTo(ul);\n        return result;\n    }\n});\n<\/pre>\n<p><code>Additional findings: The code works in Fiddle This code does not crash in Chorme or FireFox.<\/code><\/p>\n","protected":false},"excerpt":{"rendered":"<p>I am looking at the JQUERY example on the http:\/\/jsfiddle.net\/g4stL\/212\/ link in Jsfiddle website. I am very impressed by the feature. Infact we have to implement the exact same feature on our application. If I copy the code as it is, I am able to see the multicolumn autocomplete. However the selection part does not [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[1],"tags":[],"class_list":["post-6756","post","type-post","status-publish","format-standard","hentry","category-uncategorized"],"_links":{"self":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/6756","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/comments?post=6756"}],"version-history":[{"count":0,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/posts\/6756\/revisions"}],"wp:attachment":[{"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/media?parent=6756"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/categories?post=6756"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/unknownerror.org\/index.php\/wp-json\/wp\/v2\/tags?post=6756"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}