Change other fields based on previous - https://www.gridphp.com

invoice.php

<?php  
/** 
 * PHP Grid Component 
 * 
 * @author Abu Ghufran <gridphp@gmail.com> - http://www.phpgrid.org 
 * @version 2.0.0 
 * @license: see license.txt included in package 
 */ 

// include db config 
include_once("../../config.php"); 

// include and create object 
include(PHPGRID_LIBPATH."inc/jqgrid_dist.php"); 

// Database config file to be passed in phpgrid constructor 
$db_conf = array(      
                    "type"         => PHPGRID_DBTYPE,  
                    "server"       => PHPGRID_DBHOST, 
                    "user"         => PHPGRID_DBUSER, 
                    "password"     => PHPGRID_DBPASS, 
                    "database"     => PHPGRID_DBNAME2
                ); 

$g = new jqgrid($db_conf); 

if ($_GET["newoption"] == 1)
{
	$t = $_GET["txt"];
	$id = $g->execute_query("INSERT INTO 0_part (part) VALUE (?)",array($t),"insert_id");
	die(json_encode(array("id"=>$id)));
}

$grid["caption"] = "Invoice"; // caption of grid 
$grid["autowidth"] = true; // expand grid to screen width 
$grid["multiselect"] = false; // allow you to multi-select through checkboxes 
$grid["footerrow"] = true;
$grid["reloadedit"] = true;

$grid["loadComplete"] = "grid_onload";
$g->set_options($grid); 

// this db table will be used for add,edit,delete 
$g->table = "0_invoice"; 

$g->set_actions(array(     
                        "add"=>true, // allow/disallow add 
                        "edit"=>true, // allow/disallow edit 
                        "delete"=>false, // allow/disallow delete 
                        "rowactions"=>true, // show/hide row wise edit/del/save option 
                        "autofilter" => true, // show/hide autofilter for search 
                    )  
                ); 


$col = array(); 
$col["title"] = "Id"; 
$col["name"] = "id";  
$col["width"] = "10"; 
$col["editable"] = false; 
$col["hidden"] = true; 
$cols[] = $col;     

$col = array(); 
$col["title"] = "Date"; 
$col["name"] = "in_date"; 
$col["width"] = "60"; 
$col["editable"] = true; // this column is editable 
$col["editoptions"] = array("size"=>20, "defaultValue"=> date("Y-m-d") ); // with default display of textbox with size 20 
$col["editrules"] = array("required"=>true); // required:true(false), number:true(false), minValue:val, maxValue:val 
$col["formatter"] = "date"; // format as date 
$cols[] = $col;     

$col = array(); 
$col["title"] = "Item"; 
$col["name"] = "in_item";  
$col["editable"] = true; 
$col["width"] = "80"; 
$col["edittype"] = "select"; // render as select 
# fetch data from database, with alias k for key, v for value 
$str = $g->get_dropdown_values("select distinct item as k, item as v from 0_item"); 
$col["editoptions"] = array( 
                            "value"=>":- Select -;".$str, 
                            "onchange" => array(     
                                    "sql"=>"select * from 0_item where item = '{in_item}'", 
                                    "callback" => "fill_form" ) 
                            ); 
                             
$col["editoptions"]["dataInit"] = "function(){ setTimeout(function(){ link_select2('in_item'); },200); }"; 
                             
$col["stype"] = "select"; // enable dropdown search 
$col["searchoptions"] = array("value" => ":;".$str); 
$cols[] = $col;     

$col = array(); 
$col["title"] = "Content"; 
$col["name"] = "in_content";  
$col["editable"] = true; 
$col["width"] = "80"; 
$cols[] = $col; 

$col = array(); 
$col["title"] = "Cnt"; 
$col["name"] = "in_cnt";  
$col["editable"] = true; 
$col["align"] = "right"; 
$col["formatter"] = "integer"; 
$col["width"] = "20"; 
$col["editoptions"]["onkeyup"] = "update_amount();";
$cols[] = $col; 

$col = array(); 
$col["title"] = "Cost"; 
$col["name"] = "in_cost";  
$col["editable"] = true; 
$col["align"] = "right"; 
$col["formatter"] = "integer"; 
$col["width"] = "40"; 
$col["editoptions"]["onkeyup"] = "update_amount();";
$cols[] = $col; 

$col = array(); 
$col["title"] = "Amt"; 
$col["name"] = "in_amt";  
$col["width"] = "40"; 
$col["align"] = "right"; 
$col["formatter"] = "integer"; 
$col["editable"] = true; 
$cols[] = $col;     

$col = array(); 
$col["title"] = "Tax"; 
$col["name"] = "in_tax";  
$col["editable"] = true; 
$col["width"] = "40"; 
$col["align"] = "right"; 
$col["formatter"] = "integer"; 
$col["editoptions"]["onkeyup"] = "update_amount();";
$cols[] = $col;     

$col = array(); 
$col["title"] = "Total"; 
$col["name"] = "in_tot";  
$col["editable"] = true; 
$col["align"] = "right"; 
$col["formatter"] = "integer"; 
$col["width"] = "40"; 
$col["editoptions"] = array("readonly"=>"readonly", "style"=>"border:0");
$cols[] = $col;     

$col = array(); 
$col["title"] = "Part"; 
$col["name"] = "in_part"; 
$col["width"] = "40"; 
$col["align"] = "left"; 
$col["search"] = true; 
$col["editable"] = true; 
$col["edittype"] = "select"; // render as select 
# fetch data from database, with alias k for key, v for value 
$str = $g->get_dropdown_values("select distinct id as k, part as v from 0_part"); 
$col["editoptions"] = array("value"=>":;".$str);  
$col["editrules"] = array("required"=>true); 
$col["formatter"] = "select"; // display label, not value 
                   
$col["editoptions"]["dataInit"] = "function(){ setTimeout(function(){ link_select2_tags('in_part'); },200); }"; 
$col["editoptions"]["onload"]["sql"] = "select distinct id as k, part as v from 0_part"; 
		  
$col["stype"] = "select";  
$col["searchoptions"] = array("value"=>":;".$str);  

$cols[] = $col; 
         
$g->set_columns($cols); 
                 
// generate grid output, with unique grid name as 'list1' 
$out = $g->render("list1"); 
?> 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> 
<html> 
<head> 
    <link rel="stylesheet" type="text/css" media="screen" href="../../lib/js/themes/redmond/jquery-ui.custom.css"></link>     
    <link rel="stylesheet" type="text/css" media="screen" href="../../lib/js/jqgrid/css/ui.jqgrid.css"></link>     
     
    <script src="../../lib/js/jquery.min.js" type="text/javascript"></script> 
    <script src="../../lib/js/jqgrid/js/i18n/grid.locale-en.js" type="text/javascript"></script> 
    <script src="../../lib/js/jqgrid/js/jquery.jqGrid.min.js" type="text/javascript"></script>     
    <script src="../../lib/js/themes/jquery-ui.custom.min.js" type="text/javascript"></script> 

    <link href="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/css/select2.min.css" rel="stylesheet" /> 
    <script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.3/js/select2.min.js"></script> 

</head> 
<body> 
    <div style="margin:10px"> 
    <?php echo $out?> 
    </div> 
     
    <script> 
	jQuery(document).ready(function(){
		// button to toogle autofilter
		jQuery("#list1").jqGrid('navButtonAdd',"#list1_pager",{caption:"Autofilter",title:"Toggle Search Toolbar", buttonicon :'ui-icon-pin-s',
			'onClickButton':function(){
				jQuery("#list1")[0].toggleToolbar();
			}
		});
	});
		
	function grid_onload() 
	{
		var grid = $("#list1");

		// sum of displayed result
		in_cost = grid.jqGrid('getCol', 'in_cost', false, 'sum'); // 'sum, 'avg', 'count' (use count-1 as it count footer row).
		in_amt = grid.jqGrid('getCol', 'in_amt', false, 'sum'); // 'sum, 'avg', 'count' (use count-1 as it count footer row).
		in_tax = grid.jqGrid('getCol', 'in_tax', false, 'sum'); // 'sum, 'avg', 'count' (use count-1 as it count footer row).
		in_tot = grid.jqGrid('getCol', 'in_tot', false, 'sum'); // 'sum, 'avg', 'count' (use count-1 as it count footer row).

		// 4th arg value of false will disable the using of formatter
		grid.jqGrid('footerData','set', {'in_content':'Total:', 'in_cost': in_cost, 'in_amt': in_amt, 'in_tax': in_tax, 'in_tot': in_tot});
	};
	
    function link_select2(id) 
    { 
        $('select[name='+id+'].editable, select[id='+id+']').select2({onSelect: function(){ jQuery(this).trigger('change'); }}); 
        $(document).unbind('keypress').unbind('keydown'); 
    } 
	
    function link_select2_tags(id) 
    { 
		var sel = 'select[name='+id+'].editable, select[id='+id+']';
        $(sel).select2({tags:true, createTag: function (params) 
												{
													return {
													  id: params.term,
													  text: params.term,
													  newOption: true
													};
													
												}
						}); 
																	
																	
		$(sel).on("select2:select", function(e) { 
			if (e.params.data.newOption)
			{
				if (confirm("This part does not exist. Do you want to create new?"))
				{
					var obj = {};
					obj.url = '';
					obj.data = 'newoption=1&txt='+e.params.data.text
					obj.success = function(o) { var o = JSON.parse(o); $(sel).find("option[value='"+e.params.data.text+"']").val(o.id).trigger('change'); fx_reload_dropdown('in_part','in_part'); }
					$.ajax(obj);
				}
				else
					$(this).val(null).trigger('change');
			}
		});
        
		$(document).unbind('keypress').unbind('keydown'); 
    } 
     
    function fill_form(data) 
    { 
        jQuery("input[name=in_cost].FormElement").val(data[0].cost); 
        jQuery("input[name=in_cost].editable").val(data[0].cost); 
		
		update_amount();
    } 
	
	function update_amount()
	{
        var cnt = parseFloat(jQuery("input[name=in_cnt].FormElement, input[name=in_cnt].editable").val()) || 0; 
        var cost = parseFloat(jQuery("input[name=in_cost].FormElement, input[name=in_cost].editable").val()) || 0; 
		jQuery("input[name=in_amt].FormElement, input[name=in_amt].editable").val( cnt*cost );

        var amt = parseFloat(jQuery("input[name=in_amt].FormElement, input[name=in_amt].editable").val()) || 0; 
        var tax = parseFloat(jQuery("input[name=in_tax].FormElement, input[name=in_tax].editable").val()) || 0; 
		jQuery("input[name=in_tot].FormElement, input[name=in_tot].editable").val( amt+tax );
		
	}
    </script> 
</body> 
</html> 

Ok, after to setup; it's showing issue to connect DB:
Couldn't execute query. Unknown database 'phpgrid_dbname2' - select distinct item as k, item as v from 0_item