2010-08-02 59 views
0

我的頁面上有一個文本框控件和一個複選框列表控件。使用ASP.NET和AJAX填充複選框列表中的文本框

我首先使用代碼隱藏中的員工對象列表填充我的複選框列表。員工有一個ID和一個名字。兩者都顯示在複選框列表如下所示:

  • 吉姆(1)
  • 克斯(2)
  • 加里(3)

當用戶檢查箱之一,員工的姓名需要填入文本框中。所以如果選擇了Jim,那麼文本框的值是「Jim」。它還需要支持多個值,所以如果選擇Jim和Gary,則文本框的值是「Jim,Gary」。

此外,如果用戶在文本框中輸入有效值,則應檢查正確的員工。這需要支持名稱和ID。因此,如果我在文本框中輸入「1,Alex」,然後在文本框外單擊,則應選擇Jim和Alex。

我正在使用ASP.NET,我需要使用AJAX來做到這一點,但我沒有使用jQuery和AJAX的經驗。有人能告訴我一個簡單的例子嗎?

回答

2

這是我通過一起,可以幫助你開始。它沒有經過測試,也沒有完成,但我現在沒有時間去做,所以認爲這可能會有所幫助。肯定需要進行更多的檢查和配合工作,我遺漏了您的實施。

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