Quiero desde un botón para llamar a una vista parcial que tiene un modal usando onClick por alguna razón, no está funcionando la función.
¡Déjame saber qué puedo cambiar para que funcione!.
Botón
<a class="btn btn-outline-info mx-2 mx-sm-1" onclick="showModal()" id="nav-btn" ><i class="bi bi-upc-scan"></i></a>Guion
<script> function showModal() { $("#div1").load("/PurchaseOrder/Barcode", function () { $("#livestream_scanner").modal('toggle'); }); } </script>Controlador
public ActionResult Barcode() { return PartialView("~/Views/Barcode/SearchScanner.cshtml"); }Ver con modal
<div class="modal" id="livestream_scanner" role="dialog"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title">Search Barcode Scanner</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body"> <div id="qr-reader" style="width:450px"></div> <div id="qr-reader-results" style="margin-bottom: 25px;"></div> </div> </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal -->Ejemplo:
<div class="modal" id="livestream_scanner" role="dialog"> <div class="modal-dialog" role="document"> <div class="modal-content"> <div class="modal-header"> <h5 class="modal-title">Search Barcode Scanner</h5> <button type="button" class="close" data-dismiss="modal" aria-label="Close"> <span aria-hidden="true">×</span> </button> </div> <div class="modal-body" id="modal-body"> <div id="qr-reader" style="width:450px"></div> <div id="qr-reader-results" style="margin-bottom: 25px;"></div> </div> </div><!-- /.modal-content --> </div><!-- /.modal-dialog --> </div><!-- /.modal -->Entonces funcion
function showModal() { $.ajax({ url: "/PurchaseOrder/Barcode", dataType: 'html', beforeSend: function () { }, success: function (data) { $('#modal-body').html(data); $('#livestream_scanner').modal('show'); } }); }