• Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 1451
  • Last Modified:

jQuery alert dialogs (prompt) with autocomplete ?

Hi,

I use the jQuery (<http://abeautifulsite.net/notebook.php?article=87>) alert dialog plugin on a website of mine in order to display a prompt dialog, prompting the user to enter a tag.

Having it interact with an autocomplete plugin (such as <http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/>, others are ok too) would make great sense, since tags are most of the time already used in the database. It would help the user not to use slight variations of the same tag.

Is it feasible? How would you do it?

Thanks
0
CPL593H
Asked:
CPL593H
  • 7
  • 6
1 Solution
 
hard2u2001Commented:
Yes Its a nice Idea... Even del.icio.us uses such things for suggesting users available tags..

I found a nice plugin here:
http://remysharp.com/wp-content/uploads/2007/12/tagging.php

Have a look at it.
Its a nice script
0
 
CPL593HAuthor Commented:
The script is nice and seems easy to implement, but I'm not able to make it work with jPrompt.

The issue as I understand it is that the <input> field and its id are created on the fly by jPrompt and there seems to be no way to attach a jQuery function to an object that doesn't exist yet.

Re-reading my original post, I saw that I was unclear about this: it is jPrompt's part of jQuery alerts that I need to use.

In my case: you select a snippet of text, you click on a "tag it" button and a jPrompt asks you the tag to use. That's this dialog that should have an autocomplete.
0
 
hard2u2001Commented:
Yes its a bit tricky but possible to attach a jQuery function to an object that doesn't exist yet.
For that u can use a very lightweight plug in called livequery.
By using this plug in u can attach functions to the objects that will be added to dom in future. Its worth having look. Especially when u are working with AJAX. I used it in my 2-3 projects without any hassle.

And sorry but i didn't understand ur line
"In my case: you select a snippet of text, you click on a "tag it" button and a jPrompt asks you the tag to use. That's this dialog that should have an autocomplete."
0
Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

 
CPL593HAuthor Commented:
Well, here is the basic idea: consider an ensemble of related texts, accessible through an interface that displays each of these texts in a table.

Amongst other ideas, these texts contain some snippet about, say, health. One selects the snippet, say "eating vegetables is healthy". Once the text is selected, one clicks on the "tag it" button, and a jPrompt is displayed, asking what tag to use to mark the snippet. The same for, say, "medecine" for "avoid mixing medecine without doctor advice", and so on and so forth.

Later, when you need all health-related (or medecine-related) citations is the various texts encoded in the system, you get a list of snippets pertaining to the topic and the ability to see them in context.

(See another open question on mine to see how I try to find the snippet coordinates in a given text).

I'll have a look at livequery, but if you happen to know the syntax to mix jQuery Alert's jPrompt with LiveQuery and a autcomplete/tagging plugin, you'll be instantly granted 500 points. ;)
0
 
hard2u2001Commented:
I have solution without using even livequery. But can't post the files here.
and attaching snippet is not possible for all files
0
 
hard2u2001Commented:
I have kept the files on my server.



http://hardik.noadsfree.com/dynamicTags/jPrompt%20with%20Tags.php

Is that what you wanted?
If so then I can provide you code.
0
 
CPL593HAuthor Commented:
We're almost there, har2u2001 :)

Do you think there's a way to allow to choose a suggestion by using the arrow keys, as other autocomplete scripts do?

That would perfectly fill my needs, then.

Thanks
0
 
hard2u2001Commented:
Do u mean that the horizontal display is fine and in the same view user can move arround using arrow keys..... Or u want vertical display like other autocompletes....
According to me tagging system is better horizontal as user can select multiple values...
what say?
0
 
CPL593HAuthor Commented:
In my case, only one tag at a time is to be selected.

I'd say I'd rather have a vertical display, but the most important thing is that the tag can be selected using arrow keys.
0
 
hard2u2001Commented:
Ok this is the most possible thing i could do till now...
have a look at it...
http://hardik.noadsfree.com/dynamicTags/jPrompt%20with%20Tags.php
0
 
CPL593HAuthor Commented:
Looks almost perfect!

I'd just change the timeout to something a bit shorter, but I think I can manage that.

I checked the source and noticed that very little was changed in the main file (and was not able to replicate the changes on my own script). So I guess that all I need now is a short explanation of what you have done and the points will be yours!

Thanks!
0
 
hard2u2001Commented:
I haven't changed much just instead of "tags.js" used another file "jquery.autocomplete.js"
and called those function.

I can give u whole code if u wish.
$(document).ready( function() {
				
				
				$("#prompt_button").click( function() {
					jPrompt('Type something:', 'Prefilled value', 'Prompt Dialog', function(r) {
						if( r ) alert('You entered ' + r);
					});
					$("#popup_prompt").autocomplete("tags.php", { minChars:2 });
 
				});
			});

Open in new window

0
 
CPL593HAuthor Commented:
OK!

I made a really stupid mistake by copying your source, I mixed the .css and .js files. My eyes are not what they used to be.

Anyway, it works really well now, I'll have something to show my colleagues on Monday. Thanks a lot for that.

BTW, since you see to know quite a bit about Javascript & jQuery there are maybe easy points to be gained in my two other pending questions. :-D
0

Featured Post

How to Use the Help Bell

Need to boost the visibility of your question for solutions? Use the Experts Exchange Help Bell to confirm priority levels and contact subject-matter experts for question attention.  Check out this how-to article for more information.

  • 7
  • 6
Tackle projects and never again get stuck behind a technical roadblock.
Join Now