2016-07-13 4 views
2

Задача Моя кнопка отправки не работает по какой-либо причине. У меня есть несколько console.log, но я не получаю от них отзывов, не уверен, что не так. Я не получаю ошибок в браузере. Вот codepen пример: http://codepen.io/coryk/pen/kXxzXv?editors=1111Кнопка отправки не работает

HTML

<div class="top-content"> 
     <div class="inner-bg"> 
      <div class="container"> 
       <div class="row"> 
        <!-- Header Text  --> 
        <div class="col-sm-10 text"> 
         <h1><strong>SAGA</strong> Data Form</h1> 
        </div> 
       </div> 
       <div class="row"> 
        <div class="col-sm-6 form-box"> 
         <div class="form-top"> 
          <div class="form-top-left"> 
           <h3>Enter Data Below</h3> 
           <p>Please Enter Data to be converted</p> 
          </div> 
          <div class="form-top-right"> 
           <i class="fa fa-rocket"></i> 
          </div> 
         </div> 
         <div class="form-bottom"> 
          <form action="" class="login-form" method="post" role="form"> 
           <div class="form-group"> 
            <form id="add_name" name="add_name"> 
             <div class="table-responsive"> 
              <table class="table table-bordered" id="dynamic_field"> 
               <!-- Form Titles  --> 
               <tr> 
                <td> 
                 <p style="text-align: center;"><strong>Select Unit Conversion</strong></p> 
                </td> 
                <td> 
                 <p style="text-align: center;"><strong>Enter Unit</strong></p> 
                </td> 
                <td> 
                 <p style="text-align: center;"><strong>Enter Percent Finer</strong></p> 
                </td> 
               </tr><!-- Form Elements  --> 
               <tr> 
                <td><select class="unit selectpicker show-tick form-control" data-live-search="true" id="basic"> 
                 <option value="mm"> 
                  Millimeters 
                 </option> 
                 <option value="micron"> 
                  Micron 
                 </option> 
                 <option value="phi"> 
                  Phi 
                 </option> 
                 <option value="inches"> 
                  Inches 
                 </option> 
                 <option value="Mesh"> 
                  Mesh Size 
                 </option> 
                </select></td> 
                <td><input class="form-control name_list" id="unitVal" name="name[]" placeholder="Enter Unit Here" type="text" value="75000"></td> 
                <td><input class="form-control name_list" id="percent" name="name[]" placeholder="Enter Percent Finer Here" type="text" value="100"></td> 
                <td><button class="btn btn-success" id="add" name="add" type="button">Add More</button></td> 
               </tr> 
              </table> 
             </div> 
            </form> 
           </div><button class="btn" id="sub" type="submit">Submit</button> 
          </form> 
         </div> 
        </div> 
       </div> 
      </div> 
     </div> 

JavaScript

$(document).ready(function(){ 
    // 
     var micronConv, val, incheConv, meshCov; 
     var percentFiner = parseInt($("#percent").val()); 

    $('#sub').click(function(){ 
       var unitValue = parseInt($("#unitVal").val()); 
       var selectedOption = $('.unit option:selected').text(); 
          if(selectedOption === "micron"){ 
             if (unitValue === 0 || null){ 
              unitValue = null; 
             }else{ 
              unitValue = unitValue/1000; //convert to mm 
              micronConv = -Math.log2(unitValue); //convert to Phi 
               console.log(micronConv,percentFiner); 
             } 
        } else if (selectedOption === "inches"){ 
          val = Math.round(unitValue * 25.4); //convert to mm 
          incheConv = -Math.log2(val); //convert to Phi 
              console.log(incheConv,percentFiner); 
        } else if (selectedOption === "Mesh"){ 
           if (unitValue === 2.5){       //convert to mm 
            unitValue = -Math.log2(8.00); //convert to Phi 
           } else if(unitValue === 3){ 
            unitValue = -Math.log2(6.730); 
           } else if(unitValue === 4) { 
            unitValue = -Math.log2(4.760); 
           } else if (unitValue === 5){ 
            unitValue = -Math.log2(4.000); 
           } else if (unitValue === 6){ 
            unitValue = -Math.log2(3.360); 
           } else if (unitValue === 7){ 
            unitValue = -Math.log2(2.830); 
           } else if (unitValue === 8){ 
            unitValue = -Math.log2(2.38); 
           } else if (unitValue === 10){ 
            unitValue = -Math.log2(2.000); 
           } else if (unitValue === 12){ 
            unitValue = -Math.log2(1.680); 
           } else if (unitValue === 14){ 
            unitValue = -Math.log2(1.410); 
           } else if (unitValue === 16){ 
            unitValue = -Math.log2(1.190); 
           } else if (unitValue === 18){ 
            unitValue = -Math.log2(1.000); 
           } else if (unitValue === 20){ 
             unitValue = -Math.log2(0.841); 
           } else if (unitValue == 25){ 
            unitValue = -Math.log2(0.707); 
           } else if (unitValue === 30){ 
            unitValue = -Math.log2(0.595); 
           } else if (unitValue === 35){ 
            unitValue = -Math.log2(0.500); 
           } else if (unitValue === 40){ 
            unitValue = -Math.log2(0.400); 
           } else if (unitValue === 45){ 
            unitValue = -Math.log2(0.354); 
           } else if (unitValue === 50){ 
            unitValue = -Math.log2(0.297); 
           } else if (unitValue === 60){ 
            unitValue= -Math.log2(0.250); 
           } else if (unitValue === 70){ 
            unitValue = -Math.log2(0.210); 
           } else if (unitValue === 80){ 
            unitValue = -Math.log2(0.177); 
           } else if (unitValue === 100){ 
            unitValue = -Math.log2(0.149); 
           } else if (unitValue === 120){ 
            unitValue = -Math.log2(0.125); 
           } else if (unitValue === 140){ 
            unitValue = -Math.log2(0.105); 
           } else if (unitValue === 170){ 
            unitValue = -Math.log2(0.088); 
           } else if (unitValue === 200){ 
            unitValue = -Math.log2(0.074); 
           } else if (unitValue === 230){ 
            unitValue = -Math.log2(0.063); 
           } else if (unitValue === 270){ 
            unitValue = -Math.log2(0.053); 
           } else if (unitValue === 325){ 
            unitValue = -Math.log(0.044); 
           } else if (unitValue === 400){ 
            unitValue = -Math.log2(0.037); 
           } else if(unitValue >= 401) { 
            unitValue = "Not A Valid Size"; 
           } 
           meshCov = unitValue; 
        } 

     }); 
}); 
+2

добавить тэг формы, прежде чем начать HTML и конец HTML –

+2

У вас есть элемент формы? Форма отправляется, а не кнопка. – Teemu

+1

Нет формы для отправки на – Rikin

ответ

1

FINAL КОД:
Поместите <button> в <form>:
EDIT: вы сравниваете выбранный текст «микрона», но на самом деле это «Микрон», так что вы можете либо заменить, что, или использовать регулярные выражения, чтобы игнорировать случаи (/ мкм/я), так что ваш код должен быть:
PS: И поставить кнопку в форме, непосредственно над закрывающим тегом формы: </button></form>
HTML:

<div class="top-content"> 
    <div class="inner-bg"> 
     <div class="container"> 
      <div class="row"> 
           <!-- Header Text  --> 
       <div class="col-sm-10 text"> 
        <h1><strong>SAGA</strong> Data Form</h1> 
       </div> 
           </div> 

      <div class="row"> 
       <div class="col-sm-6 form-box"> 

        <div class="form-top"> 
         <div class="form-top-left"> 
          <h3>Enter Data Below</h3> 
          <p>Please Enter Data to be converted</p> 
         </div> 
         <div class="form-top-right"> 
          <i class="fa fa-rocket"></i> 
         </div> 
        </div> 

        <div class="form-bottom"> 
         <form action="" class="login-form" method="post" role="form"> 
          <div class="form-group"> 
           <form id="add_name" name="add_name"> 
            <div class="table-responsive"> 


             <table class="table table-bordered" id="dynamic_field"> 
                          <!-- Form Titles  --> 
              <tr> 
                              <td><p style="text-align: center;"><strong>Select Unit Conversion</strong></p></td> 
                              <td><p style="text-align: center;"><strong>Enter Unit</strong></p></td> 
                              <td><p style="text-align: center;"><strong>Enter Percent Finer</strong></p></td> 
                          </tr> 
                         <!-- Form Elements  --> 
                          <tr> 
                              <td><select id="basic" class="unit selectpicker show-tick form-control" data-live-search="true"> 
                              <option value="mm">Millimeters</option> 
                              <option value="micron">Micron</option> 
                              <option value="phi">Phi</option> 
                              <option value="inches">Inches</option> 
                              <option value="Mesh">Mesh Size</option> 
                              </select></td> 
                              <td><input id="unitVal" value="75000" class="form-control name_list" name="name[]" placeholder="Enter Unit Here" type="text"></td> 
                              <td><input value="100" id="percent" class="form-control name_list" name="name[]" placeholder="Enter Percent Finer Here" type="text"></td> 
                 <td><button class="btn btn-success" id="add" name="add" type="button">Add More</button></td> 
              </tr> 
             </table> 
            </div><button id="sub" class="btn" type="submit">Submit</button> 
           </form> 
          </div> 
         </form> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

JS:

if(selectedOption === "Micron"){ 
    // DO calc-s 
} else if (selectedOption === "Inches"){ // DO calc-s } 
    else if (selectedOption === "Mech Size"){ // DO calc-s } 

Результат вашего примера с Micron:
enter image description here

+0

Я все еще не получаю никакой console.log, что бы вы сделали, я вчера работал, но я пришел этим утром и он мертв. –

+0

, но он публикуется. –

+0

Но как мне получить обратную связь, чтобы узнать погоду, или нет, мой код вычисляется справа без console.log? –

1

Добавить форму тег form

<form action="" method="post" /> 
<div class="top-content"> 
     <div class="inner-bg"> 
      <div class="container"> 
       <div class="row"> 
        <!-- Header Text  --> 
        <div class="col-sm-10 text"> 
         <h1><strong>SAGA</strong> Data Form</h1> 
        </div> 
       </div> 
       <div class="row"> 
        <div class="col-sm-6 form-box"> 
         <div class="form-top"> 
          <div class="form-top-left"> 
           <h3>Enter Data Below</h3> 
           <p>Please Enter Data to be converted</p> 
          </div> 
          <div class="form-top-right"> 
           <i class="fa fa-rocket"></i> 
          </div> 
         </div> 
         <div class="form-bottom"> 
          <form action="" class="login-form" method="post" role="form"> 
           <div class="form-group"> 
            <form id="add_name" name="add_name"> 
             <div class="table-responsive"> 
              <table class="table table-bordered" id="dynamic_field"> 
               <!-- Form Titles  --> 
               <tr> 
                <td> 
                 <p style="text-align: center;"><strong>Select Unit Conversion</strong></p> 
                </td> 
                <td> 
                 <p style="text-align: center;"><strong>Enter Unit</strong></p> 
                </td> 
                <td> 
                 <p style="text-align: center;"><strong>Enter Percent Finer</strong></p> 
                </td> 
               </tr><!-- Form Elements  --> 
               <tr> 
                <td><select class="unit selectpicker show-tick form-control" data-live-search="true" id="basic"> 
                 <option value="mm"> 
                  Millimeters 


             </option> 
                <option value="micron"> 
                 Micron 
                </option> 
                <option value="phi"> 
                 Phi 
                </option> 
                <option value="inches"> 
                 Inches 
                </option> 
                <option value="Mesh"> 
                 Mesh Size 
                </option> 
               </select></td> 
               <td><input class="form-control name_list" id="unitVal" name="name[]" placeholder="Enter Unit Here" type="text" value="75000"></td> 
               <td><input class="form-control name_list" id="percent" name="name[]" placeholder="Enter Percent Finer Here" type="text" value="100"></td> 
               <td><button class="btn btn-success" id="add" name="add" type="button">Add More</button></td> 
              </tr> 
             </table> 
            </div> 
           </form> 
          </div><button class="btn" id="sub" type="submit">Submit</button> 
         </form> 
        </div> 
       </div> 
      </div> 
     </div> 
    </div> 

Смежные вопросы