Функция Javascript перезаписывает функцию отправки - PullRequest
0 голосов
/ 28 мая 2019

Добрый день, моя проблема в том, что при использовании функции выбора даты, связывая ее с идентификатором поля, кнопка отправки формы фокусируется на поле с идентификатором выбора даты. Это создает цикл, который я не смог решить самостоятельно.

Перед нажатием кнопки отправки

Когда я нажимаю кнопку отправки

Декларация JS:

<head>
<meta name="viewport" content="width=device-width" />
<title>Sistema MVC</title>
<!--Boostrap-->
<link href="~/Scripts/bootstrap.css" rel="stylesheet" />
<link href="~/Scripts/bootstrap.min.css" rel="stylesheet" />
<!--Jquery-->
<script src="~/assets/js/jquery-3.3.0.min.js"></script>
<!-- jQuery UI CSS Reference -->
<link href="~/Content/themes/base/jquery-ui.min.css" rel="stylesheet" />
<link href="~/Scripts/bootstrap4-toggle.min.css" rel="stylesheet">
<!-- Required jQuery and jQuery UI Javascript references -->
<script src="~/Scripts/jquery-ui-1.12.1.min.js"></script>
<script src="~/Scripts/bootstrap4-toggle.min.js"></script>
</head>

<body>
.
.
.
.
.
<!--Boostrap-->
<script src="~/assets/js/bootstrap.min.js"></script>
<!--ResponseModel-->
<script src="~/Assets/js/ini.js"></script>
<script src="~/Assets/js/jquery.form.js"></script>
<script src="~/Assets/js/jquery.validate.min.js"></script>
<script src="~/Assets/js/jquery.validate.unobtrusive.min.js"></script>
</body>

Функция JS:

<script type="text/javascript">
$(function () {
    // Reset language
    $.datepicker.regional['es'] = {
        closeText: 'Cerrar',
        prevText: '< Ant',
        nextText: 'Sig >',
        currentText: 'Hoy',
        monthNames: ['Enero', 'Febrero', 'Marzo', 'Abril', 'Mayo', 'Junio', 'Julio', 'Agosto', 'Septiembre', 'Octubre', 'Noviembre', 'Diciembre'],
        monthNamesShort: ['Ene', 'Feb', 'Mar', 'Abr', 'May', 'Jun', 'Jul', 'Ago', 'Sep', 'Oct', 'Nov', 'Dic'],
        dayNames: ['Domingo', 'Lunes', 'Martes', 'Miércoles', 'Jueves', 'Viernes', 'Sábado'],
        dayNamesShort: ['Dom', 'Lun', 'Mar', 'Mié', 'Juv', 'Vie', 'Sáb'],
        dayNamesMin: ['Do', 'Lu', 'Ma', 'Mi', 'Ju', 'Vi', 'Sá'],
        weekHeader: 'Sm',
        dateFormat: 'dd/mm/yy',
        firstDay: 1,
        isRTL: false,
        showMonthAfterYear: false,
        yearSuffix: ''
    };
    $.datepicker.setDefaults($.datepicker.regional["es"]);
    // This will make every element with the id "date-picker" into a DatePicker element
    $('#date-picker').datepicker();
});
</script>

Элемент DOM

- указатель даты -

<div class="form-group">
            @Html.Label("Fecha de Creacion")
            @Html.TextBoxFor(x => x.fechacreacion, "{0:dd/MM/yyyy}",
                new { @class = "form-control" , @id = "date-picker"})
</div>

- кнопка отправки -

<div class="text-right">
    <button type="submit" id="otroBoton" class="btn btn-primary">Grabar</button>
    <a href="~/Control" class="btn btn-danger">Cancelar</a>
</div>

Я жду вашей помощи, большое спасибо.

РЕДАКТИРОВАТЬ 1:

Весь код формы:

@using (Html.BeginForm("Guardar", "Asignacion", FormMethod.Post, new { id = "frm-asignacion" }))
{
    @Html.HiddenFor(x => x.asignacion_id)
    <div class="card">
        <div class="card-header">Información de Asignacion</div>
        <div class="card-body">   
            <div class="container">
                <div class="row">
                    <div class="form-group col-4">
                        @Html.Label("Id")
                        @Html.TextBoxFor(x => x.asignacion_id, new
                        { @class = "form-control", disabled = true })
                    </div>
                    <div class="form-group col-4">
                        @Html.Label("Semestre")
                        <select name="semestre_id" class="form-control">
                            <option @(Model.semestre_id.Equals("") ? "Selected" : "") value="">
                                -- Seleccione --
                            </option>
                            @foreach (var s in semestre)
                            {
                            <option @(Model.semestre_id.Equals(s.semestre_id) ? "Selected" : "") value="@s.semestre_id">@s.nombre</option>
                            }
                        </select>
                        @Html.ValidationMessageFor(x => x.semestre_id, null,
                                          new { @class = "text-danger" })
                    </div>
                    <div class="form-group col-4">
                        @Html.Label("Fecha de Creacion")
                        @Html.TextBoxFor(x => x.fecharegistro, "{0:dd/MM/yyyy}", new
                        { @class = "form-control", @id = "date-picker", })
                    </div>
                </div>
                <div class="row">
                    <div class="form-group col-9">
                        @Html.Label("Titulo")
                        @Html.TextBoxFor(x => x.titulo, new
                        { @class = "form-control" })
                        @Html.ValidationMessageFor(x => x.titulo, null,
                                          new { @class = "text-danger" })
                    </div>
                    <div class="form-group col-3">
                        @Html.Label("Estado")
                        <input id="estadoCheckbox" type="checkbox" data-toggle="toggle" @(Model.estado == "A" ? "checked" : "")
                               data-on="Activo" data-off="Inactivo" data-size="normal" data-onstyle="success" data-offstyle="danger" data-width="100%">
                        <input name="estado" id="estado" type="hidden" value="@(Model.estado == "A" ? "A" : "I")">
                    </div>
                </div>
            </div>            
        </div>
    </div>
    <br />
    <div class="text-right">
        <button type="submit" class="btn btn-primary">Grabar</button>
        <a href="~/Asignacion" class="btn btn-danger">Cancelar</a>
    </div>
}
...