เรื่อง form ของ bootstrap css

ถาม-ตอบ แนะนำไอเดียว โค้ดตัวอย่าง แนวทาง วิธีแก้ปัญหา เรื่อง form ของ bootstrap css

เรื่อง form ของ bootstrap css
ทำไมมันไมไ่ด้อ่าค่ะ ข่วยดูมห้น่อยได้ไหมค่ะ ว่าเกิดจาอารัย
<?php
    include("include/connect.php");
    Check_Login(); /* ตรวจสอบสถานะล็อคอิน */
    $sqlTld = "SELECT * FROM tld";
    $resultTld = mysql_query($sqlTld);
    $sqlPack = "SELECT * FROM package";
    $resultPack = mysql_query($sqlPack);
?>
<?
if($_POST["cus_submit"] == 'Add'){
$sqlcus = "insert into customer (FK_pack_id,cus_name,cus_address,cus_company,cus_email,cus_tel,cus_date,cus_domain_name,cus_domain_tld,cus_status) values('".$_POST['FK_pack_id']."','".$_POST['cus_name']."','".$_POST['cus_address']."','".$_POST['cus_company']."','".$_POST['cus_email']."','".$_POST['cus_tel']."','".$_POST['cus_date']."','".$_POST['cus_domain_name']."','".$_POST['cus_domain_tld']."','".$_POST['cus_status']."')";
$resultcus = mysql_query($sqlcus);}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <?php include("content/head.php"); ?>
<link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">  
<!--<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.1/css/bootstrap.min.css"> -->
    <script src="js/jquery-1.11.2.min.js"></script>
<script src="js/jquery-1.8.3.min.js"></script>
<style type="text/css">  
        .form-group{ margin-bottom:0px !important;}  
        .form-control-feedback{top:0px !important;}  
    </style>  
    <script>
        function ChkDomain(){
            $("#ChkDomainMsg").hide();
            if(!$('#ChkDomainName').val()){
                $("#ChkDomainMsg").hide();
            }
            var ChkDomainName = $("#ChkDomainName").val();
            var ChkDomainTld = $("#ChkDomainTld").val();
            $.ajax({
                type: "POST",
                url: "customer_check_domain.php",
                data: "ChkDomainName="+ChkDomainName+"&ChkDomainTld="+ChkDomainTld,
                success: function (dataCheck) {
                    $("#ChkDomainMsg").html(dataCheck).show();
                }
            });
        }
    </script>
</head>
 
<body>
 
    <div id="header">
        <?php include("content/header.php"); ?>
    </div>
    <div id="content">
        <div id="main_menu">
            <?php include("content/main_menu.php"); ?>
        </div>
        <div id="main_form">
            <div class="title_line">
                <p>New Domain</p>
            </div>
            <div class="title_menu">
                <a href="customer.php" class="title_link">Customer</a> > <b>Add Domain</b>
            </div>
            <div class="table">
                <form id="myform1" name="form1" class="form table_form2" action="" method="post">
                    <ul>
<div class="form-group has-feedback">
                        <li>
                            <label class="table_form_name">Date Start<span class="table_form_name_require">*</span></label>
                            <input type="date" name="cus_date" class="form-control css-require table_form_input"> 
<span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                        </li>
</div>
<div class="form-group has-feedback">
                        <li>
                            <label class="table_form_name">Customer Name<span class="table_form_name_require">*</span></label>
                            <input type="text" name="cus_name" class="form-control css-require table_form_input">
<span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                        </li>
</div>
<div class="form-group has-feedback">
                        <li>
                            <label class="table_form_name">Address</label>
                            <textarea name="cus_address" class="form-control css-require table_form_input"></textarea>
<span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                        </li>
</div>
<div class="form-group has-feedback">
                        <li>
                            <label class="table_form_name">Company</label>
                            <input type="text" name="cus_company" class="form-control css-require table_form_input">
<span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                        </li>
</div>
<div class="form-group has-feedback">
                        <li>
                            <label class="table_form_name">E-Mail</label>
                            <input type="text" name="cus_email" class="form-control css-require table_form_input">
<span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                        </li>
</div>
<div class="form-group has-feedback">
                        <li>
                            <label class="table_form_name">Telephone<span class="table_form_name_require">*</span></label>
                            <input type="text" name="cus_tel" class="form-control css-require table_form_input">
<span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                        </li>
</div>
                        <li>
                            <label class="table_form_name">Domain Name<span class="table_form_name_require">*</span></label>
</li>
<li>
                            <input type="text" name="cus_domain_name" class="table_form_input table_form_input2" id="ChkDomainName" onchange="ChkDomain()">
                            <select name="cus_domain_tld" class="table_form_input table_form_input3" id="ChkDomainTld" onchange="ChkDomain()">
                                <?php while($rowTld = mysql_fetch_array($resultTld)){ ?>
                                <option value="<?=$rowTld["tld_name"]?>">.<?=$rowTld["tld_name"]?></option>
                                <?php } ?>
                            </select><span id="ChkDomainMsg" class="table_form_status_domain"></span>
                        </li>
<div class="form-group has-feedback">
                        <li>
                            <label class="table_form_name">Package Name</label>
                            <select name="FK_pack_id" class="form-control css-require table_form_input">
                              <option value="0">-- Select --</option>
                                <?php
                                    while($rowPack = mysql_fetch_array($resultPack)){
                                ?>
                              <option value="<?=$rowPack["pack_id"]?>"><?=$rowPack["pack_name"]?></option>
                                <? } ?>
                            </select> 
                        </li>
</div>
                        <li class="table_form_button2">
                            <input type="submit" name="cus_submit" value="Add" class="table_form_button">
                            <input type="reset" name="cus_reset" value="Reset" class="table_form_button">
                        </li>
                    </ul>
                </form>
            </div>
        </div>
        <div id="footer">
            <?php include("content/footer.php"); ?>
        </div>
</body>
</html>     
 <script type="text/javascript">  
 $(function(){  
       
     var obj_check=$(".css-require");  
     $("#myform1").on("submit",function(){  
         obj_check.each(function(i,k){  
             var status_check=0;  
             if(obj_check.eq(i).find(":radio").length>0 || obj_check.eq(i).find(":checkbox").length>0){  
                 status_check=(obj_check.eq(i).find(":checked").length==0)?0:1;      
             }else{  
                 status_check=($.trim(obj_check.eq(i).val())=="")?0:1;  
             }  
             formCheckStatus($(this),status_check);        
         });  
         if($(this).find(".has-error").length>0){  
              return false;  
         }  
     });  
       
     obj_check.on("change",function(){  
         var status_check=0;  
         if($(this).find(":radio").length>0 || $(this).find(":checkbox").length>0){  
             status_check=($(this).find(":checked").length==0)?0:1;      
         }else{  
             status_check=($.trim($(this).val())=="")?0:1;  
         }  
         formCheckStatus($(this),status_check);         
     });  
       
     var formCheckStatus = function(obj,status){  
         if(status==1){  
             obj.parent(".form-group").removeClass("has-error").addClass("has-success");  
             obj.next(".glyphicon").removeClass("glyphicon-warning-sign").addClass("glyphicon-ok");      
         }else{  
             obj.parent(".form-group").removeClass("has-success").addClass("has-error");  
             obj.next(".glyphicon").removeClass("glyphicon-ok").addClass("glyphicon-warning-sign");        
         }  
     }  
  
 });  
</script>     


Chickenkook 58.11.98.xxx 26-01-2015 14:31:24

คำแนะนำ และการใช้งาน

สมาชิก กรุณา ล็อกอินเข้าระบบ เพื่อตั้งคำถามใหม่ หรือ ตอบคำถาม สมาชิกใหม่ สมัครสมาชิกได้ที่ สมัครสมาชิก


  • ถาม-ตอบ กรุณา ล็อกอินเข้าระบบ
  • เปลี่ยน


    ( หรือ เข้าใช้งานผ่าน Social Login )

 ความคิดเห็นที่ 1
ปัญหาคืออะไรครับ ระบุด้วยครับ จะได้ช่วยถูก บันทึกข้อมูลไม่ได้ หรือ javascript ฟังชั่นไหนไม่ทำงาน ไม่รู้จะเริ่มตรงไหน


wowowow 61.90.11.xxx 26-01-2015 15:34
 ความคิดเห็นที่ 2
ขอโทดค่ะที่บอกไม่ละเอียด พอดีปัญหามันอยู่ตรงที่ว่า เวลากรอกข้อมูลเข้าไปค่ะ ขอบสีของ input ไม่เป็นสีเขียวค่ะ รวมทั้ง icon ด้วยค่ะ ติดปัญหาแค่ตรงนี้เดียวตรงเดียวค่ะ ไม่ทราบว่าเปนที่อะไร


chickenkook 110.168.192.xxx 28-01-2015 09:20
 ความคิดเห็นที่ 3
เป็นแบบตัวอย่างอันนี้เลยค่ะ https://www.ninenik.com/content.php?arti_id=579


chickenkook 110.168.192.xxx 28-01-2015 09:20
 ความคิดเห็นที่ 4
<?php
    include("include/connect.php");
    Check_Login(); /* ตรวจสอบสถานะล็อคอิน */
    $sqlTld = "SELECT * FROM tld";
    $resultTld = mysql_query($sqlTld);
    $sqlPack = "SELECT * FROM package";
    $resultPack = mysql_query($sqlPack);
?>
<?
     if($_POST["cus_submit"] == 'Add'){
          $sqlcus = "insert into customer (FK_pack_id,cus_name,cus_address,cus_company,cus_email,cus_tel,cus_date,cus_domain_name,cus_domain_tld,cus_status) values('".$_POST['FK_pack_id']."','".$_POST['cus_name']."','".$_POST['cus_address']."','".$_POST['cus_company']."','".$_POST['cus_email']."','".$_POST['cus_tel']."','".$_POST['cus_date']."','".$_POST['cus_domain_name']."','".$_POST['cus_domain_tld']."','".$_POST['cus_status']."')";
          $resultcus = mysql_query($sqlcus);
     }
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
      <?php include("content/head.php"); ?>
      <link rel="stylesheet" href="bootstrap/css/bootstrap.min.css">  
      <!-- <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.2/css/bootstrap.min.css"> -->
      <script src="js/jquery-1.11.2.min.js"></script>
      <script src="js/jquery-1.8.3.min.js"></script>
      <style type="text/css">  
         .form-group{ margin-bottom:0px !important;}  
         .form-control-feedback{top:0px !important;}  
      </style>  
     <script>
          function ChkDomain(){
               $("#ChkDomainMsg").hide();
               if(!$('#ChkDomainName').val()){
                    $("#ChkDomainMsg").hide();
               }
               var ChkDomainName = $("#ChkDomainName").val();
               var ChkDomainTld = $("#ChkDomainTld").val();
               $.ajax({
                    type: "POST",
                    url: "customer_check_domain.php",
                    data: "ChkDomainName="+ChkDomainName+"&ChkDomainTld="+ChkDomainTld,
                    success: function (dataCheck) {
                         $("#ChkDomainMsg").html(dataCheck).show();
                    }
               });
          }
     </script>
</head>
 
<body>
 
     <div id="header">
          <?php include("content/header.php"); ?>
     </div>
     <div id="content">
          <div id="main_menu">
               <?php include("content/main_menu.php"); ?>
          </div>
          <div id="main_form">
               <div class="title_line">
                    <p>New Domain</p>
               </div>
               <div class="title_menu">
                    <a href="customer.php" class="title_link">Customer</a> > <b>Add Domain</b>
               </div>
               <div class="table">
                    <form id="myform1" name="form1" class="form table_form2" action="" method="post">
                         <ul>
                              <div class="form-group has-feedback">
                                   <li>
                                        <label class="table_form_name">Date Start<span class="table_form_name_require">*</span></label>
                                        <input type="date" name="cus_date" class="form-control css-require table_form_input"> 
                                        <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                                   </li>
                              </div>
                              <div class="form-group has-feedback">
                                   <li>
                                        <label class="table_form_name">Customer Name<span class="table_form_name_require">*</span></label>
                                        <input type="text" name="cus_name" class="form-control css-require table_form_input">
                                        <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                                   </li>
                              </div>
                              <div class="form-group has-feedback">
                                   <li>
                                        <label class="table_form_name">Address</label>
                                        <textarea name="cus_address" class="form-control css-require table_form_input"></textarea>
                                        <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                                   </li>
                              </div>
                              <div class="form-group has-feedback">
                                   <li>
                                        <label class="table_form_name">Company</label>
                                        <input type="text" name="cus_company" class="form-control css-require table_form_input">
                                        <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                                   </li>
                              </div>
                              <div class="form-group has-feedback">
                                   <li>
                                        <label class="table_form_name">E-Mail</label>
                                        <input type="text" name="cus_email" class="form-control css-require table_form_input">
                                        <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                                   </li>
                              </div>
                              <div class="form-group has-feedback">
                                   <li>
                                        <label class="table_form_name">Telephone<span class="table_form_name_require">*</span></label>
                                        <input type="text" name="cus_tel" class="form-control css-require table_form_input">
                                        <span class="glyphicon form-control-feedback" aria-hidden="true"></span>
                                   </li>
                              </div>
                              <li>
                                   <label class="table_form_name">Domain Name<span class="table_form_name_require">*</span></label>
                              </li>
                              <li>
                                   <input type="text" name="cus_domain_name" class="table_form_input table_form_input2" id="ChkDomainName" onchange="ChkDomain()">
                                   <select name="cus_domain_tld" class="table_form_input table_form_input3" id="ChkDomainTld" onchange="ChkDomain()">
                                        <?php 
                                        while($rowTld = mysql_fetch_array($resultTld)){ 
                                        ?>
                                        <option value="<?=$rowTld["tld_name"]?>">.<?=$rowTld["tld_name"]?></option>
                                        <?php 
                                        }
                                        ?>
                                   </select>
                                   <span id="ChkDomainMsg" class="table_form_status_domain"></span>
                              </li>
                              <div class="form-group has-feedback">
                                   <li>
                                        <label class="table_form_name">Package Name</label>
                                        <select name="FK_pack_id" class="form-control css-require table_form_input">
                                             <option value="0">-- Select --</option>
                                             <?php
                                             while($rowPack = mysql_fetch_array($resultPack)){
                                             ?>
                                             <option value="<?=$rowPack["pack_id"]?>"><?=$rowPack["pack_name"]?></option>
                                             <? 
                                             }
                                             ?>
                                        </select> 
                                   </li>
                              </div>
                              <li class="table_form_button2">
                                   <input type="submit" name="cus_submit" value="Add" class="table_form_button">
                                   <input type="reset" name="cus_reset" value="Reset" class="table_form_button">
                              </li>
                         </ul>
                    </form>
               </div>
          </div>
          <div id="footer">
               <?php include("content/footer.php"); ?>
          </div>
</body>
</html>     
<script type="text/javascript">  
$(function(){         
     var obj_check=$(".css-require");  
     $("#myform1").on("submit",function(){  
          obj_check.each(function(i,k){  
               var status_check=0;  
               if(obj_check.eq(i).find(":radio").length>0 || obj_check.eq(i).find(":checkbox").length>0){  
                    status_check=(obj_check.eq(i).find(":checked").length==0)?0:1;      
               }else{  
                    status_check=($.trim(obj_check.eq(i).val())=="")?0:1;  
               }  
               formCheckStatus($(this),status_check);        
          });  
          if($(this).find(".has-error").length>0){  
               return false;  
          }  
     });  
       
     obj_check.on("change",function(){  
          var status_check=0;  
          if($(this).find(":radio").length>0 || $(this).find(":checkbox").length>0){  
               status_check=($(this).find(":checked").length==0)?0:1;      
          }else{  
               status_check=($.trim($(this).val())=="")?0:1;  
          }  
          formCheckStatus($(this),status_check);         
     });  
       
     var formCheckStatus = function(obj,status){  
              f(status==1){  
               obj.parent(".form-group").removeClass("has-error").addClass("has-success");  
               obj.next(".glyphicon").removeClass("glyphicon-warning-sign").addClass("glyphicon-ok");      
          }else{  
               obj.parent(".form-group").removeClass("has-success").addClass("has-error");  
               obj.next(".glyphicon").removeClass("glyphicon-ok").addClass("glyphicon-warning-sign");        
          }  
     }  
  
});  
</script>     

เดี๋ยวมา


wowowow 61.90.9.xxx 28-01-2015 13:10
 ความคิดเห็นที่ 5
เรียกไฟล์  css  ของ  bootstrap  มาถูกต้องหรือยังครับ
ดู บรรทัดที่ 19 นะครับ เรียกมาถูกต้องแล้วหรือยัง


ส่วน  icon  นี้คือตัวไหนครับ อะไรครับ
ผมเดาว่า คงหมายถึง ปุ้ม Add   กับ  Reset  ไม่มีสี เหมือน ตัวอย่าง

เพิ่มclass="btn btn-primary"  button  ครับ

เพิ่ม </div>
อีก 1 ตัวครับ ปิด ไม่หมด
บรรทัด 146




wowowow 61.90.9.xxx 28-01-2015 13:50
 ความคิดเห็นที่ 6
เรียนกถูกแล้วนะค่ะไฟล์ ส่วน icon นี่คือดึงมาจากเว็บที่แจกค่ะ มาทั้ง font ทั้ง icon ค่ะ ส่วนปุ่มกด อันนี้ทำเองค่ะไม่ได้จะเอาปุ่มเหมือนในตัวอย่างค่ะ แค่จาเอาแบบฟอร์มที่กรอกเท่านั้นค่ะว่า มีการกรอกแล้วหรือไม่


chickenkook 110.168.237.xxx 30-01-2015 09:08
 ความคิดเห็นที่ 7
ผมเอาคโค้ดคุณมารันดู โดย ใส่คอมเม้น บรรทัด 19 แล้ว เอาคอมเม้น บรรทัด 20 ออก
เวลา กรอกข้อมูลเข้าไป ขอบสีของ input จะเป็นสีฟ้านะครับ ผมว่า เป็นที่ css ที่คุณเขียนขึ้นมาไปทับคำสั่ง ของ bootstrap หรือเปล่า ลองไล่ดูครับ

ส่วนคือคือโค้ดที่ทำให้ input ขอบเป็นสี ก็อบมาจาก bootstrap

 <style type="text/css">    
             .form-control:focus {
                  border-color: #66AFE9;
                  outline: 0px none;
                  box-shadow: 0px 1px 1px rgba(0, 0, 0, 0.075) inset, 0px 0px 8px rgba(102, 175, 233, 0.6);
}   
</style>   
ลองไปดู css class ใน input ว่าไปกำหนด border อะไรไว้หรือเปล่า นะครับ



แล้วไอคอน พอดีพึ่งเห็น

<span class="glyphicon form-control-feedback" aria-hidden="true"></span>
ยังไม่ใส่รูปให้มันเลยนิครับ

<span class="glyphicon glyphicon-search"></span>
ถ้าผมเข้าใจไม่ผิดนะครับ

ผมรันแล้วที่เครื่องผม ถ้ากำหนดรูป icon ก็จะขึ้น  ขอบ input ก็ขึ้น ทั้งๆที่แก้บรรรทัด 19 -20 ตามที่บอกนะครับ


wowowow 110.168.255.xxx 30-01-2015 12:52
 ความคิดเห็นที่ 8
แล้วขึ้นเป็นสีมัยค่ะ ทางนี้ก้แก้ตามแล้วค่ะ แต่ผลปรากฎว่า ไอคอนขึ้นค่ะ สีขอบขึ้นเป็นสีฟ้าค่ะ แต่เวลาพิมกรอกข้อมูลไป
จะต้องขึ้นเปนขอบสีเขียวพร้อมไอคอนใช่มัยค่ะ
ทีนี้มันขึ้นค่ะ แต่ไม่ได้เป็นสีเขียวค่ะ เปนสีดำ ตามรูปเลยค่ะ
http://image.ohozaa.com/view2/y8vO3RBwk3SwJxE7


ต้องขอบคุณมากเลยนะค่ะ ที่ช่วยหาคำตอบให้อ่าค่ะ รบกวนด้วยนะค่ะ เพิ่งจะเคยใช้ bootstrap ค่ะ
ส่วน css ที่เขียนขึ้นมาเองค่ะ มีการใช้ border ค่ะ ในของช่อง input ค่ะ
แต่พอมใส่คอมเม้นลงไปค่ะ ก้ไม่ได้ค่ะ ขึ้นแบบเดิมค่ะ

*{ margin:0; padding:0; }
html, body{ margin:0; padding:0; height:100%;background:#fff; }
@font-face {
    font-family:CaviarDreams;
    src:url('../font/CaviarDreams.ttf');
}
@font-face {
    font-family:"Myriad Hebrew";
    src:url('../font/MyriadHebrew-Regular.otf');
}
#effect {
    display: none;
    position: absolute;
    right: 0;
    top: 40px;
    width: 193px;
    background: #EEE;
    border: solid #4f4f4f;
    border-width: 0px 1px 1px 1px;
}
body {
    margin:0px; padding:0px;
    background-color:#FFFFFF;
}
#header{
	width: 100%;
	height: 40px;
	background: #363636;
	float: left;
}
#logo{
	padding: 5px 20px;
	float:left;
	font-family:"CaviarDreams"; 
	font-weight: bold;
	font-size: 24px;
	color: #FFFFFF;
    text-shadow: 0 0 10px #FFF;
}
#login{
	width:195px;
	background:#4f4f4f;
    cursor: pointer;
	float:right;
	/*background: #4f4f4f url("../img/user.png") no-repeat left top;*/
	background-position: 1px 1px;
	color: #FFFFFF;
	line-height: 40px;
    font-size: 16px;
}
.menu_login {
    list-style-type: none;
    font-family: "Myriad Hebrew";
    font-size: 13px;
    color: #4f4f4f;
}
.menu_login li{
    line-height: 24px;
    padding-top: 3px;
}
.menu_login li a{
    text-decoration: none;
    color: #4f4f4f;
}
.menu_login li:hover{
    background-color: #CCC;
}
.menu_login_icon {
    width: 40px;
    text-align: center;
}
.menu_login_icon2 {
    width: 30px;
    text-align: center;
    color: #AAA;
    margin-left: 5px;
}
.menu_login_down {
    float: right;
    margin: 13px 10px;
}
#content{
	width: 100%;
	height: auto;
	background: #FFFFFF;
	float: left;
}
.title_line{
	width: auto;
    height: 60px;
	border-bottom:2px solid #cecece; 
	line-height: 60px;
	font-size: 24px;
	font-family:"Arial Narrow";
	padding: 0 0 0 15px;
}
.title_menu{
	font-family:"Arial Narrow";
	font-size: 11px;
	padding: 5px 0 0 15px;
}
.title_link {
    color: #1e90ff;
    text-decoration: none;
}
#main_menu{
	width: 17%;
	height: 850px;
	background: #464646;
	float: left;
}
ul#menu {
	width:auto;
}
ul#menu li {
	color: #FFFFFF;
	border-bottom: 1px solid #BEBEBE;
    display:block;
	font-size: 14px;
	font-family: "Arial Narrow";
	padding: 10px;
	
}
ul#menu li a{
	color: #FFFFFF;
    text-decoration: none;
}
ul#menu li:hover {
    background-color: #bebebe;
}
.manu_left_icon {
	width: 35px;
    text-align: center;
}
#main_form{
	width: 83%;
	height: 840px;
	background: #FFFFFF;
	float: left;
}
.font_button {
    text-align: center;
}
.table{
    width: 95%;
    margin: 0 auto;
    margin-top: 10px;
}
.table_form {
	width: 100%;
	border: 1px solid #666;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}
.table_form tr:last-child td:last-child {
	-moz-border-radius-bottomright:5px;
	-webkit-border-bottom-right-radius:5px;
	border-bottom-right-radius:5px;
}
.table_form table tr:first-child td:first-child {
	-moz-border-radius-topleft:5px;
	-webkit-border-top-left-radius:5px;
	border-top-left-radius:5px;
}
.table_form table tr:first-child td:last-child {
	-moz-border-radius-topright:5px;
	-webkit-border-top-right-radius:5px;
	border-top-right-radius:5px;
}
.table_form tr:last-child td:first-child{
	-moz-border-radius-bottomleft:5px;
	-webkit-border-bottom-left-radius:5px;
	border-bottom-left-radius:5px;
}
.table_form table{
    border-spacing: 0;
	width: 100%;
	height: 100%;
}

.table_form tr:hover td {
	background-color: #e5e5e5;
}
.table_form tr:nth-child(odd){ background-color:#f5f5f5; }
.table_form tr:nth-child(even) { background-color:#ffffff; }
.table_form td {
	text-align:center;
	padding:4px;
	font-size:12px;
	font-family:Arial;
	color:#222;
}
.table_form tr:first-child td{
    background:-o-linear-gradient(bottom, #cccccc 5%, #999 100%);
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #cccccc), color-stop(1, #999) );
    background:-moz-linear-gradient( center top, #cccccc 5%, #999 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#cccccc", endColorstr="#999");
    background: -o-linear-gradient(top,#cccccc,#999);
    padding:7px;
	border:0px solid #666;
	border-width:0px 0px 1px 0px;
	font-size:12px;
	font-family:Arial;
	font-weight:bold;
	color:#333;
}
.table_form tr:first-child:hover td{
	background:-o-linear-gradient(bottom, #cccccc 5%, #999 100%);
    background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #cccccc), color-stop(1, #999) );
    background:-moz-linear-gradient( center top, #cccccc 5%, #999 100% );
    filter:progid:DXImageTransform.Microsoft.gradient(startColorstr="#cccccc", endColorstr="#999");
    background: -o-linear-gradient(top,#cccccc,#999);
}
.form_view {
    margin: 0 3px 0 10px;
    text-decoration: none;
    color: #999;
}
.form_view:hover {
    color: #00b7ff;
}
.form_edit {
    margin: 0 3px 0 3px;
    text-decoration: none;
    color: #999;
}
.form_edit:hover {
    color: #ff7f00;
}
.form_del {
    margin: 0 3px 0 3px;
    text-decoration: none;
    color: #999;
}
.form_del:hover {
    color: #c00;
}
.form_add2 {
    margin: 0 10px 0 3px;
    text-decoration: none;
    color: #999;
}
.form_add2:hover {
    color: #0c0;
}
.table_page {
    margin: 0 auto;
    width: 225px;
    margin-top: 10px;
}
.page {
    margin: -1px;
    padding: 4px 8px;
    border: solid 1px #999;
    border-radius: 2px;
    background: #e9e9e9;
    font-family: "Myriad Hebrew";
    font-size: 13px;
    text-decoration: none;
    color: #717171;
}

.page:hover {
    background: #eee;
}

.page.active {
    border: solid 1px #0190b7;
    background: #bce3ee;
    color: #0190b7;
}
.page.inactive {
    border: solid 1px #DDD;
    background: #f5f5f5;
    color: #DDD;
}
.table_form .status_true {
    color: #0C3;
    font-weight: bold;
}
.table_form .status_false {
    color: #999;
}
.table_form .status_paid {
    color: #0C3;
    font-weight: bold;
}
.table_form .status_pending {
    color: #999;
}
.table_form .status_cancel {
    color: #C00;
}
.table_form .baht {
    text-align: right;
}
.table_add {
    background: url(../img/add.png);
    width: 80px;
    height: 28px;
    float: right;
    margin: 25px 20px;
}
.table_paid {
    background: url(../img/paid.png);
    width: 80px;
    height: 28px;
    float: right;
    margin: 25px 0 0 0;
}
.table_cancel {
    background: url(../img/cancel.png);
    width: 80px;
    height: 28px;
    float: right;
    margin: 25px 20px 0 10px;
}
.table_form2 ul{
    list-style-type: none;
    width: 335px;
    margin: auto;
}
.table_form_name {
	font-family: "Arial Narrow";
    vertical-align: top;
	font-size: 12px;
    line-height: 30px;
    display: inline-block;
    width: 125px;
}
.table_form_input {
   /* border:1px solid #CCCCCC;
    -webkit-border-radius:3px;
	-moz-border-radius:3px;
	border-radius:3px;*/
    width: 200px;
    height: 25px;
}
.table_form_input2 {
    width: 140px;
}
.table_form_input3 {
    width: auto;
}
.table_form2 textarea{
    height: 75px;
}
.table_form_button {
    background: #363636;
    -webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
    font-family: "Arial Narrow";
	font-size: 12px;
	color: #FFFFFF;
    border: 0;
    width: 70px;
    height: 30px;
    margin: 10px 5px;
}
.table_form_button:hover {
    background: #1e90ff;
}
.table_form_button2 {
    text-align: center;
}
.table_form_name_require {
    font-family: "Myriad Hebrew";
	font-size: 16px;
	color: #D00;
    padding-left: 2px;
}
.table_form_status_domain {
    display: none;
	font-family: "Arial Narrow";
	font-size: 11px;
    margin-left: 130px;
    vertical-align: top;
}
.table_form_status_domain label{
    vertical-align: top;
    color: #0D0;
}
.table_form_detail {
    font-family: "Myriad Hebrew";
	font-size: 13px;
    color: #555;
    list-style-type: none;
    margin-left: 15px;
    line-height: 28px;
    width: 410px;
}
.table_form_detail li{
    border-bottom: 1px dashed #DDD;
}
.table_form_detail li:last-child{
    border-bottom: 0;
}
.table_form_detail b{
    display: inline-block;
    width: 10px;
}
.table_form_detail label{
    font-weight: bold;
    color: #444;
    display: inline-block;
    width: 110px;
}
.table_form_detail_paid {
    font-weight: bold;
    color: #0F0;
}
.table_form_detail_cancel {
    color: #F00;
}

.table_form_title {
    font-family: "Myriad Hebrew";
	font-size: 14px;
    font-weight: bold;
    color: #222;
    border-bottom: 1px solid #666;
    box-shadow: 0 1px 0 #CCC;
    width: 425px;
    margin: 15px 0 5px 0;
}
.table_form_title2 {
    font-family: "Myriad Hebrew";
	font-size: 14px;
    font-weight: bold;
    color: #222;
    width: 425px;
    margin: 15px 0 0 0;
}
#footer{
	width: 100%;
	height: 25px;
	background: #363636;
	float: left;
	font-size: 14px;
	font-family: "Arial Narrow";
	color: #FFFFFF;
	text-align: center;
	padding-top: 8px;
}

ตามนี้เลยค่ะ รบกวนหน่อยนะค่ะ 
ขอบคุณมากค่ะ 
smileysmileysmiley


chickenkook 61.90.53.xxx 03-02-2015 10:38
 ความคิดเห็นที่ 9
เอา li  ออกครับ

  <div class="form-group has-feedback">  
                                       
                                            <label class="table_form_name">Date Start<span class="table_form_name_require">*</span></label>  
                                            <input type="date" name="cus_date" class="form-control css-require table_form_input">   
                                            <span class="glyphicon form-control-feedback" aria-hidden="true"></span>  
                                      
                                  </div>  

ถ้า มี  li js ม่ทำงานนะครับ

 var formCheckStatus = function(obj,status){  
         if(status==1){  
             obj.parent(".form-group").removeClass("has-error").addClass("has-success");  
             obj.next(".glyphicon").removeClass("glyphicon-warning-sign").addClass("glyphicon-ok");      
         }else{  
             obj.parent(".form-group").removeClass("has-success").addClass("has-error");  
             obj.next(".glyphicon").removeClass("glyphicon-ok").addClass("glyphicon-warning-sign");        
         }  
     }  


 มันจะไปเพิ่มคลาส has-success  แต่มันหาไม่เจอ เพราะเราไปเพิ่ม  li 
มี อยู่ 2 วิธี ลบ  li  ออก หรือไม่ ก็ แก้ ที่สคิปนี้  ผมก็ทำไม่เป็น
ลองดูครับ


wowowow 58.11.126.xxx 03-02-2015 14:48
 ความคิดเห็นที่ 10
อ่อ ขอบคุณมากค่ะ : ) จะลองทำดูนะค่ะ


chickenkook 58.11.82.xxx 09-02-2015 09:15
1






เว็บไซต์ของเราให้บริการเนื้อหาบทความสำหรับนักพัฒนา โดยพึ่งพารายได้เล็กน้อยจากการแสดงโฆษณา โปรดสนับสนุนเว็บไซต์ของเราด้วยการปิดการใช้งานตัวปิดกั้นโฆษณา (Disable Ads Blocker) ขอบคุณครับ