How to add a custom filter which integrates with a third party tool

[GoogleCodeExporter]

I want to integrate jQuery autoSuggest box with the HtmlFilterEditor.

Original issue reported on code.google.com by raghaven...@gmail.com on 3 Jun 2010 at 6:54

[GoogleCodeExporter]

You should plug in your own FilterEditor. 

http://code.google.com/p/jmesa/wiki/FilterRecipes

Take a look at the HtmlFilterEditor as an example and be sure to ask questions 
if you
get stuck. What you want to do should be very possible.

Original comment by jeff.johnston.mn@gmail.com on 4 Jun 2010 at 1:50

[GoogleCodeExporter]

I have integrated jQuery autoSuggest box with the HtmlFilterEditor but that 
third party tool needs an ajax call to work but the filter is not allowing it 
to do the ajax call

Original comment by raghaven...@gmail.com on 8 Jun 2010 at 5:34

[GoogleCodeExporter]

What errors are you getting? Do you use Firebug? That is a great tool for 
debugging these kinds of issues.

Original comment by jeff.johnston.mn@gmail.com on 8 Jun 2010 at 2:49

[GoogleCodeExporter]

Yes I am using firebug. it is not giving any error. The problem is it is not 
sending request to serverside

createDynAutoSuggestFilter : function(filter, id, property) {
            if (dynFilter) {
                return;
            }

            dynAutoSuggestFilter = new classes.DynFilter(filter, id, property);

            var cell = $(filter);
            var width = cell.width();
            var originalValue = cell.text();
            var items; 

            if(((dynAutoSuggestFilter.property).indexOf("city") >= 0) && ((dynAutoSuggestFilter.property).indexOf("state") < 0)){
                $.post('/BloodLnPickList.action?getCities',
                        function(data) {               
                            items = data;
                        });             
            }

            if((dynAutoSuggestFilter.property).indexOf("city") >= 0 && (dynAutoSuggestFilter.property).indexOf("state") >= 0){
                $.post('/BloodLnPickList.action?getStates',
                        function(data) {               
                            items = data;
                        });             
            }          

            /* Enforce the width with a style. */
            cell.width(width);
            cell.parent().width(width);
            cell.css('overflow', 'visible');            
            cell.html('<div id="dynFilterAutoSuggestDiv"><input id="dynFilterAutoSuggestInput" class="autosuggest" name="filter" style="width:' + (width + 2) + 'px" value="" /></div>');

            var input = $('#dynFilterAutoSuggestInput');
            $('#dynFilterAutoSuggestInput').autocomplete(items, {
                minChars : 1,
                width : 100,                    
                highlightItem : true,
                formatItem : function(oData, nIndex, nTotal) {                      
                    return oData.name;
                },
                formatResult : function(oData, nIndex, nTotal) {
                    return oData.name;
                }
                }).result(function(oEvent,oData,oSelected)
                    {
                        alert(oData.name);
                    });            
            input.val(originalValue);           
            input.focus();

            $(input).keypress(function(event) {
                if (event.keyCode == 13) { /* Press the enter key. */
                    var changedValue = input.val();
                    cell.text('');
                    cell.css('overflow', 'hidden');
                    cell.text(changedValue);
                    $.jmesa.addFilterToLimit(dynAutoSuggestFilter.id, dynAutoSuggestFilter.property, changedValue);
                    $.jmesa.onInvokeAction(dynAutoSuggestFilter.id, 'filter');
                    dynAutoSuggestFilter = null;
                }
            });

            $(input).blur(function() {
                var changedValue = input.val();
                cell.text('');
                cell.css('overflow', 'hidden');
                cell.text(changedValue);
                $.jmesa.addFilterToLimit(dynAutoSuggestFilter.id, dynAutoSuggestFilter.property, changedValue);
                dynAutoSuggestFilter = null;
            });
        }

this is the code i have written in jquery.jmesa.js in filter section.
to retrieve items the ajax call is to be made which is not hapening in the 
filter

Original comment by raghaven...@gmail.com on 9 Jun 2010 at 11:12

[GoogleCodeExporter]

Not sure if this is still an issue or not...closing for now.

Original comment by jeff.johnston.mn@gmail.com on 10 Mar 2011 at 9:13

• Changed state: Invalid