Estoy creando una aplicación web de comercio electrónico En el frontend estoy usando una plantilla y en el backend estoy usando Laravel 8, necesito publicar los datos de AddToCart con ajax, pero cuando hago clic en el botón AddToCar aparece un error
'TypeError no detectado: a.getElementsByClassName no es una función'
My button <button type="submit" class="btn btn-primary mb-2" onclick="addToCart">Add to Cart</button> Ajax code //Start Add to Cart Product function addToCart(){ var product_name = $('#pname').text(); var id =$('#product_id').val(); var color = $('#color option:selected').text(); var size = $('#size option:selected').text(); var quantity =$('#qty').val(); $.ajax({ type:"POST", datatype:'json', data:{ color:color, size:size, quantity:quantity, product_name:product_name, }, url:"/cart/data/store/"+id, success:function(data){ console.log(data); } }) } My controller public function AddToCart(Request $request, $id){ $product = Product::findOrFail($id); if ($product->discount_price == NULL) { Cart::add([ 'id' => $id, 'name' => $request->product_name, 'qty' => $request->quantity, 'price' => $request->selling_price, 'weight' => 1, 'options' => [ 'image' => $request->product_thambnail, 'color' => $request->color, 'size' => $request->size, ], ]); return response()->json('Successfuly Added on Your Cart'); }else{ Cart::add([ 'id' => $id, 'name' => $request->product_name, 'qty' => $request->quantity, 'price' => $request->discount_price, 'weight' => 1, 'options' => [ 'image' => $request->product_thambnail, 'color' => $request->color, 'size' => $request->size, ], ]); return response()->json('Successfuly Added on Your Cart'); } }En primer lugar, hay algunas cosas que podemos mejorar en la función, como usar const en lugar de var y no definir dos veces la variable en el objeto, ya que tienen el mismo nombre.
function addToCart() { const id = $('#product_id').val(); const product_name = $('#pname').text(); const color = $('#color option:selected').text(); const size = $('#size option:selected').text(); const quantity = $('#qty').val(); $.ajax({ type:"POST", datatype:'json', data: { color, size, quantity, product_name, }, url: `"/cart/data/store/"${id}`, success: console.log }); } De todos modos, su principal problema es un error que no está relacionado o no es visible en su código, ya que está utilizando una biblioteca/marco (en este caso, parece jquery). Debe verificar el seguimiento de la stacktrace para ver qué parte de SU código está provocando el error. Tal vez ni siquiera esté en estos fragmentos que estás compartiendo aquí.