• 1 رای - 5 میانگین
  • 1
  • 2
  • 3
  • 4
  • 5
ایجاد یک جدول
#1
سلام
دوستان من چه جوری میتونم با javascript و با زدن یه دکمه یه جدول مثلا 3 در 3 درست کنم و داخل یه تگ p قرار بدم
  پاسخ
تشکر شده توسط :
#2
http://www.google.com/search?ie=UTF-8&oe...javascript
همه جوره اش رو داریم ظاهرن
  پاسخ
تشکر شده توسط :
#3
با تشکر از مولانا
من تکه کد زیر رو برای ایجاد یه جدول 5 در 1 نوشتم که داخل هر ردیف یه عنصر form مثلا از نوع text قرار داره . پس از ساخته شده فرم و جدول ،اون ها رو داخل یه divider که idش رو به عنوان آرگومان برای تابع سازنده می فرستیم قرار می گیره .
این کد به خوبی داخل تمام مرورگر ها کار می کنه به جز IE6 می خواستم ببینم مشکل چیه و آیا میشه این کد رو بهینه تر نوشت ؟؟؟؟
کد:
function create_form(div_name){
    var divider=document.getElementById(div_name);
    divider.innerHTML="";
    
    var myform=document.createElement('form');
        myform.setAttribute('method','post');
        myform.setAttribute('action','ahmad.php');
        
    
    var name_input=document.createElement('input');
        name_input.setAttribute('type','text');
        name_input.setAttribute('size','30');
        name_input.setAttribute('value','');
        name_input.setAttribute('class','edit');
        name_input.setAttribute('name','name');
        
        name_input.style.height='14px';
        name_input.style.fontSize='11px';
        name_input.style.border='1px #C9C9C9 solid';
        name_input.style.color='#4B4B4B';
        name_input.style.fontFamily='Tahoma';
        
    var email_input=document.createElement('input');
        email_input.setAttribute('type','text');
        email_input.setAttribute('size','30');
        email_input.setAttribute('value','');
        email_input.setAttribute('class','edit');
        email_input.setAttribute('name','email');
        
        email_input.style.height='14px';
        email_input.style.fontSize='11px';
        email_input.style.border='1px #C9C9C9 solid';
        email_input.style.color='#4B4B4B';
        email_input.style.fontFamily='Tahoma';
        
    var website_input=document.createElement('input');
        website_input.setAttribute('type','text');
        website_input.setAttribute('size','30');
        website_input.setAttribute('value','');
        website_input.setAttribute('class','edit');
        website_input.setAttribute('name','website');
        
        website_input.style.height='14px';
        website_input.style.fontSize='11px';
        website_input.style.border='1px #C9C9C9 solid';
        website_input.style.color='#4B4B4B';
        website_input.style.fontFamily='Tahoma';
        
    var btn=document.createElement('input');
        btn.setAttribute('type','submit');
        btn.setAttribute('value','send');
        btn.setAttribute('name','send_btn');
        btn.style.fontFamily='Tahoma';
        btn.style.fontSize='11px'
        
    var comment_input=document.createElement('textarea');
        comment_input.setAttribute('rows','5');
        comment_input.setAttribute('cols','50');
        comment_input.style.fontFamily='Tahoma';
        comment_input.style.fontSize='11px';


   var my_table=document.createElement('table');
       my_table.setAttribute('border','1');
       my_table.setAttribute('dir','rtl');
       my_table.setAttribute('width','80%');
       my_table.setAttribute('align','center');
  
  
   for (var i=1;i<6;i++){
    var my_tr=document.createElement('tr');
    
          var my_td=document.createElement('td');
          switch(i){
              case 1:
                 my_td.appendChild(name_input);
              break;
              case 2:
                 my_td.appendChild(email_input);
              break;
              case 3:
                 my_td.appendChild(website_input);
              break;
              case 4:
                 my_td.appendChild(comment_input);
              break;
              case 5:
                 my_td.appendChild(btn);
              break;
          }
          
          my_tr.appendChild(my_td);
          
       my_table.appendChild(my_tr);
   }

    myform.appendChild(my_table);
    
    divider.appendChild(myform);
    
}
  پاسخ
تشکر شده توسط : Alimokhlesi
#4
دوستان به مغزتون فشار نیارید خودم فهمیدم
پس از کش و قوس های فراوان متوجه شدم که برای ایجاد جداول دینامیک با javascript باید حتما عناصر thead, tfoot و tbody رو به جدول append کنیم و بعد ردیف ها و ستون ها رو داخل اون ها قرار بدیم . در غیر اینصورت در IE6 کار نمی کنه . برای اطلاعات بیشتر می تونید از صفحه زیر دیدن کنید :
dynamic table in javascript
  پاسخ
تشکر شده توسط : molana


پرش به انجمن:


کاربران در حال بازدید این موضوع: 1 مهمان