Заполните текстовое поле из списка флажков, используя ASP.NET и AJAX

Question

У меня есть элемент управления текстовым полем и список списков флажков на моей странице.

Сначала я заполняю свой список флажков списком объектов сотрудников в выделенном фрагменте кода.У сотрудника есть идентификатор и имя.Оба отображаются в списке флажков следующим образом:

• Джим (1)
• Алекс (2)
• Гэри (3)

Когда пользователь устанавливает флажок, имя сотрудника должно быть заполнено в текстовом поле.Поэтому, если выбран Jim, значением текстового поля будет «Jim».Он также должен поддерживать несколько значений, поэтому, если выбраны Джим и Гари, значением текстового поля будет «Джим, Гари».

Кроме того, если пользователь вводит в текстовое поле допустимое значение, правильный сотрудник должен бытьпроверено.Это должно поддерживать имена и идентификаторы.Поэтому, если я введу «1, Алекс» в текстовое поле, а затем щелкните за пределами текстового поля, следует выбрать Джима и Алекса.

Я использую ASP.NET и мне нужно сделать это с помощью AJAX, ноне имею опыта использования jQuery и AJAX.Может ли кто-нибудь показать мне простой пример того, как это сделать?

Answer 1

Вот кое-что, что я пережил вместе, что может помочь вам начать. Это не проверено и не завершено, но у меня нет времени, чтобы сделать все это прямо сейчас, поэтому подумал, что это может помочь. Определенно должно быть гораздо больше проверок и обработок, которые я оставил для вас.

$(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);
            }
        }
    });
});