adding date picker and combo to inline edit fields

adding date picker and combo to inline edit fields

Hi,
I am new at this. So far i have figured out how to incorporate an inline edit feature to my application.
What I need now is when you click on the field to edit it will have a datepicker or combo.
Also a way that it knows its a date field or a combo field.

URL of application: See live here


Here is the code I have for the inline edit 

  1. <script type="text/javascript">

  2. $(document).ready(function(){
  3. $('td.edit').click(function(){

  4. $('.ajax').html($('.ajax input').val());
  5. $('.ajax').removeClass('ajax');

  6. $(this).addClass('ajax');
  7. $(this).html('<input id="editbox" size="'+$(this).text().length+'" type="text" value="' + $(this).text() + '">');

  8. $('#editbox').focus();

  9. }
  10. );

  11. $('td.edit').keydown(function(event){
  12. arr = $(this).attr('class').split( " " );
  13. if(event.which == 13){
  14. $.ajax({
  15. type: "POST",
  16. url:"config.php",
  17. data: "value="+$('.ajax input').val()+"&rownum="+arr[2]+"&field="+arr[1],
  18. success: function(data){
  19. $('.ajax').html($('.ajax input').val());
  20. $('.ajax').removeClass('ajax');
  21. }});
  22. }
  23. }
  24. );

  25. $('#editbox').live('blur',function(){
  26. $('.ajax').html($('.ajax input').val());
  27. $('.ajax').removeClass('ajax');
  28. });
  29. });
  30. </script>
Any help would be appreciated very much.
Chuck