1

I have this code

<input type="hidden" value="[{"value":1,"label":"Emmoia Boently"},{"value":6,"label":"John Smith"}]" name="group[users][]" id="users">

<input type="text" value="Emmoia--Boently, John--Smith, " name="autocompleter_group[users][]" id="autocompleter_userss" class="ui-autocomplete-input" autocomplete="off" role="textbox" aria-autocomplete="list" aria-haspopup="true">

Now my problem is the current javascript is adding the values from textbox to the hidden feilds.

But when i delete the text then it don't deletes from the hidden input fields.

So i want to do in jquery that when i start deleting the text in main textbox then the value gets deleted in the hidden input field as well.

just like we do in SO when we delete the tag characters in ask question page

Robin Maben
  • 19,662
  • 16
  • 61
  • 93
Mirage
  • 28,544
  • 56
  • 155
  • 251
  • 1
    Any code? How you add values and trying to remove them? – Viktor S. Sep 13 '12 at 15:57
  • To start, you've got your quotes messed up in the example. Second, why not just re-set the hidden field's value to the current representation of the textbox. This would be much simpler than trying to parse out which value got deleted. – Shmiddty Sep 13 '12 at 15:59
  • i am using jquery autocomplete plugin – Mirage Sep 13 '12 at 16:05

2 Answers2

2
$("#autocompleter_userss").on("keyup", function() {
    $("#users").val($(this).val());
});

Fiddle

Selvaraj M A
  • 3,006
  • 3
  • 27
  • 45
1

UPDATE: Seems like you're looking for a tag editor. See this post for exhaustive links :)

$('input#1').change(function(){
  $('input#hidden').val($(this).val());
});

Additionally, you could try some data-binidng libaries like knockout.js among others.

Community
  • 1
  • 1
Robin Maben
  • 19,662
  • 16
  • 61
  • 93
  • its not that simple. In the hidden box i have the ids and text but in the text box i have only text , which i get via AJAX autocomplete call. I think i some how need to have cross button to delete the values – Mirage Sep 13 '12 at 16:04
  • @volcano: Now I get your question. See my update. Try **[this one](http://textextjs.com/)** and [this one](http://levycarneiro.com/projects/tag-it/example.html) to check if you've found what you were searching :) – Robin Maben Sep 13 '12 at 16:25