0

I have a table with a lot of text inputs like these: alt text http://img380.imageshack.us/img380/6697/snapsh.png

(they are marks of tests for a few students).

Every field has an associated icon for adding a comment, so when the icon is clicked, a dialog must be shown with a textarea, and then save its value to a hidden input.

An example of a mark field:

<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>

Each link is identified with studentID_itemID

This is what I coded, but it doesn't work at all.

var opciones = { title: 'Add comment', modal: true, buttons: { OK: function() { $(this).dialog('close'); x = $('#obserText').val(); $('#obser' + id).val(x); } } }; $('.addObs').click(function(){ x = this.id.split('_'); 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 (document.getElementById('obser' + y)) { alert ($('#obser' + y).val()); } //If not... else { //Create it $(this).parent().prepend('<input type="hidden" id="obser' + y + '"/>'); //Show the dialog dialog = $('<div></div>') .html('<textarea id="obserText"></textarea>') .dialog(opciones); }

I don't know how to pass the ID to save the comment into its hidden input.

Thanks in advance and sorry for my english

Improve this question

2 Answers 2

Reset to default
1

test with these 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); } }
Improve this answer
Sign up to request clarification or add additional context in comments.

3 Comments

Thanks for the idea, the variables needed to be global. But the $('#obser_' + id) part doesn't work, however document.getElementbyId works OK... Seems that jQuery doesn't like id's with square brackets
Ok, because the brackets are part of docs.jquery.com/Selectors, now I change it to see if it works
sorry, but in the example I wrote, do not use brackets, so I use the variable "id", so that jQuery will find it good. Then I see it the textarea is created.
0

I think i've got it, id's with brackets is a bad idea. And I have renamed properly x and 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); } });

But now editing the comment doesn't work

Improve this answer

Comments

Start asking to get answers

Find the answer to your question by asking.

Ask question

Explore related questions

See similar questions with these tags.