Ocultar y Mostrar con Mapa de Google – javascript c# asp.net

Pregunta:


Tengo un div en mi página ASP.NET que contiene un Mapa de Google, y necesito mostrarlo y ocultarlo pero no me funciona.

Este es el código dividido por lengaujes:

Javascript:

function ShowMap()
{
    var mapa = document.getElementById('map');
    mapa.display('block');
}

function HiddenMap()
{
    var mapa = document.getElementById('map');
    mapa.display('none');
}

ASP.NET:

<form id="form1" runat="server">
    <div>
        <div id="map" style="width:auto; height:390px; top:2%;display:none;"> 
    </div>
        <asp:Button ID="Button1" runat="server" Text="Button" OnClick="Button1_Click" Width="114px" />
        <asp:Button ID="Button2" runat="server" Text="Button"  Width="114px" OnClick="Button2_Click" />
    </div>
</form>

C#:

protected void Button1_Click(object sender, EventArgs e)
{
    String ScriptAct = "HiddenMap();";
    ScriptManager.RegisterStartupScript(this, this.GetType(), "HiddenMap()", ScriptAct, true);
}

protected void Button2_Click(object sender, EventArgs e)
{
    String ScriptAct = "ShowMap();";
    ScriptManager.RegisterStartupScript(this, this.GetType(), "ShowMap()", ScriptAct, true);
}

Preguntado por: Efrain Mejias C

Efrain Mejias C

Cambia el código javascript de la siguiente manera:

function ShowMap()
{
    var mapa = document.getElementById('map');
    mapa.style.display('block');
}

function HiddenMap()
{
    var mapa = document.getElementById('map');
    mapa.style.display('none');
}

Y en el código ASP.NET, usa la propiedad OnClientClick:

Ejemplo:

<asp:Button ID="Button1" runat="server" Text="Button" OnClientClick="ShowMap();" Width="114px" />
<asp:Button ID="Button2" runat="server" Text="Button"  Width="114px" OnClientClick="HiddenMap();" />

Prueba esta línea :

document.getElementById('mapa').style.display='block'; 

o para ocultar

document.getElementById('mapa').style.display='hidden';

Por ejemplo:

Botón Ocultar:

 protected void Button1_Click(object sender, EventArgs e)
        {

            String ScriptAct = "document.getElementById('mapa').style.display='hidden'; alert('Listo');";
            ScriptManager.RegisterStartupScript(this, this.GetType(), "hidden", ScriptAct, true);
        }

Botón Mostrar:

 String ScriptAct = "document.getElementById('mapa').style.display='block'; alert('Listo'); ";
            ScriptManager.RegisterStartupScript(this, this.GetType(), "show", ScriptAct, true);

CODIGO JS

function displayMap() {
              var listCount = $("[id*='hfCount']").val();
              if (listCount == 0)  return; 
              var atext = document.getElementById('btnmap').innerText;
              console.log(atext);
              if (atext == "VIEW ON MAP") {
                  document.getElementById('collapseMap').style.display = "block";
                  document.getElementById("btnmap").innerHTML = "HIDE MAP";
              }
              else {
                  document.getElementById('collapseMap').style.display = "none";
                  document.getElementById("btnmap").innerHTML = "VIEW ON MAP";
              }
      }

CODIGO ASP.NET

 <div id="collapseMap">
    <div id="map">
     </div>
 </div>

Fuente

Related Posts:

¿Cómo obtener la respuesta de una llamada asíncrona (AJAX) fuera de ella? – javascript jquery asincrónico
Pregunta: Actualmente tengo esta función: function devuelveButaca(posicion){ var array = posicion.split('_'); var row = array; var column ...
Evitar múltiples toggle con misma clase – javascript
Pregunta: Para un evento toggle con puro javascript lo desarrollo de la siguiente forma: Javascript // Esta clase lo expande. const expandButton = document.querySelector('.expand-button'); expandButton.addEventListener('click', ()=> { ...
Validación de datos nulos en una función – javascript
Pregunta: Tengo la siguiente función pero al momento validar todos mis datos me los registra todos a excepción del los "containers" que son grids y ...
Declarar un array de structs de tamaño dinamico – c++
Pregunta: buenas, lo que quiero conseguir es declarar un struct con array que tenga su tamaño dinamico, pero cuando lo hago el programa se me ...
Como poner una imagen de fondo a pantalla completa – javascript jquery html5
Pregunta: Como puedo hacer que la imagen abarque todo el tamaño de la pantalla. Se que de las propiedad min-width y min-heigth pero ellas no ...
Error de: Uncaught TypeError: url.indexOf is not a function por Jquery – javascript jquery
Pregunta: En el navegador, reviso en inspeccionar elemento, y me sale el siguiente error: Uncaught TypeError: url.indexOf is not a function Me imagino que es ...
Problemas con el registro de un archivo .tlb – c# windows vb6
Pregunta: La situación es la siguiente: He creado un pequeño proyecto de librería de clases en C# que me permita realizar ciertas operaciones. El nombre del ...
Como validar array checkbox – javascript php jquery
Pregunta: Que tal buen dia, alguien me podria decir como se puede hacer para que cuando presione el boton "BAJAR DATOS" si este esta vacio ...
Uso de js y c# en unity. ¿Igual rendimiento? – javascript c# unity3d
Pregunta: Estoy comenzando con unity . Y veo que se pueden usar c# y js para programar. Mi pregunta es si tanto c# como js ...
Como cambiar una propiedad html dependiendo del valor de un perfil recogido de clase java – javascript jquery html
Pregunta: Tengo una caja de texto en la que me gustaría poder escribir o no dependiendo del perfil que utilice la aplicación. Esta caja de ...
Cómo puedo incluir librería beecrypt en un proyecto en C – c
Pregunta: Tengo un archivo .lib (librería) y quiero usarla en un proyecto de C. Para ser más especifica estoy intentando instalar beecrypt que es una librería ...
Agregar marcador especifico a una localización Google Maps – javascript google-maps
Pregunta: ¿Cómo podría añadir un marcador personalizado en Google maps? Actualmente el código que tengo es el siguiente: var locations = [ ['Bondi Beach', -33.890542, ...
Usar variable en otra función con javascript – javascript html app
Pregunta: Primero que todo voy a dejar un enlace donde pueden ver el ejemplo funcionando de manera completa. Enlace a la pagina AQUI El valor elegido en ...
Copiar valor a un input que esta dentro de un footer de un datatable – javascript jquery datatables
Pregunta: Estoy usando los DataTables de jQuery y me estoy encontrando con el siguiente problema: cuando pulso en un botón necesito pasarle un valor con ...
¿Cómo rellenar cada circulo al pasar el mouse encima? – javascript jquery html
Pregunta: ¡Hola! Estoy practicando jQuery, y me gustaría poder hacer como un ranking. A lo que quiero llegar es que cada vez que el mouse ...

Add a Comment

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *