Foros del Web » Programando para Internet » Javascript » Frameworks JS »

[SOLUCIONADO] X-editable leer valores desde base de datos

Estas en el tema de X-editable leer valores desde base de datos en el foro de Frameworks JS en Foros del Web. hola amigos espero me puedan ayudar estoy utilizando X-editable y necesito leer desde la base de datos , el ejemplo que se encuentra en el ...
  #1 (permalink)  
Antiguo 26/01/2013, 09:33
 
Fecha de Ingreso: septiembre-2010
Mensajes: 1.853
Antigüedad: 10 años, 2 meses
Puntos: 6
X-editable leer valores desde base de datos

hola amigos espero me puedan ayudar

estoy utilizando X-editable y necesito leer desde la base de datos , el ejemplo que se encuentra en el ejemplo es el siguiente

Código Javascript:
Ver original
  1. <script>
  2. $(function(){
  3.     $('#address').editable({
  4.         url: '/post',
  5.         title: 'Enter city, street and building #',
  6.         value: {
  7.             city: "Moscow",
  8.             street: "Lenina",
  9.             building: "15"
  10.         }
  11.     });
  12. });
  13. </script>

mi duda es si el value lo puedo hacer con un json creado desde php

Código Javascript:
Ver original
  1. <script>
  2. $(function(){
  3.     $('#address').editable({
  4.         url: '/post',
  5.         title: 'Enter city, street and building #',
  6.         value:valores.php
  7.     });
  8. });
  9. </script>
  #2 (permalink)  
Antiguo 29/01/2013, 10:58
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 12 años, 3 meses
Puntos: 1532
Respuesta: X-editable leer valores desde base de datos

necesita un lenguaje del lado del servidor para conectar con bases de datos, y AJAX para mejorar la interacción (no limitativo).

tambien puede usar SQLite (HTML 5 local storage) pero la base es local y única por cleinte, no se puede centralizar
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...
  #3 (permalink)  
Antiguo 29/01/2013, 22:18
 
Fecha de Ingreso: septiembre-2010
Mensajes: 1.853
Antigüedad: 10 años, 2 meses
Puntos: 6
Respuesta: X-editable leer valores desde base de datos

maycolalvarez gracias por responder

estoy utilizando php lenguaje del lado del servidor para conectar con bases de datos y creo el array tipo json

Código PHP:
Ver original
  1. <?php
  2. $arr = array('city' => 'Moscow', 'street' => 'Lenina', 'building' => 15);
  3.  
  4. return json_encode($arr);
  5. ?>


y hice lo que que me indicaste de usuar ajax pero no logro que funcione , que estoy haciendo mal?

Código Javascript:
Ver original
  1. $('#address').editable({
  2.         url: 'multiples.php',
  3.         title: 'Enter city, street and building #',
  4.         value:function() {
  5.            $.ajax({
  6.            url: "datos.php",
  7.            type: json,
  8.            sucess: function( resultado){
  9.            }
  10.            });
  11.          
  12.          },
  13.    
  14.     });

con este plugin no se tiene control del html osea de los input
  #4 (permalink)  
Antiguo 30/01/2013, 08:32
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 12 años, 3 meses
Puntos: 1532
Respuesta: X-editable leer valores desde base de datos

de nada te sirve return allí, consulte sobre dicha palabra reservada

lo que necesitas es hacer un echo para "volcar" el json a la salida, así lo recibe ajax, puedes usar un die() y así finalizas el script php de una vez:

Código PHP:
Ver original
  1. <?php
  2. $arr = array('city' => 'Moscow', 'street' => 'Lenina', 'building' => 15);
  3.  
  4. die( json_encode($arr));
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...
  #5 (permalink)  
Antiguo 30/01/2013, 10:25
 
Fecha de Ingreso: septiembre-2010
Mensajes: 1.853
Antigüedad: 10 años, 2 meses
Puntos: 6
Respuesta: X-editable leer valores desde base de datos

maycolalvarez gracias por responder

con esta funcion ajax puedo llenar los input que hace el plugin?

el plugin trabaja asi, en el DOM debe de estar

Código Javascript:
Ver original
  1. <script>
  2. $(function(){
  3. $('#address').editable({
  4. url: '/post',
  5. title: 'Enter city, street and building #'
  6. /* en el demo asi se cargan los input , pero yo lo necesito desde base de datos
  7. value: {
  8. city: "Moscow",
  9. street: "Lenina",
  10. building: "15"
  11. }*/
  12. });
  13. });
  14. </script>

Código HTML:
Ver original
  1. <a href="#" id="address" data-type="address" data-pk="1">awesome</a>

y se hace referencia a un archivo js

Código Javascript:
Ver original
  1. <script src="src/js/address.js"></script>

y address.js es https://github.com/vitalets/x-editab...ess/address.js

indicame si estoy muy equivocado por favor
  #6 (permalink)  
Antiguo 30/01/2013, 11:48
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 12 años, 3 meses
Puntos: 1532
Respuesta: X-editable leer valores desde base de datos

eso depende de lo que espere el plugin, si el espera un json con input:valor, eso leerá, a no ser que tengas que especificar otras cosas, consulte su documentación.
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...
  #7 (permalink)  
Antiguo 30/01/2013, 13:15
 
Fecha de Ingreso: septiembre-2010
Mensajes: 1.853
Antigüedad: 10 años, 2 meses
Puntos: 6
Respuesta: X-editable leer valores desde base de datos

maycolalvarez gracias por responder , disculpame estoy un poco confundido y no me funciona lo que me indicaste

estoy viendo la documentacion del plugin
http://vitalets.github.com/x-editable/docs.html en $().editable(options)

Name:value
Type:mixed
Default: element's text
Description:Initial value of input. If not set, taken from element's text.


segun el ejemplo que hay en el plugin se llenan los input con un array json
Código Javascript:
Ver original
  1. <script>
  2. $(function(){
  3. $('#address').editable({
  4. url: '/post',
  5. title: 'Enter city, street and building #',
  6. value: {
  7. city: "Moscow",
  8. street: "Lenina",
  9. building: "15"
  10. }
  11. });
  12. });
  13. </script>

me corriges si estoy equivocado , hice lo que me indicaste y no me funciona

Código Javascript:
Ver original
  1. $('#address').editable({
  2.         url: 'multiples.php',
  3.         title: 'Enter city, street and building #',
  4.         value:function() {
  5.            $.ajax({
  6.            url: "datos.php",
  7.            type: json,
  8.            sucess: function( resultado){
  9.            }
  10.            });
  11.          
  12.          },
  13.    
  14.     });


Código PHP:
Ver original
  1. <?php
  2. $arr = array('city' => 'Moscow', 'street' => 'Lenina', 'building' => 15);
  3.  
  4. die( json_encode($arr));

Última edición por Montes28; 31/01/2013 a las 06:58
  #8 (permalink)  
Antiguo 31/01/2013, 10:32
Avatar de maycolalvarez
Colaborador
 
Fecha de Ingreso: julio-2008
Ubicación: Caracas
Mensajes: 12.120
Antigüedad: 12 años, 3 meses
Puntos: 1532
Respuesta: X-editable leer valores desde base de datos

ya veo el problema, estás implementando AJAX inadecuadamente:

1 - ajax es asíncrono: él NO puede retornar el resultado como si fuese una función, por lo tanto no puedes establecer la llamada AJAX al parámetro value

2 - Para establecer los datos del objeto editable, tienes que esperar a la respuesta del servidor hacia AJAX (onreadystatechange), lo que es el success y setear el response al objeto:

Código Javascript:
Ver original
  1. $.ajax({
  2.    url: "datos.php",
  3.    type: json,
  4.    sucess: function(resultado){
  5.         $('#address').editable({
  6.             url: 'multiples.php',
  7.             title: 'Enter city, street and building #',
  8.             value: resultado //¡¡¡resultado devuelto por el Server!!!
  9.         });
  10.    }
  11. );
__________________
¡Por favor!: usa el highlight para mostrar código
El que busca, encuentra...
  #9 (permalink)  
Antiguo 31/01/2013, 14:41
 
Fecha de Ingreso: septiembre-2010
Mensajes: 1.853
Antigüedad: 10 años, 2 meses
Puntos: 6
Respuesta: X-editable leer valores desde base de datos

maycolalvarez gracias por responder y por ayudarme , hice lo que me indicas pero no funciona


Código Javascript:
Ver original
  1. $(document).ready(function() {
  2. $.ajax({
  3.    url: "datos.php",
  4.    type: json,
  5.    sucess: function(resultado){
  6.         $('.address').editable({
  7.             url: 'multiples.php',
  8.             title: 'Enter city, street and building #',
  9.             value: resultado //¡¡¡resultado devuelto por el Server!!!
  10.         });
  11.    }
  12. );
  13. });
  #10 (permalink)  
Antiguo 31/01/2013, 14:58
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 10.037
Antigüedad: 12 años, 8 meses
Puntos: 1329
Respuesta: X-editable leer valores desde base de datos

Si estás en Chrome, ¿probaste abrir la consola a ver si te muestra algún error?

Saludos
__________________
Grupo Telegram Docker en Español
  #11 (permalink)  
Antiguo 31/01/2013, 15:05
 
Fecha de Ingreso: septiembre-2010
Mensajes: 1.853
Antigüedad: 10 años, 2 meses
Puntos: 6
Respuesta: X-editable leer valores desde base de datos

Carlangueitor gracias por responder

estoy utilizando mozilla y abri firebug y no sale ningun error , no se porque no me funciona el codigo ajax
  #12 (permalink)  
Antiguo 31/01/2013, 15:13
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 10.037
Antigüedad: 12 años, 8 meses
Puntos: 1329
Respuesta: X-editable leer valores desde base de datos

Veo un error en la linea 4:

Código Javascript:
Ver original
  1. type: json

Debe ser 'POST' o 'GET', y por lo que dices debe ser 'GET', así que puedes omitir ese parámetro.


Saludos
__________________
Grupo Telegram Docker en Español
  #13 (permalink)  
Antiguo 31/01/2013, 15:27
Avatar de David
Moderador
 
Fecha de Ingreso: abril-2005
Ubicación: In this planet
Mensajes: 15.720
Antigüedad: 15 años, 7 meses
Puntos: 839
Respuesta: X-editable leer valores desde base de datos

Quizás la idea era:
Código Javascript:
Ver original
  1. dataType: 'json'
__________________
Por favor, antes de preguntar, revisa la Guía para realizar preguntas.
  #14 (permalink)  
Antiguo 31/01/2013, 15:30
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 10.037
Antigüedad: 12 años, 8 meses
Puntos: 1329
Respuesta: X-editable leer valores desde base de datos

Suena muy lógico
__________________
Grupo Telegram Docker en Español
  #15 (permalink)  
Antiguo 31/01/2013, 15:34
 
Fecha de Ingreso: septiembre-2010
Mensajes: 1.853
Antigüedad: 10 años, 2 meses
Puntos: 6
Respuesta: X-editable leer valores desde base de datos

Carlangueitor gracias por responder .

segun lo que me indicas deberia de quitar type:json la respuesta es el formato json te voy a mostar con lo estoy trabajando hice lo que me indicaste y no funciona , ya instale chrome y no veo ningun error .

<link href="css/bootstrap.css" rel="stylesheet">
<link href="css/bootstrap-editable.css" rel="stylesheet">
<link href="css/address.css" rel="stylesheet">

<script src="js/jquery-1.8.2.min.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="js/bootstrap-editable.min.js"></script>
<script src="js/bootstrap-tabs.js"></script>
<script src="js/ovsm.js"></script>

<script src="js/address.js"></script>
<script src="js/html5types.js"></script>

Código Javascript:
Ver original
  1. <script>
  2. $(document).ready(function() {
  3.  
  4. $.ajax({
  5.    url: "prueba.php",
  6.    dataType: 'json',
  7.    sucess: function(resultado){
  8.         $('.address').editable({
  9.             url: 'multiples.php',
  10.             title: 'Enter city, street and building #',
  11.             value:resultado
  12.         });
  13.    }
  14. }),
  15. });
  16.  
  17.  
  18.  
  19.  
  20. </script>

Código HTML:
Ver original
  1. <a href="#" class="address" data-type="address" data-pk="1">awesome 2 </a>
  #16 (permalink)  
Antiguo 31/01/2013, 15:50
Avatar de Carlangueitor
Moderador ლ(ಠ益ಠლ)
 
Fecha de Ingreso: marzo-2008
Ubicación: México
Mensajes: 10.037
Antigüedad: 12 años, 8 meses
Puntos: 1329
Respuesta: X-editable leer valores desde base de datos

La respuesta es formato json, eso está bien, pero puedes hacer solo peticiones POST o GET (o en el caso puede ser DELETE, PUT, etc), mira la documentación de jQuery:

Cita:
The type of request to make ("POST" or "GET"), default is "GET". Note: Other HTTP request methods, such as PUT and DELETE, can also be used here, but they are not supported by all browsers.
Prueba agregar también el callback para el error:
Código Javascript:
Ver original
  1. <script>
  2. $(document).ready(function() {
  3.  
  4. $.ajax({
  5.    url: "prueba.php",
  6.    dataType: 'json',
  7.    sucess: function(resultado){
  8.         $('.address').editable({
  9.             url: 'multiples.php',
  10.             title: 'Enter city, street and building #',
  11.             value:resultado
  12.         });
  13.    },
  14.    error: function(error){
  15.        console.log(error);
  16.     }
  17. }),
  18. });
  19. </script>


Saludos
__________________
Grupo Telegram Docker en Español
  #17 (permalink)  
Antiguo 31/01/2013, 16:14
 
Fecha de Ingreso: septiembre-2010
Mensajes: 1.853
Antigüedad: 10 años, 2 meses
Puntos: 6
Respuesta: X-editable leer valores desde base de datos

amigos estoy desesperado no se que mas hacer , en consola me aparece esto , pero los errores a los que hace referencia no son del proyecto

Port error: Could not establish connection. Receiving end does not exist. miscellaneous_bindings:236
chromeHidden.Port.dispatchOnDisconnect miscellaneous_bindings:236
Port error: Could not establish connection. Receiving end does not exist. miscellaneous_bindings:236
chromeHidden.Port.dispatchOnDisconnect miscellaneous_bindings:236
Exception in onResRdy: TypeError: Cannot read property 'htmlRes' of undefined ContentScript.js:84
  #18 (permalink)  
Antiguo 31/01/2013, 16:17
Avatar de David
Moderador
 
Fecha de Ingreso: abril-2005
Ubicación: In this planet
Mensajes: 15.720
Antigüedad: 15 años, 7 meses
Puntos: 839
Respuesta: X-editable leer valores desde base de datos

¿Y si haces un console.log(resultado) qué obtienes en la Consola?

¿Has verificado en la pestaña "Red" de Firebug cuál es la respuesta que estás obteniendo?
__________________
Por favor, antes de preguntar, revisa la Guía para realizar preguntas.
  #19 (permalink)  
Antiguo 31/01/2013, 16:33
 
Fecha de Ingreso: septiembre-2010
Mensajes: 1.853
Antigüedad: 10 años, 2 meses
Puntos: 6
Respuesta: X-editable leer valores desde base de datos

al cargar el proyecto en el navedador en el firebug observo que GET prueba.php y en respuesta obtengo {"city":"Moscow","street":"Lenina","building":1 5} y json

city "Moscow"
street "Lenina"
building 15

y en el ejemplo del plugin el value es asi

value: {
city: "Moscow",
street: "Lenina",
building: "15"
}
pero no me abre la ventana con los input

http://vitalets.github.com/x-editable/demo.html


viendo un ejemplo Process JSON response http://jsfiddle.net/xBB5x/62/


alguien tiene idea porque no funciona?

Última edición por Montes28; 01/02/2013 a las 12:54
  #20 (permalink)  
Antiguo 04/02/2013, 07:04
 
Fecha de Ingreso: septiembre-2010
Mensajes: 1.853
Antigüedad: 10 años, 2 meses
Puntos: 6
Respuesta: X-editable leer valores desde base de datos

solicito a alguien que haya usado el plugin http://vitalets.github.com/x-editable/ para que me ayude con mi problema , no logro que abra la ventana para editar .

Código Javascript:
Ver original
  1. $(document).ready(function() {
  2. $.ajax({
  3.    url: "prueba.php",
  4.    dataType: 'json',
  5.    sucess: function(resultado){
  6.         $('.address').editable({
  7.             url: 'multiples.php',
  8.             title: 'Enter city, street and building #',
  9.             value:resultado
  10.         });
  11.    },
  12.    error: function(error){
  13.        console.log(error);
  14.     }
  15. });
  16. });

que estoy haciendo mal ? que hace falta para que funcione
  #21 (permalink)  
Antiguo 07/02/2013, 16:02
 
Fecha de Ingreso: septiembre-2010
Mensajes: 1.853
Antigüedad: 10 años, 2 meses
Puntos: 6
Respuesta: X-editable leer valores desde base de datos

hola amigos espero me puedan ayudar , le escribi al autor del plugin

https://github.com/vitalets/x-editable/issues/110 y el me responde que haga lo siguiente

Código Javascript:
Ver original
  1. $(document).ready(function() {
  2. //init editable
  3. $('.address').editable({
  4. url: 'multiples.php',
  5. title: 'Enter city, street and building #'
  6. });
  7.  
  8. //set value from ajax
  9. $.ajax({
  10. url: "prueba.php",
  11. dataType: 'json',
  12. sucess: function(resultado){
  13. $('.address').editable('setValue', resultado);
  14. },
  15. error: function(error){
  16. console.log(error);
  17. }
  18. });
  19. });

observando en consola function(resultado) no arroja ningun resultado, porque?
  #22 (permalink)  
Antiguo 11/02/2013, 15:42
 
Fecha de Ingreso: septiembre-2010
Mensajes: 1.853
Antigüedad: 10 años, 2 meses
Puntos: 6
Respuesta: X-editable leer valores desde base de datos

amigos tenia un problema en el sucess y deberia de ser success

Etiquetas: javascript, js, php
Atención: Estás leyendo un tema que no tiene actividad desde hace más de 6 MESES, te recomendamos abrir un Nuevo tema en lugar de responder al actual.
Respuesta




La zona horaria es GMT -6. Ahora son las 15:50.