1. ホーム
  2. 質問と答え
  3. 2つの関連する入力フィールドの自動変更？

2つの関連する入力フィールドの自動変更？

2016-08-10 19 views
1

私のウェブサイトの既存のフォームを変更したいです。私の管理パネル（画像参照）で、限られた期間、私の記事のいくつかに割引価格を導入することができます。テーブルのデータは、mysqlデータベースを介して入力されます。私はオープンソースのeコマースソフトウェアOpencartを使用しています。2つの関連する入力フィールドの自動変更？

enter image description here

今それまでは、私が唯一のコラム「prijs」で税抜きの価格をもたらす可能性があります。今私は追加の列 "Pricevatinc"を追加しました。目標は、「Pricevatinc」列に税金を含む価格を導入することもできるということです。 「プライス」（税なし）と「pricevatinc」（税金）の比率は単純に1.21倍です。

「Pricevatinc」列に100を導入すると、「price」列が82.6446にすぐに変更されるはずです。同様に、 "privs"列を "pricevatinc"列を121に直ちに変更する必要があります。 すべてのデータが入力されたら、 "Bewaren"ボタンをクリックしてすべてのデータをデータベースに保存します。

テンプレートの既存のコードが下記に追加されていますが、私はjavascriptや他の言語で必要な修正を加えるほど熟練していません。あなたは、コードの私の作品を見て、必要な変更を提案するか、正しい方向に私を助けることができる場合、私は非常に満足しているでしょう....

おかげで、 SabKo

スクリプトコード：

case 'specials': ?> 
<div class="table-responsive"> 
    <table class="table table-striped table-bordered table-hover" id="specials"> 
     <thead> 
      <tr> 
       <td class="text-left"><?php echo $entry_customer_group; ?></td> 
       <td class="text-right"><?php echo $entry_priority; ?></td> 
       <td class="text-right"><?php echo $entry_price; ?></td> 
          <td class="text-right"><?php echo $entry_pricevatinc2; ?></td> 
       <td class="text-left"><?php echo $entry_date_start; ?></td> 
       <td class="text-left"><?php echo $entry_date_end; ?></td> 
       <td width="1"></td> 
      </tr> 
     </thead> 
     <tbody> 
      <?php $special_row = 0; ?> 
      <?php foreach ($product_specials as $product_special) { ?> 
      <tr id="special-row<?php echo $special_row; ?>"> 
       <td class="text-left"><select name="product_special[<?php echo $special_row; ?>][customer_group_id]" class="form-control"> 
         <?php foreach ($customer_groups as $customer_group) { ?> 
         <?php if ($customer_group['customer_group_id'] == $product_special['customer_group_id']) { ?> 
         <option value="<?php echo $customer_group['customer_group_id']; ?>" selected="selected"><?php echo $customer_group['name']; ?></option> 
         <?php } else { ?> 
         <option value="<?php echo $customer_group['customer_group_id']; ?>"><?php echo $customer_group['name']; ?></option> 
         <?php } ?> 
         <?php } ?> 
        </select></td> 
       <td class="text-right"><input type="text" name="product_special[<?php echo $special_row; ?>][priority]" value="<?php echo $product_special['priority']; ?>" placeholder="<?php echo $entry_priority; ?>" class="form-control" /></td> 
       <td class="text-right"><input type="text" name="product_special[<?php echo $special_row; ?>][price]" value="<?php echo $product_special['price']; ?>" placeholder="<?php echo $entry_price; ?>" class="form-control" /></td> 
         <td class="text-right"><input type="text" name="product_special[<?php echo $special_row; ?>][pricevatinc]" value="<?php echo $product_special['pricevatinc']; ?>" placeholder="<?php echo $entry_pricevatinc2; ?>" class="form-control" /></td> 
       <td class="text-left" style="width: 20%;"><div class="input-group date"> 
        <input type="text" name="product_special[<?php echo $special_row; ?>][date_start]" value="<?php echo $product_special['date_start']; ?>" placeholder="<?php echo $entry_date_start; ?>" data-date-format="YYYY-MM-DD" class="form-control" /> 
        <span class="input-group-btn"> 
        <button class="btn btn-default" type="button"><i class="fa fa-calendar"></i></button> 
        </span></div></td> 
       <td class="text-left" style="width: 20%;"><div class="input-group date"> 
        <input type="text" name="product_special[<?php echo $special_row; ?>][date_end]" value="<?php echo $product_special['date_end']; ?>" placeholder="<?php echo $entry_date_end; ?>" data-date-format="YYYY-MM-DD" class="form-control" /> 
        <span class="input-group-btn"> 
        <button class="btn btn-default" type="button"><i class="fa fa-calendar"></i></button> 
        </span></div></td> 
       <td class="text-left"><button type="button" onclick="$(this).tooltip('destroy');$('#special-row<?php echo $special_row; ?>').remove();" data-toggle="tooltip" title="<?php echo $button_remove; ?>" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button></td> 
      </tr> 
      <?php $special_row++; ?> 
      <?php } ?> 
     </tbody> 
     <tfoot> 
      <tr> 
       <td colspan="5"></td> 
       <td class="text-left"><button type="button" onclick="addSpecial();" data-toggle="tooltip" title="<?php echo $button_special_add; ?>" class="btn btn-primary"><i class="fa fa-plus-circle"></i></button></td> 
      </tr> 
     </tfoot> 
    </table> 
</div> 
<script type="text/javascript"><!-- 
var special_row = <?php echo $special_row; ?>; 
function addSpecial() { 
    html = '<tr id="special-row' + special_row + '">'; 
    html += ' <td class="text-left"><select name="product_special[' + special_row + '][customer_group_id]" class="form-control">'; 
    <?php foreach ($customer_groups as $customer_group) { ?> 
    html += '  <option value="<?php echo $customer_group['customer_group_id']; ?>"><?php echo addslashes($customer_group['name']); ?></option>'; 
    <?php } ?> 
    html += ' </select></td>'; 
    html += ' <td class="text-right"><input type="text" name="product_special[' + special_row + '][priority]" value="" placeholder="<?php echo $entry_priority; ?>" class="form-control" /></td>'; 
    html += ' <td class="text-right"><input type="text" name="product_special[' + special_row + '][price]" value="" placeholder="<?php echo $entry_price; ?>" class="form-control" /></td>'; 
    html += ' <td class="text-right"><input type="text" name="product_special[' + special_row + '][pricevatinc]" value="" placeholder="<?php echo $entry_pricevatinc2; ?>" class="form-control" /></td>'; 
    html += ' <td class="text-left" style="width: 20%;"><div class="input-group date"><input type="text" name="product_special[' + special_row + '][date_start]" value="" placeholder="<?php echo $entry_date_start; ?>" data-date-format="YYYY-MM-DD" class="form-control" /><span class="input-group-btn"><button type="button" class="btn btn-default"><i class="fa fa-calendar"></i></button></span></div></td>'; 
    html += ' <td class="text-left" style="width: 20%;"><div class="input-group date"><input type="text" name="product_special[' + special_row + '][date_end]" value="" placeholder="<?php echo $entry_date_end; ?>" data-date-format="YYYY-MM-DD" class="form-control" /><span class="input-group-btn"><button type="button" class="btn btn-default"><i class="fa fa-calendar"></i></button></span></div></td>'; 
    html += ' <td class="text-left"><button type="button" onclick="$(\'#special-row' + special_row + '\').remove();" data-toggle="tooltip" title="<?php echo $button_remove; ?>" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button></td>'; 
    html += '</tr>'; 
    $('#specials tbody').append(html); 
    $('#special-row' + special_row + ' .date').datetimepicker({pickTime: false }); 
    $('#special-row' + special_row + ' [data-toggle=\'tooltip\']').tooltip({container: 'body'}); 
    special_row++; 
} 
$('#specials tbody .date').datetimepicker({pickTime: false}); 
//--></script>

残念ながら、私のサイトでPoletaew（回答に表示されている）が提供している解決策が正しく機能していません。私は、私のウェブサイトのヘッダーに定義されている他のjqueryファイルやjavascriptファイルと競合するかもしれないと思います。または、フォームがポップアップとして表示されているときに、jqueryがアクティブにならないことがありますか？私はヘッダーのjqueryスクリプトへのリンクを置いていますが、スクリプトのすぐ上にあるhtmlテンプレートページにはありますが、何も役立たない。

私は試してみる可能性のある回避策や代替手段はありますか？これは、すでに2夜:-(忙しい私を続け

この私がPoletaewの提案に基づいているコード：

case 'specials': ?> 
<div class="table-responsive"> 
    <table class="table table-striped table-bordered table-hover" id="specials"> 
     <thead> 
      <tr> 
       <td class="text-left"><?php echo $entry_customer_group; ?></td> 
       <td class="text-right"><?php echo $entry_priority; ?></td> 
       <td class="text-right"><?php echo $entry_price; ?></td> 
       <td class="text-right"><?php echo $entry_pricevatinc2; ?></td> 
       <td class="text-left"><?php echo $entry_date_start; ?></td> 
       <td class="text-left"><?php echo $entry_date_end; ?></td> 
       <td width="1"></td> 
      </tr> 
     </thead> 
     <tbody> 
      <?php $special_row = 0; ?> 
      <?php foreach ($product_specials as $product_special) { ?> 
      <tr id="special-row<?php echo $special_row; ?>"> 
       <td class="text-left"><select name="product_special[<?php echo $special_row; ?>][customer_group_id]" class="form-control"> 
         <?php foreach ($customer_groups as $customer_group) { ?> 
         <?php if ($customer_group['customer_group_id'] == $product_special['customer_group_id']) { ?> 
         <option value="<?php echo $customer_group['customer_group_id']; ?>" selected="selected"><?php echo $customer_group['name']; ?></option> 
         <?php } else { ?> 
         <option value="<?php echo $customer_group['customer_group_id']; ?>"><?php echo $customer_group['name']; ?></option> 
         <?php } ?> 
         <?php } ?> 
        </select></td> 
       <td class="text-right"><input type="text" name="product_special[<?php echo $special_row; ?>][priority]" value="<?php echo $product_special['priority']; ?>" placeholder="<?php echo $entry_priority; ?>" class="form-control" /></td> 
       <td class="text-right"><input type="text" name="product_special[<?php echo $special_row; ?>][price]" value="<?php echo $product_special['price']; ?>" placeholder="<?php echo $entry_price; ?>" class="pricevatexc" /></td> 
       <td class="text-right"><input type="text" name="product_special[<?php echo $special_row; ?>][pricevatinc]" value="<?php echo $product_special['pricevatinc']; ?>" placeholder="<?php echo $entry_pricevatinc2; ?>" class="pricevatinc" /></td> 
       <td class="text-left" style="width: 20%;"><div class="input-group date"> 
        <input type="text" name="product_special[<?php echo $special_row; ?>][date_start]" value="<?php echo $product_special['date_start']; ?>" placeholder="<?php echo $entry_date_start; ?>" data-date-format="YYYY-MM-DD" class="form-control" /> 
        <span class="input-group-btn"> 
        <button class="btn btn-default" type="button"><i class="fa fa-calendar"></i></button> 
        </span></div></td> 
       <td class="text-left" style="width: 20%;"><div class="input-group date"> 
        <input type="text" name="product_special[<?php echo $special_row; ?>][date_end]" value="<?php echo $product_special['date_end']; ?>" placeholder="<?php echo $entry_date_end; ?>" data-date-format="YYYY-MM-DD" class="form-control" /> 
        <span class="input-group-btn"> 
        <button class="btn btn-default" type="button"><i class="fa fa-calendar"></i></button> 
        </span></div></td> 
       <td class="text-left"><button type="button" onclick="$(this).tooltip('destroy');$('#special-row<?php echo $special_row; ?>').remove();" data-toggle="tooltip" title="<?php echo $button_remove; ?>" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button></td> 
      </tr> 
      <?php $special_row++; ?> 
      <?php } ?> 
     </tbody> 
     <tfoot> 
      <tr> 
       <td colspan="6"></td> 
       <td class="text-left"><button type="button" onclick="addSpecial();" data-toggle="tooltip" title="<?php echo $button_special_add; ?>" class="btn btn-primary"><i class="fa fa-plus-circle"></i></button></td> 
      </tr> 
     </tfoot> 
    </table> 
</div> 
<script type="text/javascript"><!-- 
var special_row = <?php echo $special_row; ?>; 

function addSpecial() { 
    html = '<tr id="special-row' + special_row + '">'; 
    html += ' <td class="text-left"><select name="product_special[' + special_row + '][customer_group_id]" class="form-control">'; 
    <?php foreach ($customer_groups as $customer_group) { ?> 
    html += '  <option value="<?php echo $customer_group['customer_group_id']; ?>"><?php echo addslashes($customer_group['name']); ?></option>'; 
    <?php } ?> 
    html += ' </select></td>'; 
    html += ' <td class="text-right"><input type="text" name="product_special[' + special_row + '][priority]" value="" placeholder="<?php echo $entry_priority; ?>" class="form-control" /></td>'; 
    html += ' <td class="text-right"><input type="text" name="product_special[' + special_row + '][price]" value="" placeholder="<?php echo $entry_price; ?>" class="form-control pricevatexc" /></td>'; 
    //Loulie 
    html += ' <td class="text-right"><input type="text" name="product_special[' + special_row + '][pricevatinc]" value="" placeholder="<?php echo $entry_pricevatinc2; ?>" class="form-control pricevatinc" /></td>'; 
    //Einde Loulie 
    html += ' <td class="text-left" style="width: 20%;"><div class="input-group date"><input type="text" name="product_special[' + special_row + '][date_start]" value="" placeholder="<?php echo $entry_date_start; ?>" data-date-format="YYYY-MM-DD" class="form-control" /><span class="input-group-btn"><button type="button" class="btn btn-default"><i class="fa fa-calendar"></i></button></span></div></td>'; 
    html += ' <td class="text-left" style="width: 20%;"><div class="input-group date"><input type="text" name="product_special[' + special_row + '][date_end]" value="" placeholder="<?php echo $entry_date_end; ?>" data-date-format="YYYY-MM-DD" class="form-control" /><span class="input-group-btn"><button type="button" class="btn btn-default"><i class="fa fa-calendar"></i></button></span></div></td>'; 
    html += ' <td class="text-left"><button type="button" onclick="$(\'#special-row' + special_row + '\').remove();" data-toggle="tooltip" title="<?php echo $button_remove; ?>" class="btn btn-danger"><i class="fa fa-minus-circle"></i></button></td>'; 
    html += '</tr>'; 

    $('#specials tbody').append(html); 

    $('#special-row' + special_row + ' .date').datetimepicker({pickTime: false }); 

    $('#special-row' + special_row + ' [data-toggle=\'tooltip\']').tooltip({container: 'body'}); 

    special_row++; 
} 
$('#specials tbody .date').datetimepicker({pickTime: false}); 
//--></script> 
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script type="text/javascript"><!-- 
var rate = 1.21; 
$(document).on('keyup', '.pricevatexc', function(){ 
    var val = $(this).val(); 
    $(this).parent().find('.pricevatinc').val(val * rate) 
}) 
$(document).on('keyup', '.pricevatinc', function(){ 
    var val = $(this).val(); 
    $(this).parent().find('.pricevatexc').val(val/rate) 
}) 
//--></script>

出典

2016-08-10 SabKo

+0

あなたはjsfiddleを作り、問題を表示することができますか？ –

+0

こんにちはよ、私はjsfiddleをセットアップしようとしましたが、結果は非常に悪いです（前に使用していないと私のウェブサイトはまだオンラインではないので、 ）。だから私はこの時点では複雑に思えます。とにかく、それは将来の問題のために興味深いかもしれないので、それがどのように機能するかを調べようとします。 Rgeards、SaKko – SabKo

答えて

0

ソリューションがあります：

var rate = 1.21; 
 

 
$(document).on('keyup', '.prijs', function(){ 
 
\t var val = $(this).val(); 
 
    
 
\t $(this).parent().find('.pricevatinc').val(val * rate) 
 
}) 
 

 
$(document).on('keyup', '.pricevatinc', function(){ 
 
\t var val = $(this).val(); 
 
    
 
\t $(this).parent().find('.prijs').val(val/rate) 
 
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
 
<body> 
 
    <p> 
 
     <input class="prijs" value="100"> <input class="pricevatinc" value="121"> 
 
    </p> 
 
    <p> 
 
     <input class="prijs" value="82"> <input class="pricevatinc" value="100"> 
 
    </p> 
 
</body>

https://jsfiddle.net/4h37q7p9/

それ自体を適応させることはできますが、一般的なロジックは明確にする必要があります。

出典

2016-08-10 08:54:25 poletaew

+0

Hello Poletaew、コードスニペットに感謝します。これはまさに私が求めているようです。私は後日、私のウェブサイトでそれを実装しようとするのは辛抱している。それが動作すれば私はあなたに知らせます。ご助力ありがとうございます。よろしく。 SabKo – SabKo

+0

こんにちはPoletaew、私はついにそれを働かせました。私の間違いは、2つの関係する入力が2つの異なる親（tdタグ）に配置され、コードが示唆するように同じ「親」にある必要があるということでした。あなたの貢献に感謝します！ SabKo – SabKo

+0

こんにちは、私はあなたを手伝ってくれる。また、 "tr"（ '$（this））.parents（ 'tr'）'や '$（this）.parent（）。parent（）'）を得​​ることができます。 – poletaew

関連する問題

 関連する問題