943,175 Members | Top Members by Rank

Web Development > PHP > How To Integrate This Textbox Autofill Script?
Ad:
  • PHP Discussion Thread
  • Marked Solved
  • Views: 536
  • PHP RSS
Permalink
Sep 3rd, 2010
0

How To Integrate This Textbox Autofill Script?

Expand Post »
I haven't found this in my search, but it is not something that is easily defined ...also I am not sure whether this is PHP or more Javascript, so my apologies if I have posted in the wrong place.

Anyway, I have this PHP form:

PHP Syntax (Toggle Plain Text)
  1. <?php 
  2.  
  3. $app       = $this->globals('khxc_display.app');
  4. $eol       = $this->globals('khxc.eol');
  5. $formid    = $app . '--minisearch';
  6. $strid     = $app . '--prodsearch--string';
  7. $link      = $this->link_namespace($app,'prodsearch',array());
  8. $cgi_value = '';
  9.  
  10. $this->xhtml_quickform_header($formid,$app,'prodsearchp',array());
  11.  
  12. print '<p class="hidden"><label for="' . $app . '--minisearch--' . $strid . '"';
  13. print '>Search Term</label></p>' . $eol;
  14.  
  15. print '<p class="inline"><input class="khxc_quickfield" type="text" name="' . $strid;
  16. print '" id="' . $app . '--minisearch--' . $strid . '" value="';
  17. print $cgi_value . '" size="26" maxlength="100" /></p>' . $eol;
  18.  
  19. $this->xhtml_quickform_footer($formid,'Quick Search by Item Name',1);
  20.  
  21. print '<a class="unfancy" href="' . $link . '" title="Advanced Search">Advanced Search</a>' . $eol;
  22.  
  23. ?>


...and I am wanting to integrate the following Javascript script into it in order to prefill the search box and have it autoclear when someone clicks on it:


PHP Syntax (Toggle Plain Text)
  1. <form name="text_form" action="http://www.codeave.com/html/post.asp" method=post>
  2. <input name=u_input onFocus=clear_textbox() value=" Enter Your Search Here ">
  3. <input type=submit value=Submit>
  4. <input type=reset>
  5. </form>


I have already added the function part of the script...


PHP Syntax (Toggle Plain Text)
  1. <script language=JavaScript>
  2. <!-- 
  3. function clear_textbox()
  4. {
  5. if (document.text_form.u_input.value == " Enter Your Search Here ")
  6. document.text_form.u_input.value = "";
  7. } 
  8. -->
  9. </script>


...to my scripts file, but I cannot get the integration of the Javascript side of things to work properly.

So can anyone show us all how to properly integrate the two? - The best I have been able to come up with so far is a broken search box with autofilled text that remains no matter what!!
Similar Threads
Reputation Points: 14
Solved Threads: 1
Light Poster
JBLDW is offline Offline
38 posts
since Sep 2010
Permalink
Sep 3rd, 2010
0
Re: How To Integrate This Textbox Autofill Script?
Here is a example code which uses jquery.

PHP Syntax (Toggle Plain Text)
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  5. <title>Untitled Document</title>
  6. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  7. <script language="javascript">
  8. 	$(document).ready(function() {	
  9. 		 $("#keyword").val('Enter Your Search Here');		  
  10. 		 $("#keyword").bind("focus", function(){
  11. 		   if($(this).val() == 'Enter Your Search Here')	   
  12. 		   		$(this).val('');		   		
  13. 		 });
  14. 		 $("#keyword").bind("blur", function(){
  15. 		   if($(this).val() == '')	   
  16. 		   		$(this).val('Enter Your Search Here');		  
  17. 		 });
  18. 	});
  19. </script>
  20. </head>
  21.  
  22. <body>
  23. <input autocomplete="off" id="keyword" name="" style="width:250px;" type="text" />
  24. </body>
  25. </html>

Hope it will help you.
Reputation Points: 154
Solved Threads: 162
Master Poster
vibhadevit is offline Offline
791 posts
since Apr 2010
Permalink
Sep 3rd, 2010
0
Re: How To Integrate This Textbox Autofill Script?
Thanks, vibhadevit,- that looks to be just the kind of thing I need, only it does not seem to work with our setup.

I have tried entering the function into our main Javascript file, and also as is in the head of the template file but no dice - it does not work either way. Other than I feel that introducing the Javascript functionality through the autocomplete and id keys is exactly the way to go with this.
Reputation Points: 14
Solved Threads: 1
Light Poster
JBLDW is offline Offline
38 posts
since Sep 2010
Permalink
Sep 3rd, 2010
0
Re: How To Integrate This Textbox Autofill Script?
The following, taken from http://www.webdeveloper.com/forum/sh...d.php?t=102876, did the job for me:

PHP Syntax (Toggle Plain Text)
  1. <input type="text" name="name" value="Joe Bloggs" onfocus="this.value = ( this.value == this.defaultValue ) ? '' : this.value;return true;">

For anyone wanting to implement the following into a print statement it will probably need to be entered in the form:

PHP Syntax (Toggle Plain Text)
  1. <input type="text" name="name" value="Joe Bloggs" onfocus="this.value = ( this.value == this.defaultValue ) ? \'\' : this.value;return true;">
Last edited by JBLDW; Sep 3rd, 2010 at 2:48 pm.
Reputation Points: 14
Solved Threads: 1
Light Poster
JBLDW is offline Offline
38 posts
since Sep 2010
Permalink
Sep 4th, 2010
0
Re: How To Integrate This Textbox Autofill Script?
If user clicks text should be clear and when user blur that field, then text should again come.. this is ideal case.it is not there in above code.

Yes the code you have used and what i do is the same thing, i used jquery.
Jquery is easy way, because you can just give class name or id to textfield.
and in " $(document).ready(function() {" you can point to that.

if code doesn't work for you check that you include jquery.min.js on top of " $(document).ready(function() {".

you can also check error console of browser to find issue.
Reputation Points: 154
Solved Threads: 162
Master Poster
vibhadevit is offline Offline
791 posts
since Apr 2010
Permalink
Sep 4th, 2010
0
Re: How To Integrate This Textbox Autofill Script?
Thanks again, vibhadevit, I did not fully understand what I was dealing with (jQuery is not something I use usually), so I failed to include the following line in full, including the src="...

PHP Syntax (Toggle Plain Text)
  1. <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>

I have now tried using the function again, with the above library source URI and it worked perfectly - thank-you!

For anyone else new to (or unfamiliar with) jQuery, this link may be of use in helping to understand or implement it:

http://en.wikipedia.org/wiki/JQuery


...and for anyone else searching for something like this, the title should really have been something more like: How To Integrate This Textbox Autoclear Script for Integration into PHP Source? - For some reason I cannot add tags to our posts, so hopefully the search can pick up on that amendment instead...
Last edited by JBLDW; Sep 4th, 2010 at 9:30 am.
Reputation Points: 14
Solved Threads: 1
Light Poster
JBLDW is offline Offline
38 posts
since Sep 2010
Permalink
Sep 4th, 2010
0
Re: How To Integrate This Textbox Autofill Script?
Hi,
Use JQuery auto complete.
Just get yourself familiar with JQuery and look at autocomplete from JQuery UI
Reputation Points: 462
Solved Threads: 392
Senior Poster
evstevemd is offline Offline
3,681 posts
since Jun 2007
Permalink
Sep 4th, 2010
0
Re: How To Integrate This Textbox Autofill Script?
Thanks, evstevemd, - I will look into that for increasing the functionality of some things which I am having trouble tying to modify with PHP.

I had some issues, too, when trying to get the above script (modified for our store) to work, not least because <script language="javascript"> is not XHTML 1.0 strict and also because id was already in use and constructed dynamically on the PHP side of things.

Anyway, for anyone else trying to use this for PHP applications, and needing it to validate, I ended up with the following:

PHP Syntax (Toggle Plain Text)
  1. <script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.4.1/jquery.min.js"></script>
  2. <script type="text/javascript">
  3. $(document).ready(function() {
  4. $(".khxc_quickfield").val('Enter Item Title Search Term...');
  5.  
  6. $(".khxc_quickfield").bind("focus", function(){
  7. if($(this).val() == 'Enter Item Title Search Term...')
  8. $(this).val('');
  9. });
  10.  
  11. $(".khxc_quickfield").bind("blur", function(){
  12. if($(this).val() == '')
  13. $(this).val('Enter Item Title Search Term...');
  14.  
  15. });
  16. });
  17.  
  18. </script>
Last edited by JBLDW; Sep 4th, 2010 at 8:15 pm.
Reputation Points: 14
Solved Threads: 1
Light Poster
JBLDW is offline Offline
38 posts
since Sep 2010

This thread is solved

Either the thread starter or a moderator has marked this thread as solved. You can most likely trust the responses and answers given. There is most likely no reason for any further responses to be posted here. If you have a related question, please start a new thread in this forum instead.

This thread is more than three months old

No one has posted to this discussion for at least three months. Please let old threads die and do not reply to them unless you feel you have something new and valuable to contribute that absolutely must be added to make the discussion complete. Otherwise, please start a new thread in this forum instead.
Message:
Previous Thread in PHP Forum Timeline: PHP
Next Thread in PHP Forum Timeline: Submit and Close the Form with single click





About Us | Contact Us | Advertise | Acceptable Use Policy
Forum Index | Build Custom RSS Feed


Follow us on Twitter


© 2011 DaniWeb® LLC