i have a problem where the value isn't calculated. I have function where the user able to update Weight/size and quantity(if the input isn't in readonly). When the user enter a new weight/size it will be auto-calculated in the Order Total. Apparently, there is a value already in the Order Total (since it is an update) so i want it to auto update the value in the order total when the user update the new input in weight/size or quantity. pls click this picture

here is my updates.blade.php

<div  >
    <div >
        <div >
        <div >  
                <div  style="padding: 0;margin: 0;">
                <div >
                    <div  >
                    <span >
                    <h3 >Update Order</h3>
                    </span>
                    </div>
                </div>
                </div>
                </div>
                </br>
                <form action="" method="POST" >
                @csrf
                @method('PUT')
                <div >
                    <div >
                        <label for="validationTooltip01">Order ID</label>
                        <input type="text"  wire:model="orderID" value="" readonly>
                    </div>
                    <div >
                        <label for="validationTooltip02">Order Date</label>
                        <input type="text"  wire:model="orderDate" value="" readonly>
                    </div>
                    <div >
                        <label for="validationTooltipUsername">Order Status</label>
                        <input type="text"  wire:model="orderStatus" value="" readonly>
                     </div>
                </div>

                <div >
                    <div >
                        <label  >Customer Phone Number</label>
                        <input type="text" name="" value=""  maxlength="11" wire:model="custPhone"  readonly>
                    </div>
                    <div >
                        <label  >Customer Name</label>
                        <input type="text" name="" value=""  maxlength="11" wire:model="custName"  readonly>
                    </div>

                </div>
                <div >
                @foreach($serviceOrder as $o)
                    <div >
                        <label  >Service {{ $loop->iteration }} </label>
                        <input type="text"  wire:model="serviceOrder.{{ $loop->index }}.serv.serviceName"  readonly>
                       
                    </div>
                    <input type="hidden"  wire:model="serviceOrder.{{ $loop->index }}.serv.servicePrice"  readonly>
                   
                    <div >
                        <label  >Weight/Size</label>
                        <input type="text" name="" value=""  wire:model="serviceOrder.{{ $loop->index }}.weightsize"  >
                    </div>
                    
                    <div > 
                        <label  >Quantity*opt</label>
                            <input type="text" name="" value="" wire:model="serviceOrder.{{ $loop->index }}.quantity"   @if(!$serviceOrder[$loop->index]['quantity']) readonly @endif >
                    </div>
                @endforeach
                </div>
                    
                    <label  >Order Total RM</label>
                    <input type="number" wire:model="orderTotal" value=""  readonly>
                    
                     </br>
                                         
                <div >  
                <div  style="padding: 0;margin: 0;">
                <div >
                    <div  >
                    <span >
                    <a  href="{{ route('orders.indexInProcess') }}"> Back</a>
                    </span>
                    </div>
                    <div >
                    <span >
                        <div >
                            <button type="submit" >Update</button>
                            <button type="reset" >Reset</button>
                        </div>
                    </span>
                    </div>
                </div>
                </div>
                </div>

                 </form>
                </div>
                </div>
                

here is the livewire updates.php

<?php

 namespace App\Http\Livewire;

 use Livewire\Component;
 use App\Customer;
 use App\Service;
 use App\Order;
 use App\ServiceOrder;

 class Updates extends Component
 {
 public $orders;
public $orderID;
public $orderDate;
public $orderStatus;
public $orderTotal;
public $custName;
public $custPhone;
public $serviceName;
public $servicePrice;
public $weightsize;
public $quantity;
public $serviceOrder;


public function mount($order,$so)
{
    //$orders = Order::with('customer')->get();
    //ServiceOrder::with('serv')->where('order_id', $order->id)->get();
    $this->orderID = $order->id;
    $this->orderDate = $order->orderDate;
    $this->orderStatus = $order->orderStatus;
    $this->orderTotal = $order->orderTotal;
    $this->custPhone = $order->customer->custPhone;
    $this->custName = $order->customer->custName;
    $this->serviceOrder = $so->toArray();
    //dd($this->serviceOrder);
    //$so->serviceName,
    //$so->weightsize,
    //$so->quantity 

}

public function render()
{
    //$so = ServiceOrder::with('serv')->where('order_id', $order->id)->get();
    return view('livewire.updates');
}

public function updatedInputs($name)
{
    
    $array = explode('.', $name);
    if ($array[1] == 'serviceName') {
        $this->inputs[$array[0]]['servicePrice'] = $this->services->find($value)->servicePrice;
    }
    try {
        $this->calculateTotal();
    } catch (\Exception $e) {
    }
}

 // perform calculation here.
 public function calculateTotal(){
    $this->orderTotal =  $this->orderTotal;
        foreach ($this->serviceOrder as $item) {
            if($item['quantity'] == ''){
                $item['optQuantity']= 1;
                $this->orderTotal  = ($item['servicePrice'] * $item['weightsize']) * ($item['quantity']);
                
            }else{
                $this->orderTotal  = $item['servicePrice'] * ($item['weightsize']) * ($item['quantity']);
                
            }
               
                //$this->total *=  $item['optQuantity']; // * price;
        }
    }
  }

please help me out here T.T

CodePudding user response：

You can fire event from component (for example) and then register listener in class and call a method for updating total. Check documentation for that.

CodePudding user response：

"Apparently, there is a value already in the Order Total (since it is an update) so i want it to auto update the value in the order total when the user update the new input in weight/size or quantity."

So, the problem is $orderTotal only update once? it doesn't update when user update new input?. Livewire should render everytime there is action or any input.

First of all, i advice u to check what happen when to your function when user update the new input with dd function.

public function calculateTotal(){
    dd('is this func work?');
    $this->orderTotal =  $this->orderTotal;
        foreach ($this->serviceOrder as $item) {
            if($item['quantity'] == ''){
                $item['optQuantity']= 1;
                $this->orderTotal  = ($item['servicePrice'] * $item['weightsize']) * ($item['quantity']);
                
            }else{
                $this->orderTotal  = $item['servicePrice'] * ($item['weightsize']) * ($item['quantity']);
                
            }
               
                //$this->total *=  $item['optQuantity']; // * price;
        }
    }

After you debug your function, maybe you already found the answer you looking for or you can come back and ask me anything. ^^