Je ne peux pas « return false » pour maintenir .live () de répéter la propagation de code

StackOverflow https://stackoverflow.com/questions/2244502

  •  19-09-2019
  •  | 
  •  

Question

Je veux que ce soit mis en place de sorte que quand un certain corps de texte est cliqué, un champ de saisie de texte apparaît, et l'utilisateur peut entrer des données dans le champ, puis cliquez sur un bouton « Enregistrer » ou « annuler » et soit l'envoyer à la base de données ou réinitialiser la valeur, respectivement. Cependant, en dépit de l'utilisation de « return false », je ne peux pas sembler garder ce code d'activation à plusieurs reprises.

Je l'ai utilisé die () et qui fonctionne, mais je veux aussi pouvoir reinstantiate l'événement click d'origine après que l'utilisateur soit enregistre ou annule, et ne peut pas penser à une façon de faire ce travail. Merci d'avance pour l'aide.

$('td[name]').live("click", function() {
    nameof = $(this).attr("name");
    idof = $(this).attr("id");
    valueof = $(this).html();

    $(this).html('<input type="text" name="' + nameof + '" value="' + valueof + '"><input type="hidden" name="id" value="' + idof + '"><span id="save">save</span> &nbsp <span id="cancel">cancel</span>');

    return false;   
});

Mise à jour:

Voici ce que je suis finalement arrivé avec (comprend toutes les modifier en place code):

$('td[name="grouping"] span, td[name="title"] span').live('click', function() {         
    nameof = $(this).parent().attr("name");
    idof = $(this).parent().attr("id");
    valueof = $(this).html();

    if($("table td>span").children('input').length > 0) {} 
    else {
        if($(this).children().length > 0) {} 
        else {
            $(this).html('<input type="text" name="' + nameof + '" value="' + valueof + '"><input type="hidden" name="id" value="' + idof + '"><input type="hidden" name="originalinput" value="' + valueof + '"><span class="save">save</span> &nbsp; <span class="cancel">cancel</span>');
        }
    }

});

$('.cancel').live('click', function() {         
    $(this).parent().html($(this).siblings('input[name="originalinput"]').attr("value"));
});

$('.save').live('click', function() {

    savevalue = $(this).siblings('input[type="text"]').attr("value");
    saveid = $(this).siblings('input[name="id"]').attr("value");
    savecolumn = $(this).siblings('input[type="text"]').attr("name");

    $.ajax({
       type: "POST",
       url: "../php/adminajax.php",
       data: 'id=' + saveid + '&' + savecolumn + '=' + savevalue
    });

    $(this).parent().html(savevalue);
});

$('#saving').ajaxStart( function() {
    $(this).fadeIn(100);
});

$('#saving').ajaxStop( function() {
    $(this).fadeOut(2000);
});

Je suis sûr qu'il est beaucoup plus malpropre que tout ce que je pourrais avoir téléchargé, mais au moins je connais les bases d'une modification en place maintenant AJAX. Merci pour l'aide, tout.

Était-ce utile?

La solution

On dirait que vous êtes essentiellement essayer de faire une modification en place beaucoup. La question que vous utilisez en est que le clic de l'utilisateur est propagée à travers la zone de texte / enjambe de nouveau à son conteneur parent, ce qui déclenche à nouveau l'événement click. Vous avez besoin de filtrer de sorte qu'il ne dispose que de sélectionner td pas l'entrée au sein de son contenu. Quelque chose le long des lignes de ceci:

$('td[name]:not(td>input)').live(...);

Bien que pas une réponse directe à ce que vous cherchez pourquoi ne pas utiliser un plugin existant comme un trouvé ici ?

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top