Skip to main content

This site requires you to update your browser. Your browsing experience maybe affected by not having the most up to date version.

Archive

Our old forums are still available as a read-only archive.

Moderators: martimiz, Sean, biapar, Willr, Ingo, simon_w

adding onclick to search form button


Reply

4 Posts   2663 Views

Avatar
Nicolaas

1 June 2007 at 10:07am Forum Moderator, 213 Posts

Hi Folk

I have written the following piece of code (from tutorial):
class Page_Controller extends ContentController {
function SearchForm() {
$searchText = isset($this->Query) ? $this->Query : 'Search';
$searchField = new TextField("Search", "", $searchText);
$fields = new FieldSet($searchField);
$resultAction = new FormAction("results","Go");
$actions = new FieldSet($resultAction);
return new SearchForm($this, "SearchForm", $fields, $actions);
}

I would like to add some JavaScript to the search field so that it automatically removes the word search onclick.

It seems like I can only do this in Sapphire or is there another way. I am not too keen to do it in Sapphire, because then it will get lost when I upgrade the site.

Any help greatly appreciated.

Nicolaas

Avatar
Sean

1 June 2007 at 1:26pm Forum Moderator, 921 Posts

If you include the behaviour script as requirements for your class you can create a new js file with something like this:

eg. Page.php

class Page_Controller extends ContentController {

function init() {
Requirements::javascript('jsparty/behaviour.js');
Requirements::javascript('mysite/javascript/SearchForm.js');
parent::init();
}

}

And then, you can create your SearchForm.js file (Replace the # ID with the correct search input field ID if this one isn't correct:

Behaviour.register({
'#Search_Form_SearchForm_Search' : {
onfocus : function() {
         if(this.value == 'Search') this.value = '';
},
onblur : function() {
   if(this.value == '') this.value = 'Search';
}
}
});

Hope this helps!

Cheers,
Sean

Avatar
Nicolaas

5 June 2007 at 12:46am Forum Moderator, 213 Posts

Hi Sean

Thank you for your reply.

I noticed that all my pages have the the following JS attached (added to my source code) by default:

<script type="text/javascript" src="jsparty/behaviour.js"></script>
<script type="text/javascript" src="jsparty/prototype.js"></script>
<script type="text/javascript" src="jsparty/scriptaculous/effects.js"></script>
<script type="text/javascript" src="cms/javascript/PageCommentInterface.js"></script>

Why would that be? It is not in the template/age.ss file and not in the code/page.php file, that is for sure....

The behaviour does not really seem to work either.... (but not JS errors).

Any suggestions?

Avatar
Sean

5 June 2007 at 11:19am Forum Moderator, 921 Posts

Those files will have been included because you've enabled the page commenting. There's some javascript for ajax on the comments interface that depends on behaviour and prototype.

Cheers,
Sean