<div id="nuevo_mesa" class="modal fade" tabindex="-1" role="dialog">
    <div class="modal-dialog">
        <div class="modal-content">
            <div class="modal-header">
                <button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
                <h4 class="modal-title">Registrar Mesa</h4>
            </div>
            <div class="modal-body ">
                <form class="form-horizontal" method="post" id="guardar_mesa" name="guardar_mesa">
                    <div id="resultados_mesa"></div>
                    <label>Zona</label>
                    <select name="zon_id" class="form-control name_list input-sm" required >
                         <?php
                            $datos = mysqli_query($con,"SELECT * FROM zonas WHERE zon_id='$zon_id' and empresa='$empresa' and sucursal='$sucursal'") ;
                            $fila = mysqli_fetch_array( $datos );
                            echo '<option value="'.$fila['zon_id'].'">'.$fila['zon_nombre'].'</option>';
                        ?>
                        <?php
                            $datos = mysqli_query($con,"SELECT * FROM zonas WHERE zon_id<>'$zon_id' and empresa='$empresa' and sucursal='$sucursal'") ;
                            while( $fila = mysqli_fetch_array( $datos ) )
                            {
                                echo '<option value="'.$fila['zon_id'].'">'.$fila['zon_nombre'].'</option>';
                            }
                        ?>
                    </select>
                    <div class="">
                        <label>Nombre</label>
                        <input type="text" name="mesa_nombre" id="mesa_nombre" class="form-control" autocomplete="off" value="" required>
                    </div> <!-- /.form-group -->
                    <label>Imagen</label>
                    <div class=""> 
                        <div class="col-xs-2">
                            <div class=" thumbnail text-center">
                                <img src="img/mes.png" alt="Mesa" class="img-rounded" style="width: 90%; height: 40px;"> 
                                <input type="radio" name="img" value="1" id="" checked>
                            </div>
                        </div>
                        <div class="col-xs-2">
                            <div class=" thumbnail text-center">
                                <img src="img/silla.png" alt="Mesa" class="img-rounded" style="width: 90%; height: 40px;"> 
                                <input type="radio" name="img" value="2" id="">
                            </div>
                        </div>
                        <div class="col-xs-2">
                            <div class=" thumbnail text-center">
                                <img src="img/silla_cine.png" alt="Mesa" class="img-rounded" style="width: 90%; height: 40px;"> 
                                <input type="radio" name="img" value="3" id="">
                            </div>
                        </div>
                        <div class="col-xs-2">
                            <div class=" thumbnail text-center">
                                <img src="img/cama_sencilla.png" alt="Mesa" class="img-rounded" style="width: 90%; height: 40px;"> 
                                <input type="radio" name="img" value="4" id="">
                            </div>
                        </div>
                        <div class="col-xs-2">
                            <div class=" thumbnail text-center">
                                <img src="img/cama_doble.png" alt="Mesa" class="img-rounded" style="width: 90%; height: 40px;"> 
                                <input type="radio" name="img" value="5" id="">
                            </div>
                        </div>
                        <div class="col-xs-2">
                            <div class=" thumbnail text-center">
                                <img src="img/domicilio.png" alt="Mesa" class="img-rounded" style="width: 90%; height: 40px;"> 
                                <input type="radio" name="img" value="6" id="">
                            </div>
                        </div>
                    </div></br></br></br>

                    <div class="modal-footer">
                        <button type="button" class="btn btn-default" data-dismiss="modal">Cancelar</button>
                        <button id="guardar_datos_mesa" type="submit" class="btn btn-success"><i class="icon-ok"></i> <strong>Registrar</strong></button>
                    </div>
                </form>
            </div>     
        </div><!-- /.modal-content -->
    </div><!-- /.modal-dialog -->
</div>

<script>
$( "#guardar_mesa" ).submit(function( event ) {
$('#guardar_datos_mesa').attr("disabled", true);
var parametros = $(this).serialize();
    $.ajax({
      type: "POST",
      url: "php_mesas/registrar_mesa.php",
      data: parametros,
       beforeSend: function(objeto){
        $("#resultados_mesa").html("Mensaje: Cargando...");
        },
      success: function(datos){
      $("#resultados_mesa").html(datos);
      $('#guardar_datos_mesa').attr("disabled", false);
      load(1);
      }
  }); 
  event.preventDefault();
}) 
</script>