Remplir la zone de texte de la liste de cases à cocher en utilisant ASP.NET et AJAX

Question

J'ai un contrôle de zone de texte et un contrôle de liste de cases à cocher sur ma page.

Je commence par remplir ma liste de cases à cocher avec une liste d'objets employés dans le code-behind. Un employé a un identifiant et un nom. Les deux sont affichés dans la liste des cases à cocher comme ceci:

• Jim (1)
• Alex (2)
• Gary (3)

Lorsqu'un utilisateur vérifie l'une des cases, la Le nom de l'employé doit être rempli dans la zone de texte. Donc, si Jim est sélectionné, la valeur de la zone de texte est "Jim". Il doit également prendre en charge plusieurs valeurs, donc si Jim et Gary sont sélectionnés, la valeur de la zone de texte est "Jim, Gary".

De même, si un utilisateur entre une valeur valide dans la zone de texte, l'employé correct doit être vérifié. Cela doit prendre en charge les noms et les ID. Donc, si je tape "1, Alex" dans la zone de texte, puis cliquez en dehors de la zone de texte, Jim et Alex doivent être sélectionnés. J'utilise ASP.NET et je dois le faire en utilisant AJAX, mais je n'ai aucune expérience avec jQuery et AJAX. Quelqu'un pourrait-il me montrer un exemple simple de la façon de faire cela?

Answer 1

Voici quelque chose que je pourrais vous aider à démarrer. Ce n'est pas testé et pas complet mais je n'ai pas le temps de le faire tout de suite, alors j'ai pensé que cela pourrait aider. Il doit certainement y avoir beaucoup plus de contrôles et d'ajustements que j'ai laissé de côté pour que vous puissiez les mettre en œuvre.

$(function() { 
    // gets all checkbox items by a common class you will put on all of them 
    $('.checkboxlistclass').click(function(e) { 
     var txt = $(this).text(); 
     var employeeName = txt; // change this to parse out the name part and remove the id 

     var currentTxtVal = $('#textboxid').val(); 
     var newVal = currentTxtVal + ',' + employeeName; // check if you need the comma or not 

     $('#textboxid').val(newVal); 
    }); 

    // textboxid is the id of the textbox 
    $('#textboxid').change(function(e) { 
     var textboxVal = $(this).val(); 

     // split on the comma and get an array of items 
     // this is dummy data 
     var items = []; 
     items.push('Jim'); 
     items.push(2); 

     // go through all the items and check if it's a number or not 
     // if it's a number do a selection based on the id in parenthesis 
     // if not then check first part for name match 
     for (var i=0; i < items.length; i++) { 
      if (isNaN(parseInt(items[i])) { 
       $(".checkboxlistclass:contains('" + items[i] + " ('").attr('checked', true); 
      } 
      else { 
       $(".checkboxlistclass:contains(' (" + items[i] + ")'").attr('checked', true); 
      } 
     } 
    }); 
});