Generating proper links for onclick attribute | Event Listeners

[eluser]Eric Cope[/eluser]
I use the anchor() function to generate appropriate links within my CodeIgniter code. Is there a way to generate the link path without using anchor()? I want to embed a path for an onclick attribute. I looked in the docs and the forum, and did not see anything...
Any help is appreciated.

I know I could use PHP to strip off the characters around what I am looking for, but I was hoping for something more elegant.

Update: I guess I could use:

Code:

base_url() . index_page() . "/uri1/uri2/"

again, hoping for something more elegant...

[eluser]xwero[/eluser]

Code:

site_url('uri1/uri2/');

[eluser]Eric Cope[/eluser]
That is why codeIgniter is awesome. The CI community rocks!
Thanks!

[eluser]Michael Wales[/eluser]
Kind of off-topic (it doesn't directly answer your question) but is somewhat related. I highly recommend against onclick. You are placing Javascript directly within the layout of the site and the best way to approach this is with a listener on that link.

You will find it is much easier to manage in the future and fully standards compliant now and throughout the future.

[eluser]ejangi[/eluser]
I agree with Mr Wales and I feel a little evil posting this, but you "could" also go:

Code:

anchor('uri/uri2/', 'My text', array('onclick' => 'alert("Hello world");return false;'));

Again, I don't recommend it and I don't do it - but at least it somewhat degrades.

[eluser]Michael Wales[/eluser]
Eric, you sent a PM asking me to explain event listeners a bit more. I thought I would do so hear so everyone can see the answer. This example uses jQuery, as that is the library I prefer and it's very fast.

Event Listeners are basically allowing you to write your javascript (usually in a separate file that you include within the HEAD of your view) and manage it separately from the view itself. This also make the depredation very graceful, in case your user doesn't have javascript enabled.

Let's say you have a series of "tabs" and you would like to update a div below that with content based on the tab clicked. Using jQuery, and event listeners, you can manage this code all in one place and if the user doesn't have javascript enabled - you can just handle it via the normal link.

The code below will load a URL via AJAX and place it's content within the #content div, when a link containing the .tab class is clicked. If Javascript is not enabled - the user will just be sent to that page as normal.

To clean things up a bit, just edit the requested controller to determine whether it is being loaded via Ajax (if so, just return the data) or if it's being requested normally (return your entire layout, data, etc).

CI doesn't allow script tags - comments fill those spots here:

Code:

// Script tag to load jQuery
// Open Script tag
  $(document).reader(function() {
    $("a.tab").click(function() {
      $("#content").load($(this).attr("href"));  
      return false;
    });
  });
// Close Script tag


<?= anchor('news', 'News', array('class'=>'tab')); ?>
<?= anchor('users', 'Users', array('class'=>'tab')); ?>
<?= anchor('files', 'Files', array('files'=>'tab')); ?>
<div id="content">
</div>

[eluser]Eric Cope[/eluser]
That is an excellent description! In my application, a calendar system, I want the users to be able to add appointments by clicking on available space. The "onclick" event works well because I do not want text there, it would be to cluttered. For users that do not have javascript, i was going to provide a link to the "add appointment page", however this will be a corporate internal webpage, so all users will have javascript enabled. Your thoughts?

[eluser]Michael Wales[/eluser]
Even if you know all users will have javascript enabled, I would still go the event listener route. It makes it much simpler to manage everything when it's separated.

Plus, I imagine an event listener on a non-link item (like the calendar's available space) is more reliable than onclick. This is a browser-based assumption and since you are in a corporate setting you probably won't comes across browser discrepancies.

[eluser]Eric Cope[/eluser]
When I click on a cell in the calendar table, I pass information including day, month, year, hour, and minute to initialize the "add appointment" page. That means I have up to 72 unique cells that when clicked, pass unique data. If I use jQuery, how would I write that code? Sorry for the handholding, the fog has not lifted yet...