2016-12-05 2 views
0

У меня есть этот javascript здесь, который должен показать/скрыть div на основе выбора поля выбора. Когда я пытаюсь вставить его в базу данных, он вставляет только последний вариант (paypal).не удалось сохранить базу данных при использовании функции javascript .change

Например, если я выбираю вариант наличных денег, он будет вставлять пустое поле в базу данных. Хотя, если я выберу Paypal, он вставляет его. То же самое касается остальных вариантов. Вставляется только Paypal.

(я извиняюсь за как мой плохой английский и мой запутанного кода)

$(document).ready(function(){ 
 
    $("#payment").change(function(){ 
 
     $(this).find("option:selected").each(function(){ 
 
      if($(this).attr("value")=="bank"){ 
 
       $(".box1").not(".bank").hide(); 
 
       $(".bank").show(); 
 
      } 
 
      else if($(this).attr("value")=="cash"){ 
 
       $(".box1").not(".cash").hide(); 
 
       $(".cash").show(); 
 
      } 
 
      else if($(this).attr("value")=="cheque"){ 
 
       $(".box1").not(".cheque").hide(); 
 
       $(".cheque").show(); 
 
      } 
 
      else if($(this).attr("value")=="invoice"){ 
 
       $(".box1").not(".invoice").hide(); 
 
       $(".invoice").show(); 
 
      } 
 
      else if($(this).attr("value")=="paypal"){ 
 
       $(".box1").not(".paypal").hide(); 
 
       $(".paypal").show(); 
 
      } 
 
      else{ 
 
       $(".box1").hide(); 
 
      } 
 
     }); 
 
    }).change(); 
 
});
<style type="text/css"> 
 
    .box{ 
 
     display: none; 
 
     } 
 
    .box1{ 
 
     display: none; 
 

 
    } 
 
    .income{ background: #fff; } 
 
    .expense{ background: #fff; } 
 
    .blue{ background: #fff; } 
 
    .cash{ background: #fff; } 
 
    .card{ background: #fff; } 
 
    .cheque{ background: #fff; } 
 
</style>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div class="form-group"> 
 
      <div class="input-group"> 
 
       <span class="input-group-addon"><span class="glyphicon glyphicon-user"></span></span> 
 
       <select id="payment" name="payment_type" class="form-control" required> 
 
       <option value="" disabled selected>Select Payment Type</option> 
 
       <option value="bank">Bank Transfer</option> 
 
       <option value="cash">Cash</option> 
 
       <option value="cheque">Cheque</option> 
 
       <option value="invoice">Invoice</option> 
 
       <option value="paypal">Paypal</option> 
 
       </select> 
 

 
      </div></div> 
 

 
      <div class="form-group bank box1"> 
 
      <div class="input-group"> 
 
       <span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span> 
 
      <input type="text" name="transaction_amount" class="form-control" placeholder="Bank Account" maxlength="40" /> 
 
       </div> 
 
       
 
      </div> 
 

 
      <div class="form-group cash box1"> 
 
      <div class="input-group"> 
 
       <span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span> 
 
      <input type="text" name="transaction_amount" class="form-control" placeholder="Cash Amount" maxlength="40" /> 
 
       </div> 
 
       
 
      </div> 
 

 
      <div class="form-group cheque box1"> 
 
      <div class="input-group"> 
 
       <span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span> 
 
      <input type="text" name="transaction_amount" class="form-control" placeholder="Cheque Reference" maxlength="40" /> 
 
       </div> 
 
       
 
      </div> 
 

 
      <div class="form-group invoice box1"> 
 
      <div class="input-group"> 
 
       <span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span> 
 
      <input type="text" name="transaction_" class="form-control" placeholder="Invoice Number" maxlength="40" /> 
 
       </div> 
 
       
 
      </div>  
 

 
      <div class="form-group paypal box1"> 
 
      <div class="input-group"> 
 
       <span class="input-group-addon"><span class="glyphicon glyphicon-envelope"></span></span> 
 
      <input type="text" name="transaction_amount" class="form-control" placeholder="Paypal Reference" maxlength="40" /> 
 
       </div> 
 
       
 
      </div>  
 

 
     

+1

Кажется, что не существует фактического элемента формы, а всего лишь нескольких входов, поэтому невозможно сказать, что может произойти с вашей методологией подачи. Я хотел бы указать, что значительная часть вашей проблемы, вероятно, связана с тем, что все ваши элементы ввода имеют одинаковое имя. Поскольку атрибут name - это то, как представление формы различает разные элементы, когда оно получает сторону сервера данных, что происходит, все ваши предыдущие данные перезаписываются вашим последним определенным элементом с именем «transaction_amount» – Ryan

+0

Я попытался вставить php в фрагмент, но он не работал, я тоже думал об элементе name .. будет ли массив работать, если я не хочу использовать разные имена? –

+0

Вам нужно использовать разные имена для каждого элемента ввода, или браузер просто перезапишет все. Если вам не нужны пять разных вариантов «transaction_amount», возможно, стоит использовать одно поле ввода, а затем установить переключатель или некоторые из них для типа оплаты? – Ryan

ответ

0

Ваша проблема заключается в том, что все поля ввода называются одинаковыми. Это смущает PHP-скрипт на стороне сервера, потому что имя ввода - это то, как он отличает значения. Возможно, вы захотите попробовать только одно поле ввода для суммы транзакции и указать платеж другим способом.

0

При использовании стиля display: none вы только скрывает вход. Он по-прежнему отправляется на отправку. Paypal является последним, поэтому последнее значение ничего не значит, потому что вы ничего не пишете в скрытом вводе. Вы должны изменить имена входов, которые будут индивидуумами.

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