Preis aus der Datenbank auf klicken Ereignis

Question

Ich bin neu zu verwenden HTML, Javascript, PHP und Smarty.

Ich würde gerne wissen, wie ich meinen Preis anzeigen lassen kann, wenn ein Produkt ausgewählt ist.

Meine Datenbankverbindung funktioniert Ich kann die Produkte anzeigen, aber wenn ich das Produkt wähle ich möchte seinen Preis in einem Formular anzeigen.

.php

<?php 

$new = ['product_id','product_category','product_price','product_quantity','product_about','product_color']; 

//Database connection 
$db = mysqli_connect('xxx','xxx','xxx','xxx') 
or die('Error connecting to MySQL server.'); 

//access Smarty template engine 
require_once('Smarty-3.1.30/libs/Smarty.class.php'); 

$smarty = new Smarty(); 
$smarty->template_dir = 'views'; 
$smarty->compile_dir = 'tmp'; 


//query product page 
$query = "SELECT * FROM cs_shop"; 
mysqli_query($db, $query) or die('Error querying database.'); 

$result = mysqli_query($db, $query); 


//query an array of products 
$rows = array(); 

//loop start 
while ($row = mysqli_fetch_array($result)) { 
    $rows[] = array(
     'product_id' => $row['product_id'], 
     'product_category' => $row['product_category'], 
     'product_price' => $row['product_price'], 
     'product_quantity' => $row['product_quantity'], 
     'product_about' => $row['product_about'], 
     'product_color' => $row['product_color'] 
    ); 
} 

//db collect data 
$smarty->assign('row', $rows); 
//template 
$smarty->display('index.tpl'); 

mysqli_close($db); 

?> 

Js

<script> 

$(document).ready(function() { 
    //your code here 
    $(function() { 
     $('#products').change(function() { 
     $('#priceInput').val($('#products option:selected').data('data-price')); 
    }); 
}); 

}); 

</script> 

.tpl

<select name="productID" id="products"> 

    {foreach from=$row item="item"} 

     <option value="$item['product_category']" data-price="$item['product_price']" >{$item['product_category'] } : {$item['product_price'] }</option> 

    {/foreach} 

</select> 



<form>  
    Price : <input value="" name="Price" type="text" id="priceInput" disabled="disabled">  
    </form> 

Ich mag würde wissen, was ich bin fehlt Hier? Vielen Dank im Voraus

Answer 1

$(document).ready(function() { 
     $('#products').change(function() { 
     $('#priceInput').val($('#products option:selected').data('price')); 
    }); 
}); 

Answer 2

Becuase verwendet i i-Funktion auf meinem Java-Script .data zweimal die Daten zu lesen, und das war mein Fehler .. so das Update wie folgt aussieht ->

Js

$(document).ready(function() { 

    $('#products').change(function() { 
     var price = $('#products option:selected').data('price'); 
    $('#priceInput').val(price); 

}); 

}); 

also im Grunde meines Verständnis, wenn es liest ‚Preis‘ in meinem .tpl es als Wert ‚Daten‘ ergänzt, so dass es wie „Daten-Preis“ aussehen würde. Was ich hatte, war "Daten-Daten-Preis".