jquery - plugin - Jeditable: active la edición de X haciendo clic en Y

tabla editable jquery

Question

Estoy tratando de usar Jeditable como una solución de edición en línea.

El comportamiento predeterminado (hacer clic en el elemento para editarlo) funciona bastante bien, pero me gustaría activar un elemento haciendo clic en otro elemento.

Por ejemplo, al hacer clic en a.activateEdit se activará el siguiente div.edit (obviamente se debe hacer usando los selectores de jQuery).

He buscado en documentos Jeditables para esto, pero no he podido encontrar la sintaxis correcta

FYI, la sintaxis Jeditable por defecto es algo así como:

 $(document).ready(function() {
$(''.edit'').editable(''http://www.example.com/save.php'');
});

* Editar: encontró una mejor solución *

Answer 1

Puede colocar este código en la función de clic de otro elemento. ejemplo:

HTML:

<a class="clickme">Click me to edit</a>
<div class="edit">Edit Me!</div>

jQuery:

$(document).ready(function() {
$("a.clickme").click(function(){
$(''.edit'').editable(''http://www.example.com/save.php'');
});
});

Answer 2

El código anterior tampoco es del todo correcto. Activa evento click en TODAS las instancias editables.

Hay muchas maneras de hacerlo y todo depende de tu HTML, pero por ejemplo si tienes el siguiente HTML:

<div class="edit" id="unique_id">Editable text</div>
<a href="#" class="edit_trigger">Edit me!!</a>

Entonces puedes usar el siguiente JavaScript:

/* Bind Jeditable instances to "edit" event. */
$(".edit").editable("http://www.example.com/save.php", {
event : "edit"
});
/* Find and trigger "edit" event on correct Jeditable instance. */
$(".edit_trigger").bind("click", function() {
$(this).prev().trigger("edit");
}); 

Answer 3

Combiné los poderes de las dos respuestas anteriores para apuntar al siguiente elemento editable de la siguiente manera:

/* Find and trigger "edit" event on next Jeditable instance. */ $(".edit_trigger").livequery( ''click'', function() { $(this).next().click(); });

Answer 4

Ok, la respuesta de Ata no funcionó, pero me puso en el camino correcto:

$(document).ready(function() {
$(''.edit'').editable(''http://www.example.com/save.php'');
$("a.clickme").click(function(){
$(''.edit'').click();
});
});