Forums

ChronoForms v8 is now WordPress ready, ChronoMails is out

The JED needs volunteers!

Input Text Filtering with Autocompleter Ajax

rm
rmpaolillo 13 Mar, 2015
Hi Max and Bob,

how can I achieve an input box filter with autocompleter input text in CCv5 in a similar fashion of that you have in the demo of latest CFv5?

The only reference I have seen in the forum is:

http://www.chronoengine.com/forums/posts/f12/t97542.html

which is used for a dropdown. I have applied to my CCv5 view and it works great.

BTW, think that using the autocompleter input text is a very elegant solution.

I am ready to pay for this request in case my question is out of scope of this forum...In any case I will contribute to your great products somehow.

Thank you.

Marco
rm
rmpaolillo 15 Mar, 2015
Answer
Hi I solved by inserting in the "header code" the following: 

<link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
<script src="//code.jquery.com/jquery-1.10.2.js"></script>
<script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
<link rel="stylesheet" href="/resources/demos/style.css">
<script type="text/javascript">
 $(function() {
	var availableTags = [
	"ActionScript",
	"AppleScript",
	"Asp",
	"BASIC",
	"C",
	"C++",
	"Clojure",
	"COBOL",
	"ColdFusion",
	"Erlang",
	"Fortran",
	"Groovy",
	"Haskell",
	"Java",
	"JavaScript",
	"Lisp",
	"Perl",
	"PHP",
	"Python",
	"Ruby",
	"Scala",
	"Scheme"
	];
	$( "#tags" ).autocomplete({
	source: availableTags
	});
});
</script>


and in the footer (where my filters are) the following: 
<div class="ui-widget">
<label for="tags">Tags: </label>
<input id="tags">
</div>


following the jQuery example at http://jqueryui.com/autocomplete/.

Marco
rm
rmpaolillo 15 Mar, 2015
Of course you need the 
name="fltr[Model][field]"

part to make it work as a filter.
This topic is locked and no more replies can be posted.