Taco Class - The power of jQuery all wrapped up in a Codeigniter Library

Taco Class - The power of jQuery all wrapped up in a Codeigniter Library - Printable Version

+- CodeIgniter Forums (https://forum.codeigniter.com)
+-- Forum: Archived Discussions (https://forum.codeigniter.com/forumdisplay.php?fid=20)
+--- Forum: Archived Libraries & Helpers (https://forum.codeigniter.com/forumdisplay.php?fid=22)
+--- Thread: Taco Class - The power of jQuery all wrapped up in a Codeigniter Library (/showthread.php?tid=22007)

Pages: 1 2 3

Taco Class - The power of jQuery all wrapped up in a Codeigniter Library - El Forum - 10-22-2009

[eluser]stathis[/eluser]
hey, please don't mind on the above, you have answered it on your previous post. Thanks again!

Taco Class - The power of jQuery all wrapped up in a Codeigniter Library - El Forum - 10-24-2009

[eluser]thinkigniter[/eluser]
I've updated the class to version 4.06.

I've remove the sanitize feature and replaced it with an encoding feature.

Now, problematic html attributes will be encoded and a decoding jquery function will be called right after this so the encoded content will be decoded right after it is displayed in your html.

Cheers

Taco Class - The power of jQuery all wrapped up in a Codeigniter Library - El Forum - 10-27-2009

[eluser]stathis[/eluser]
Hi , it's me again.
I would like your advice on implementing the following:

I have a form for a cms system, that displays the fields of a database table(products).
Inside the form, i have a datagrid that populates some related records from another table(product_images).
I've build the datagrid in such way , that each record is populated into input boxes, and it has 2 links, one for edit, one for delete.
Each of these links has a onclick function assigned, that calls a function by passing the record's id to it. For example:

Code:
<table>

<tr id="row_id_1">

   <td>

      &lt;input id="image_id_1" value="productimage1.jpg"/&gt;

   </td>

   <td>

      <a href="#" id="image_edit_1">edit</a>&nbsp;

      <a href="#" id="image_delete_1">delete</a>&nbsp;

   </td>

</tr>

<tr id="row_id_2">

   <td>

      &lt;input id="image_id_2" value="blalbla.jpg"/&gt;

   </td>

   <td>

      <a href="#" id="image_edit_2">edit</a>&nbsp;

      <a href="#" id="image_delete_2">delete</a>&nbsp;

   </td>

</tr>

</table>

The javascript function is like this:

Code:
function ajax_function(id,action){

   img=document.getElementById("image_id_"+id).value;

   $.ajax({

      type: "POST",

      url: base_url + "index.php/mycontroller/mytacofunction/"+ id,

      data:{ image_name: img, action: action}

   });        

}

The question comes to the point where i need to use the taco class to reload this content, and set the onclick functions using the eval functionallity
Do i need to specify eval functionality for the links of each row of the datagrid?
For example:

Code:
$this->taco->set('eval', "$('#image_edit_1').click(function () {ajax_function(1,'edit')};");

$this->taco->set('eval', "$('#image_delete_1').click(function () {ajax_function(1,'delete')};");

$this->taco->set('eval', "$('#image_edit_2').click(function () {ajax_function(1,'edit')};");

$this->taco->set('eval', "$('#image_delete_2').click(function () {ajax_function(2,'delete')};");

Could you please advice?

Thanks in advance,

Stathis

Taco Class - The power of jQuery all wrapped up in a Codeigniter Library - El Forum - 10-27-2009

[eluser]thinkigniter[/eluser]
Hi Stathis,

I hope this helps...

First lets change your "function ajax_function" to a jquery function.

Code:
$(function() {

    $("td a").click(

        function(){

            var base_url = "http://localhost/";

            var link_id = $(this).attr('id');

            var link_action = $(this).html();

            var image_value = $("#image_id_"+link_id.substring(link_id.length-1)).val();

            $.post( base_url +"index.php/mycontroller/mytacofunction/", { id: link_id ,image_name: image_value, action: link_action } );

        });

});&lt;!-- END jquery --&gt;

This function will be called when the "a" link is clicked.

It will get the "ID" {link_id} of the "A" link that called it.
It will get the html {link_action} of the link that called it. e.g delete, edit
It will get the image value/name from the input above it.

It will then $.post (not $.AJAX) the information to your controller/method

The reason I used $.post not $.AJAX is because $.AJAX adds a cache breaking string to the end of the uri that stuffs up CI's uri fetching.

As to the return action...
If you have taconite loaded on your html/view file and the controller generates TACO/XML
then the html/view will automaticly recognise the taco commands you sent and action them.

cheers

Taco Class - The power of jQuery all wrapped up in a Codeigniter Library - El Forum - 10-27-2009

[eluser]thinkigniter[/eluser]
also if you want to remove the input tag that has the image.

In Taco...

Code:
$link_id = $this->input->post('link_id');

$this->taco->set('empty', '#image_id_' . $link_id);

Poooof and it's GONE.

I LOVE JQUERY...

Taco Class - The power of jQuery all wrapped up in a Codeigniter Library - El Forum - 11-18-2009

[eluser]stathis[/eluser]
Hi,
I was taking some time off for a while!!
Many thanks for your help, it was indeed what i was looking for.

Taco Class - The power of jQuery all wrapped up in a Codeigniter Library - El Forum - 11-18-2009

[eluser]thinkigniter[/eluser]
No problems, anytime

Taco Class - The power of jQuery all wrapped up in a Codeigniter Library - El Forum - 11-19-2009

[eluser]stathis[/eluser]
Hi,
Just a couple of questions (again!!)
1. I noticed that in the first line of your class on the codeigniter's wiki, you have the:

Code:
&lt;?php if (!defined('ABSPATH')) exit('No direct script access allowed');

instead of

Code:
&lt;?php if (!defined('BASEPATH')) exit('No direct script access allowed');

in all the other codeigniter's classes.

The class does not work on me with the ABSPATH check but it works when i use the BASEPATH check. Why it doesn't work on me with the ABSPATH, is it my mistake, do i need to check anything else?

2. I noticed that the replaceContent functionallity returns a leading space that causes the xml to break with "junk after document element".
I'm trying to implement it on a really basic example and it returns the following(i placed the [return value starts here] to point the space on the start of the document):

Code:
[return value starts here] &lt;?xml version="1.0" encoding="ISO-8859-1"?&gt;

<taconite>

<eval>&lt;![CDATA[jQuery.fn.decode=function(){

                return this.each(

                  function(){

                      var element = jQuery(this);

                      var html = element.html();

                      element.html(html.replace(/&amp;/g,'&')

                                        .replace(/</g,'<')

                                        .replace(/>/g,'>')

                                        .replace(/~raquo;/g,'&raquo;')

                                        );

                    });

              };]]></eval>

<replaceContent select="div#test_div">10:45:19

</replaceContent>

<decode select="div#test_div" />

</taconite>[return value ends here]

Notice the space before <?xml version="1.0" encoding="ISO-8859-1"?>

Any advice?
Thanks in advance

Taco Class - The power of jQuery all wrapped up in a Codeigniter Library - El Forum - 11-20-2009

[eluser]stathis[/eluser]
Hi,
Thanks for your previous help.
I have another question and sincerely hope to make it work and stop bugging you!

I noticed that when taco works for the first time and returns the results it does not fire any events afterwards.
I'm using the $("td a").click(function(){....}) you provided in #13 post.

On that post i see that you mention:

[quote author="thinkigniter" date="1256703677"]
..As to the return action...
If you have taconite loaded on your html/view file and the controller generates TACO/XML
then the html/view will automaticly recognise the taco commands you sent and action them.
[/quote]

I'm not sure if it has something to do with and i'm missing something.

Once again,

Many thanks

Taco Class - The power of jQuery all wrapped up in a Codeigniter Library - El Forum - 11-22-2009

[eluser]thinkigniter[/eluser]
Try using the jquery "Live" function
From Jquery docs
"Binds a handler to an event (like click) for all current - and future - matched element. Can also bind custom events."

Code:
$("td a").live("click", function(){

        var base_url = "http://localhost/";

        var link_id = $(this).attr('id');

        var link_action = $(this).html();

        var image_value = $("#image_id_"+link_id.substring(link_id.length-1)).val();

        $.post( base_url +"index.php/mycontroller/mytacofunction/", { id: link_id ,image_name: image_value, action: link_action } );

    });