Good afternoon programmers! Excuse me I’m trying to change the color and the text of a button of my problem is as follows:
In a view several courses are displayed, when you click on the preregister button of some of them shows me a modal and inside this a form that is in a partial view, when you click OK you must change the color to blue and the text to "Cancel" of the General view. How could I do this?
Here is my foreach button found in the overview:
<button type="button" class="boton botonUno btnPreinscribir"id="myButtonChangeF" value="Preinscribirse" title="Preinscribirse" data-url="@Url.Action("PreinscripcionNumCurso","Inicio")" data-id="@ingles.Num" data-toggle="modal" data-backdrop="static">Preinscribir</button>
This is my form that’s in the partial view:
@model MultipleViewModel
@{
Layout = null;
}
@Html.ValidationSummary(true)
<link rel="stylesheet" href="~/css/VentanasParciales.css">
<link rel="stylesheet" href="~/css/FormStyle.css">
<!-- Modal Preinscripción-->
<form class="formulario" asp-controller="Inicio" asp-action="Editar" id="Editarform">
<fieldset>
<legend>Preinscripción</legend>
<p class="estilo">_____________________________</p>
<P class="estilo">
¿Esta seguro de preincribirte al curso de @Model.Curso.NombreCurso? @Model.Curso.Num
</P>
<p class="estilo">_____________________________</p>
<br />
</fieldset>
<div class="modal-footer">
<button type="button" class="btn btn-secondary text-white" data-bs-dismiss="modal">Cancelar</button>
<button type="submit" class="btn btnBgColor text-white">Aceptar</button>
</div>
</form>
And these are the functions I use in Javascript to make color and text changes.
function myFunction2() {
var btn = document.getElementById("myButtonChangeF");
if (btn.value == "Preinscribirse") {
btn.value = "Anular";
btn.innerHTML = "Anular";
btn.setAttribute("style", "background: linear-gradient(135deg, #24309d, #96989A);");
}
else {
btn.value = "Preinscribirse";
btn.innerHTML = "Preinscribirse";
btn.setAttribute("style", "background: linear-gradient(135deg, #9d2449, #96989A);");
}
}
I’d appreciate your support!