[SOLUCIONADO] Problema con la funcion json_encode()

dario_sanz · #1 (**permalink**) 26/02/2013, 13:22

Hola colegas, les quería comentar mi error, estoy usando jquery,ajax y php para pasar datos por el navegador, pero tengo un problema, no me está devolviendo los datos como yo quiero.
La función json_encode() me devuelve un array, ese array contiene un formulario:

Código PHP:

  $tabla = '
            <div class="row-fluid sortable">
                  <div class="control-group">
                 <label class="control-label" for="textarea2">  </label>
                 <div class="controls">
                <textarea class="cleditor" id="textarea2" rows="3"></textarea>
                              </div>
                            </div>
                            <div class="form-actions">
    <button type="submit" class="btn btn-primary">Enviar noticias</button>
    <button type="reset" class="btn">No enviar noticias</button>
                            </div>
                          </fieldset>
                                  </form>   
            </div>';

$resultado = array("tabla" => $tabla);
echo json_encode($resultado);
exit(0);

Este mismo form tiene atributos que inician algún efecto provocado por un pluguin o función en jquery, como por ejemplo:

Código HTML:

 <div class="controls">
		<textarea class="cleditor" id="textarea2" rows="3"></textarea>
	</div>

El llamado al archivo js está perfecto, porque pruebo el atributo sí que pase por json y funciona con excelencia, pero al pasarlo por json es como que no me reconociera el atributo, me explico?

Desde ya un millón de gracias por leer este pedido y les mando un saludo desde Argentina! :)

pateketrueke · #2 (**permalink**) 26/02/2013, 13:26

Pues no tiene sentido lo que dices, muchas veces he hecho lo mismo y sin ningún problema.

¿A que te refieres con que no reconoce el atributo?

¿Ya lo inspeccionaste con Firebug?

Deberías explicarte mas, no se entiendo mucho lo que planteas.

dario_sanz · #3 (**permalink**) 26/02/2013, 13:37

Si ya lo inspeccione con Firebug, y sale todo perfecto.
Te doy un ejemplo, tu creas una funcion en jquery, la misma hace que un campo de texto se ilumine, pero ese debe contener una clase llamada luz:

Código HTML:

<div class="luz" ></div>

tu sabes que cuando colocas el cursor sobre ese campo se va a iluminar.
Mi problema esta cuando devuelvo ese mismo div por json_encode(), no se ilumina.....me explico? al principio crei que era un problema de decodificacion pero no ecuentro la solucion.
Perdon soy nuevo con json, espero haberme explicado bien...Saludos y desde ya agradezco tu respuesta!

masterpuppet · #4 (**permalink**) 26/02/2013, 13:43

Acaso estas intentado aplicar un evento a un elemento que no existe en el DOM ?, si este es el caso deberías utilizar event delegation http://api.jquery.com/on/ (y también si este es el caso movemos el thread al foro correspondiente ;))

dario_sanz · #5 (**permalink**) 26/02/2013, 14:23

Si existe tal evento...voy a poner el codigo!

este es el jquery

Código:

function edit_noticia(){

        var valor1  = $("#id").val();
	
		$.ajax({
			  type:"POST",
			  dataType:"json",
			   url:"http://url/mia/a/archivo.php",

			  async:false,
			  data:{
				  opt:"edit",
				valor1:valor1
			

			  },
			  success:function(data){
			if(data.tabla){
			/* enviando mensaje*/
				  $("#erroredit").show(2000).attr({'style':'display:block'});
				  $("#erroredit").html(data.tabla);

			}
			if(data.editado == "OK"){
			/* mensaje enviado*/
					$("#erroredit").show(2000).attr({'style':'display:none'});
					$("#editnocticaform").show(2000).attr({'style':'display:block'});	
					$(".edit-notice").exito_edit_noticie();
				 	$("#editnocticaform").html(data.tabla);
			
			}

		}
	});

}

este es el php

Código PHP:

  if($_POST["opt"] == "edit"){ 
 
$valor1  = htmlspecialchars( $_POST["valor1"]); 
 
$tabla = "OK"; 
$editado = "OK"; 
$sql = "SELECT * FROM tabla WHERE idtabla = '".$valor1."'"; 
$result = mysql_query($sql,coneccion a la base de datos); 
$result_array = mysql_fetch_array($result); 
 
$sql3 = ""; 
$result = mysql_query($sql,coneccion a la base de datos); 
$count_array = mysql_fetch_array($result ); 
 
 
 
$tabla = ' 
             
                <div class="box span12"> 
                    <div class="box-header well" data-original-title> 
                        <h2><i class="icon-edit"></i>Editar noticia "'.$result_array["titulo"].'"</h2> 
                        <div id="erroredit_noticia" style="display:none"></div> 
                        <div class="box-icon"> 
                            <a href="#" class="btn btn-setting btn-round"><i class="icon-cog"></i></a> 
                            <a href="#" class="btn btn-minimize btn-round"><i class="icon-chevron-up"></i></a> 
                            <a href="#" class="btn btn-close btn-round"><i class="icon-remove"></i></a> 
                        </div> 
                    </div> 
                    <div class="box-content"> 
                        <form class="form-horizontal"> 
                          <fieldset> 
                            <legend>Editar noticia</legend> 
                            <div class="control-group"> 
                              <label class="control-label" for="typeahead">Titulo </label> 
                              <div class="controls"> 
                                <input type="text" value="'.$result_array["titulo"].'" class="span6 typeahead" id="typeahead"  data-provide="typeahead" data-items="4" data-source=""> 
                                <p class="help-block">Empieza a escribir para activar el auto completo!</p> 
                              </div> 
                            </div> 
                            <div class="control-group"> 
                              <label class="control-label" for="date01">Fecha</label> 
                              <div class="controls"> 
                                <input type="text" class="input-xlarge datepicker" id="date01" value="'.$result_array["fecha"].'"> 
                              </div> 
                            </div> 
                             
                        <div class="control-group"> 
                              <label class="control-label" for="typeahead">Autor </label> 
                              <div class="controls"> 
                                <input type="text" value="'.$result_array["autor"].'" class="span6 typeahead" id="typeahead"  data-provide="typeahead" data-items="4" data-source=""> 
                                <p class="help-block">Empieza a escribir para activar el auto completo!</p> 
                              </div> 
                            </div> 
                             
                             <div class="control-group"> 
                                <label class="control-label" for="selectError">Categorias</label> 
                                <div class="controls"> 
                                  <select id="selectError" data-rel="chosen"> 
                                  <option value="'.$categoria.'"></option>     
                                  </select> 
                            </div> 
                            </div> 
                             
                             
                            <div class="control-group"> 
                              <label class="control-label" for="fileInput">Ingresar archivo</label> 
                              <div class="controls"> 
                                <input class="input-file uniform_on" id="fileInput" type="file"> 
                              </div> 
                            </div> 
                             
                                 
                             
                             
                              
                              <div class="control-group"> 
                                <label class="control-label">Url del archivo</label> 
                                <div class="controls"> 
                                  <span class="input-xlarge uneditable-input">http://</span> 
                                </div> 
                              </div>        
                            <div class="control-group"> 
                              <label class="control-label" for="textarea2"></label> 
                              <div class="controls"> 
                                <textarea class="cleditor" id="textarea2" rows="3"></textarea> 
                              </div> 
                            </div> 
                            <div class="form-actions"> 
                              <button type="submit" class="btn btn-primary">Enviar noticias</button> 
                              <button type="reset" class="btn">No enviar noticias</button> 
                            </div> 
                          </fieldset> 
                        </form>    
 
                    </div> 
                </div><!--/span--> 
 
            </div>'; 
 
 
 
 
 
$resultado = array("tabla" => $tabla,"editado"=>$editado); 
echo json_encode($resultado); 
exit(0); 
}

Bien, pero cual es mi problema:

<textarea class="cleditor" id="textarea2" rows="3"></textarea>

en este text area no me llama al pluguin editor cuando lo paso por json_encode()
..
Saludos y gracias nuevamente!....

masterpuppet · #6 (**permalink**) 26/02/2013, 17:04

El evento no, el elemento en el DOM, el problema es que cuando invocas a .cleditor() el textarea no existe en el DOM, debes hacerlo después de inyectar el html

Código Javascript:

Ver original...
if(data.tabla) {
    /* enviando mensaje*/
    $("#erroredit").show(2000).attr({'style':'display:block'});
    $("#erroredit").html(data.tabla);
    $('#textarea2').cleditor();
}
...

dario_sanz · #7 (**permalink**) 27/02/2013, 12:13

Gracias por responder! intente como tu me dijiste pero no funciono, tuve que dejar el html en el php (osea dejar el pluguin del form del editor ) y pasar únicamente los datos de la db por variables desde jquery a las correspondientes atributos, por ejemplo value="dato de la base de datos"..
Saludos y agradezco por su atención :)