0

Tengo un procedimiento almacenado el cual al ejecutarse me arroja una tabla de manera dinámica. Me gustaría que esa tabla, se almacenara en array de Javascript, no importando el numero de campos o de filas.

¿Hay alguna forma de rellenarno a partir de un procedimiento almacenado de SQL Server?

Código C#:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Configuration;

namespace Dash_Femsa
{
    public partial class _Default : Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            clsConexioncs conexion_server = new clsConexioncs();

            conexion_server.Conexion = ConfigurationManager.ConnectionStrings["DefaultDW"].ToString();

            //store 
            try 
            {

                conexion_server.PreparaComandoSP("prm_spFEMSA_SemanasIndicadoresTelemetria");

                conexion_server.LlenaComboConConsulta(lista_fechas, "Semana", "RangoFechas");                
            }
            catch (Exception ex)
            {
                Console.WriteLine(ex.Message.ToString().Trim());

            }
        }
    }
}

Es importante mencionarles que el procedimiento se ejecuta desde un método de C# con web form, y se envía a una página para generar gráficos a partir de google chart. Espero haberme explicado. Gracias.

Este es mi código Javascript:

<script type="text/javascript">
    google.charts.load('current', { 'packages': ['bar'] });
    google.charts.setOnLoadCallback(drawStuff);

    function drawStuff() {
        var data = new google.visualization.arrayToDataTable([
          ['Opening Move', 'Total'],
          ["Irapuato", 150],
          ["Celaya", 115],
          ["Coecillo", 94],
          ["Oriente León", 90],
          ['León Sur', 38]
        ]);

        var options = {
            title: 'Telemetría FEMSA',
            width: 900,
            legend: { position: 'none' },
            chart: {
                title: 'Telemetría FEMSA',
                subtitle: 'Total por zona'
            },
            bars: 'horizontal', // Required for Material Bar Charts.
            axes: {
                x: {
                    0: { side: 'top', label: 'Totales' } // Top x-axis.
                }
            },
            bar: { groupWidth: "90%" }
        };

        var chart = new google.charts.Bar(document.getElementById('grafica_semanal'));
        chart.draw(data, options);
    };
</script>
3
  • Hola Ric_hc, una pregunta, ¿en qué parte del código de JavaScript deseas que se llene esa tabla de forma dinámica? Es decir, finalmente deseas que esa tabla se almacene en una variable de tipo array, pero no indicas en qué parte o la variable
    – Phi
    el 23 feb. 2017 a las 17:22
  • Te anexo la respuesta en la parte de abajo. Grax
    – Ric_hc
    el 23 feb. 2017 a las 17:29
  • Es preferible que edites tu pregunta en lugar de agregar una respuesta, en la parte de abajo de la pregunta está el link para editar tu pregunta
    – Phi
    el 23 feb. 2017 a las 17:37

3 respuestas 3

1

H.o.l.a, Lo que puedes hacer en estos casos es crear un webservice que obtenga tu información desde la base de datos y consumir este webservice desde el lado del cliente con jquery. Otra solución, es que utilices esta librería para armar los gráficos: https://dotnethighcharts.codeplex.com/ . Con esta librería puedes cargar los datos del gráfico desde el lado del servidor.

1
  • Uff wow, gracias por la respuesta... Sin embargo, lo estoy haciendo ya con Chart de C# :-(, Gracias.
    – Ric_hc
    el 23 feb. 2017 a las 17:11
1

Con estas instrucciones van a generar la gráfica:

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Data.SqlClient;
using System.Configuration;
using System.Data;

namespace SistemaDashBoardFEMSA
{
    public partial class Graficas : System.Web.UI.Page
    {
        int[] barras = new int[3];

        string[] nombs = new string[3];


        protected void Page_Load(object sender, EventArgs e)
        {
            ObtenerDatos();
        }


        //get data
        protected void ObtenerDatos()
        {
            DataSet resultado = new DataSet();            

            clsConexioncs conexion_server = new clsConexioncs();

            conexion_server.Conexion = ConfigurationManager.ConnectionStrings["DefaultDW"].ToString();


            conexion_server.PreparaComandoSP("sp_telemtria_femsa");

            resultado = conexion_server.EjecutaComandoDataSet();




            foreach (DataRow row in resultado.Tables[0].Rows)
            {


            }

            Graficas_Semanal.Series["Series"].Points.DataBindXY(nombs, barras);

        }

    }
}

Ya lo que estoy haciendo es ajustarlo a las tablas que me hacen falta.

Resultado del sp:
Irapuato 150
Celaya 115
Coecillo 94
Oriente León 90
León Sur 38

Gráfica actual hasta el momento

Espero y les sirva.

1
  • Una disculpa no estaba en mi lugar, muchas gracias a todos. Les agradezco el apoyo, mi intención desde el inicio, JAMAS ha sido el publicar una respuesta para llamar la atención, solo les brindo la solución que hasta el momento he llegado, no es mi intención que ustedes hagan todo el trabajo. Tan solo comparto los conocimientos que poseo para que alguien o algunos, les sirva de referencia para sus proyectos futuros. Creo que le ayuda ha sido demasiada y ha generado demasiada polémica. No intento agrandar mas el foro, MUCHAS GRAX A TODOS y espero les ayude en algo.
    – Ric_hc
    el 23 feb. 2017 a las 19:35
0

Mejora las publicaciones mediante ediciones o comentarios. Realiza ediciones para corregir errores, mejorar el formato o aclarar el significado de una publicación.

Stack Overflow en español es un sitio de preguntas y respuesta. No es un foro de discusión.


Sobre tu problema. Tu pregunta se podría dar como amplia, pero para no alargar más el "FORO" que estás realizando.

Usa Response.Write para generar el array que necesitas. Para el ejemplo puedes obtenerla de una propiedad o un método estático.

CodeBehind:

using System;
using System.Data;
using System.Text;
using System.Web.UI;

namespace WebApplication2
{
    public partial class WebForm1 : Page
    {
        protected string InformacionArray
        {
            get { return ViewState["GRAFICO"] as string; }
            set { ViewState["GRAFICO"] = value; }
        }

        protected void Page_Load(object sender, EventArgs e)
        {
            if (IsPostBack) return;

            InformacionArray = MetodoEstatico();
        }

        protected static string MetodoEstatico()
        {
            var table = new DataTable();
            table.Columns.Add("Texto", typeof(string));
            table.Columns.Add("Numero", typeof(int));

            for (var i = 0; i < 10; i++)
            {
                var row = table.NewRow();
                row["Texto"] = "item " + i;
                row["Numero"] = i;
                table.Rows.Add(row);
            }

            var sbArrayPrueba = new StringBuilder();
            sbArrayPrueba.Append("[");
            for (var i = 0; i < table.Rows.Count; i++)
            {
                var row = table.Rows[i];
                var separador = i != table.Rows.Count - 1 ? "," : "";
                sbArrayPrueba.AppendFormat("['{0}', {1}]{2}", row["Texto"], row["Numero"], separador);
            }
            sbArrayPrueba.Append("]");

            return sbArrayPrueba.ToString();
        }
    }
}

ASPX:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication2.WebForm1" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script>
        (function() {
            // Obtenido desde una Propiedad de la página
            var miArrayDePropiedad = <%= InformacionArray %>;
            alert(miArrayDePropiedad);

            // Obtenido de un método estático
            var miArrayDeMetodo = <%= MetodoEstatico() %>;
            alert(miArrayDeMetodo);
        })();

    </script>

</head>
<body>
    <form id="form1" runat="server">
    </form>
</body>
</html>

Resultado:

<script>
    (function() {
        // Obtenido desde una Propiedad de la página
        var miArrayDePropiedad = [['item 0', 0],['item 1', 1],['item 2', 2],['item 3', 3],['item 4', 4],['item 5', 5],['item 6', 6],['item 7', 7],['item 8', 8],['item 9', 9]];
        alert(miArrayDePropiedad);

        // Obtenido de un método estático
        var miArrayDeMetodo = [['item 0', 0],['item 1', 1],['item 2', 2],['item 3', 3],['item 4', 4],['item 5', 5],['item 6', 6],['item 7', 7],['item 8', 8],['item 9', 9]];
        alert(miArrayDeMetodo);
    })();

</script>

Recuerda que la manipulación para crear el array es en el lado servidor y cada vez que se realice un PostBack tu formulario siempre va a invocar dicha propiedad y método estático.

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.