alert quantity product in blade view

Send the quantity available along with the rest of the product information then you could just monitor the quantity field and using javascript 'on change' run a test to see if the quantity exceeds the total number of items available and if it does display an alert.

Without knowing which technologies you are using I can't suggest any code; there are probably thousands of ways to achieve this.

i'm using this in blade view

@extends('layouts.app')
@section('content')

<div class="row">
<div class="col-12">
<div class="page-title-box">
<h4 class="page-title">Data Selll</h4>
</div>
</div>
</div> 
<div class="row">
<div class="col-12">
<div class="card-box">
<form method="POST" action="{{url('sell/store')}}" enctype="multipart/form-data">
{{ csrf_field() }} 
<div class="col-sm-12">
<div class="form-row">
<div class="form-group col-md-4">
<label for="inputEmail4" class="col-form-label">Sell Date</label>
<input type="text" class="form-control" placeholder="mm/dd/yyyy"  name="sell_date" id="datepicker">
</div>
<div class="form-group col-md-4">
<label for="inputEmail4" class="col-form-label">Invoice No</label>
<input type="text" class="form-control" id="ref_no" value="{{$ref_no}}" readonly>
<input type="hidden" name="invoice_no" value="{{$ref_no}}" id="invoice_no">
<span id="errMsg" class="text-danger"></span>
</div>
<div class="form-group col-md-4">
<label for="inputEmail4" class="col-form-label">Customer</label>
<select class="form-control selectpicker" name="customer_id"  data-live-search="true" id="cus" required>
<option value="">Select Customer</option>
@foreach($customers as $key=>$value)
<option value="{{$key}}">{{$value}}</option>
@endforeach
</select>
</div>
<div class="form-group col-md-4">
<label for="inputEmail4" class="col-form-label">Product Name</label>
<input class="form-control auto" placeholder="Search Item" id="search" >
<ul class="ui-autocomplete ui-front ui-menu ui-widget ui-widget-content" id="ui-id-2" tabindex="0" style="display: none; top: 70px; left: 10px; width: 500px;">
<li>No Item Found!</li>
</ul>
</div>
</div>
</div>

<div>
<table class="table table-bordered bg-purchase" id="purchaseInvoice">
<tbody>
<tr class="dynamicRows">
<th class="text-center">Name</th>
<th class="text-center">Unit Cost</th>
<th class="text-center">Quantity</th>
<th class="text-center">Sub Total</th>
<th class="text-center">Action</th>
</tr>
<tr class="tableInfo">
<td colspan="4" align="right"><strong>Total</strong></td>
<td align="left" colspan="2"><input type='text'  class="form-control subTotal" id="subTotal" onkeyup="sum();" readonly></td>
</tr>
<tr class="tableInfo"><td colspan="4" align="right"><strong>Paid</strong></td><td align="left" colspan="2"><input type='text'  class="form-control" id = "paidTotal" name="paid" onkeyup="sum();"></td></tr>

<tr class="tableInfo"><td colspan="4" align="right"><strong>Method</strong></td><td align="left" colspan="2">
<select name="method" id="" class="form-control">
<option value="">Select Method</option>
<option value="Cash">Cash</option>
<option value="Cash">Credit</option>
</select>
</td></tr>
<tr class="tableInfo"><td colspan="4" align="right"><strong>Due</strong></td><td align="left" colspan="2"><input type='text'  class="form-control" id = "payment_due"  readonly></td></tr>
</tbody>
</table> 
<div class="box-footer">
<button type="reset" class="btn btn-danger">Cancel</button>
<button type="submit" class="btn btn-info" id='btnSubmit'>Simpan</button>
</div>   
</div>
</form>
</div>
</div>
</div>
<link rel="stylesheet" href="https://code.jquery.com/ui/1.12.1/themes/base/jquery-ui.css" />
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script src="http://code.jquery.com/ui/1.10.3/jquery-ui.js"></script>
<script src="http://ajax.aspnetcdn.com/ajax/jquery.validate/1.11.1/jquery.validate.min.js"></script>
<script type="text/javascript">
function in_array(search, array)
{
for (i = 0; i < array.length; i++)
{
if(array[i] ==search )
{
return true;
}
}
return false;
}

var stack = [];
$(document).keypress(function(e) {
if(e.which == 13) {
e.preventDefault();
return false;
}
});
$( "#search" ).autocomplete({
source: function(request, response) {
$.ajax({
url: '{{url('purchase/item-search')}}',
dataType: "json",
type: "get",
data: {

search: request.term
},
success: function(data){
//Start
if(data.status_no == 1){
$("#val_item").html();
var data = data.items;
$('#ui-id-2').css('display','none');
response( $.map( data, function( item ) {
return {
id: item.id,
code: item.code,
value: item.name,
unit: item.unit,
cost_price: item.cost_price,
sale_price: item.sale_price,
initial_stock: item.initial_stock,
total_stock: item.total_stock
}
}));
}else{
$('.ui-menu-item').remove();
$('.addedLi').remove();
$("#ui-id-1").append($("<li class='addedLi'>").text(data.message));
var searchVal = $("#search").val();
if(searchVal.length > 0){
$("#ui-id-2").css('display','block');
}else{
$("#ui-id-2").css('display','none');
}
}
//end
}
})
},
select: function(event, ui) {
var e = ui.item;
if(e.id) {
if(!in_array(e.id, stack))
{
stack.push(e.id);

var taxAmount = (e.sale_price*1);

var new_row = '<tr class="nr" id="rowid'+e.id+'">'+

'<td>'+ e.value +'<input type="hidden" value=""></td><input type="hidden" name="product_id[]" value="'+e.id+'"></td>'+
'<td><input min="0"  type="text" data-id = "'+e.id+'" id="rate_id_'+e.id+'" value="'+ e.sale_price +'" class="form-control text-center unitprice" name="unit_cost_price[]" ></td>'+
'<td><input class="form-control text-center no_units" data-id="'+e.id+'" data-rate="'+ e.sale_price +'" type="text" id="qty_'+e.id+'" name="quantity[]" value="1" data-tax ="'+e.rate+'">' +
'<td><input class="form-control text-center amount" type="text" id="amount_'+e.id+'" value="'+e.sale_price+'" name="sub_total[]"  readonly></td>'+

'<td class="text-center"><button id="'+e.id+'" class="btn btn-xs btn-danger delete_item"><i class="fa fa-trash"></i></button></td>'+
'</tr>';

$(new_row).insertAfter($('table tr.dynamicRows:last'));


// Calculate subtotal
var subTotal = calculateSubTotal();
$("#subTotal").val(subTotal);



$('.tableInfo').show();

} else {
$('#qty_'+e.id).val( function(i, oldval) {
return ++oldval;
});
var q = $('#qty_'+e.id).val();
var r = $("#rate_id_"+e.id).val();

$('#amount_'+e.id).val( function(i, amount) {
var itemPrice = (q * r);
return itemPrice;
});


// Calculate subTotal
var subTotal = calculateSubTotal();
$("#subTotal").val(subTotal);
// Calculate GrandTotal

}

$(this).val('');
$('#val_item').html('');
return false;
}
},
minLength: 1,
autoFocus: true
});

$(document).ready(function() {
$(window).keydown(function(event){
if(event.keyCode == 13) {
event.preventDefault();
return false;
}
});
});

// price calcualtion with quantity
$(document).ready(function(){
$('.tableInfo').hide();
});


$(document).on('keyup', '.no_units', function(ev){
var id = $(this).attr("data-id");
var qty = parseInt($(this).val());

var rate = $("#rate_id_"+id).val();

var price = calculatePrice(qty,rate);       

$("#amount_"+id).val(price);

// Calculate subTotal
var subTotal = calculateSubTotal();
$("#subTotal").val(subTotal);


});

// calculate amount with unit price
$(document).on('keyup', '.unitprice', function(ev){

var unitprice = parseFloat($(this).val());

var id = $(this).attr("data-id");

var qty = $("#qty_"+id).val();
//console.log(qty);
var rate = $("#rate_id_"+id).val();

var price = calculatePrice(qty,rate);
$("#amount_"+id).val(price); 

// Calculate subTotal
var subTotal = calculateSubTotal();
$("#subTotal").val(subTotal);


});

// Delete item row
$(document).ready(function(e){
$('#purchaseInvoice').on('click', '.delete_item', function() {
var v = $(this).attr("id");
stack = jQuery.grep(stack, function(value) {
return value != v;
});

$(this).closest("tr").remove();


var amountByRow = $('#amount_'+v).val();

var subTotal = calculateSubTotal();
$("#subTotal").html(subTotal);          

});
});



/**
* Calcualte Sub Total 
*@return subTotal
*/
function calculateSubTotal (){
var subTotal = 0;
$('.amount').each(function() {
subTotal += parseInt($(this).val());
});
return subTotal;
}

function calculategrandTotal (){
var grandTotal = 0;
$('.subTotal').each(function() {
grandTotal += parseInt($(this).val());
});
return grandTotal;
}
/**
* Calcualte price
*@return price
*/
function calculatePrice (qty,rate){
var price = (qty*rate);
return price;
}   

// Item not found error
$("#search").on('keyup', function(){
var searchVal = $("#search").val();
if(searchVal.length > 0){
$("#ui-id-2").css('display','block');
}else{
$("#ui-id-2").css('display','none');
}         
});

</script>


@endsection