Travailler avec plusieurs boîtes de dialogue-ui-jquery

Question

J'ai une table avec beaucoup d'entrées de texte comme celles-ci: alt text http://img380.imageshack.us/img380/6697/snapsh.png

(ils sont des marques de tests pour quelques étudiants).

Chaque champ a une icône associée pour ajouter un commentaire, donc quand l'icône est cliquée, une boîte de dialogue doit être affichée avec une zone de texte, puis enregistrer sa valeur dans une entrée cachée.

Un exemple d'un champ de marque:

<input class="num" type="text" size="2" value="5.69" name="calif[57][6]"/> 
<a id="57_6" class="addObs" title="Add comment" href="#"> 
<img alt="Add" src="http://localhost/xxx/assets/img/comment.png"/> 
</a> 

Chaque lien est identifié avec studentID_itemID

C'est ce que je littérale, mais il ne fonctionne pas du tout. Je ne sais pas comment passer l'identifiant pour enregistrer le commentaire dans son entrée cachée.

Merci à l'avance et désolé pour mon test d'anglais

Answer 1

avec ces modifications:

var opciones = { 
     title: 'Add comment', 
     modal: true, 
     buttons: { 
      OK: function() { 
       $(this).dialog('close'); 
       x = $('#obserText').val(); 
       $('#obser' + id).val(x); 
      } 
     } 
}; 

$('.addObs').click(function(){ 

    var id = this.attr("id"); 
    var x = id.split('_'); 
    var y = '[' + x[0] + '][' + x[1] + ']'; 

    // If the hidden file exists, show its value 
    // It should show the dialog again to allow edit the comment, but I'll leave it until later 
    if ($('#obser_' + id).length>0) 
    { 
    alert($('#obser_' + id).val()); 
    } 
    else //If not... 
    { 
    //Create it 
    $(this).parent().prepend("<input type=\"hidden\" id=\"obser_" + id + "\" />"); 

    //Show the dialog 
    if ($("#obserText").length>0) 
     $("#obserText").remove();  

    var xdialog = $("<div></div>").html("<textarea id=\"obserText\"></textarea>"); 
    xdialog.dialog(opciones); 
    } 
} 

Answer 2

Je pense que je l'ai, id avec crochets est une mauvaise idée. Et je l'ai renommé correctement x et y: D

var raw_id, split_id; 

    var options = { 
     title: 'Add comment', 
     modal: true, 
     buttons: { 
      OK: function() { 
       $(this).dialog('close'); 
       valor = $('#otext' + raw_id).val(); 
       $('#obser' + raw_id).val(valor); 
       //console.log($('#obser' + raw_id).val()); 
       if (valor) 
       { 
        $('a#' + raw_id).find('img').attr('src', base_url + 'assets/img/observacion_on.png'); 
       } 
       else 
       { 
        $('a#' + raw_id).find('img').attr('src', base_url + 'assets/img/observacion.png'); 
       } 

      }, 
      Cancel: function() { 
       $(this).dialog('close'); 
      } 
     } 
    };  

    $('.addObs').click(function(){ 

     raw_id = this.id; 
     split_id = raw_id.split('_'); 
     prep_id = '[' + split_id[0] + '][' + split_id[1] + ']'; 


     if ($('#obser' + raw_id).length > 0) 
     { 
      //console.log($('#obser' + raw_id).val()); 
      var dlg = $('<div></div>').html('<textarea id="otext' + raw_id + '">' + $('#obser' + raw_id).val() + '</textarea>'); 
      dlg.dialog(options); 

     } 
     else 
     { 
      $(this).parent().prepend('<input type="hidden" id="obser' + raw_id + '" name="obser' + prep_id +'" />'); 

      var dlg = $('<div></div>').html('<textarea id="otext' + raw_id + '"></textarea>'); 
      dlg.dialog(options); 
     } 
    }); 

Mais maintenant éditer le commentaire ne fonctionne pas