3

Saludos a todos, tengo un inconveniente con ajax y soy bastante nuevo con js, tengo un sistema de comentarios en laravel, ya he logrado editar los comentarios por medio de ajax pero ahora tengo un problema al momento de crearlos, éste es mi código.

Acá se muestran los comentarios "incluyendo los nuevos" y se editan o eliminan.

<article class="row">
                        <div class="col-md-3 col-sm-3 hidden-xs">
                          <figure class="thumbnail">
                            <img class="img-responsive" src="/uploads/avatars/{{ $comment->user->profilepic  }}" />
                            <figcaption class="text-center">{{ $comment->user->name }}</figcaption>
                          </figure>
                        </div>
                        <div class="col-md-8 col-sm-8">
                          <div class="panel panel-default arrow left">
                            <div class="panel-body">
                              <header class="text-left">
                                <div class="comment-user"><i class="fa fa-user"></i> {{ $comment->user->name }}</div>
                                <time class="comment-date" datetime="{{ $comment->created_at->diffForHumans() }}"><i class="fa fa-clock-o"></i> {{ $comment->created_at->diffForHumans() }}</time>
                              </header>
                              <div id="comment-post" data-commentid="{{ $comment->id }}">
                                  <p id="display-comment"{{ $comment->id }} class="store-comment">{{ $comment->comment }}</p>
                              </div>
                            </div>

                            <div class="panel-footer list-inline comment-footer">
                              @if(Auth::guest())

                              No puedes responder ningún comentario si no has ingresado.

                              @else

                              @if(Auth::user() == $comment->user)
                                <a href="#" data-toggle="modal" data-target="edit-comment" class="edit-comment">Editar</a> <a href="#" data-toggle="modal" data-target="delete-comment" class="delete-comment">Eliminar</a>
                              @endif

                              @if(Auth::user() != $comment->user)
                                <a href="#">Responder</a>
                              @endif

                              @endif
                            </div>

                          </div>
                        </div>
                      </article>

                    </section>
                    @endforeach
                  </div>

Controlador, método store:

public function store(Request $request, $post_id)
{

  $this->validate($request, [
  'comment' => 'required'
  ]);
  $post = Post::find($post_id);
  $comment = new Comment();
  $comment->comment   = $request->comment;
  $comment->approved  = true;
  $comment->user_id   =   auth()->id();
  $comment->post_id   = $request->post_id; // only if included
  $comment->save();
  return response()->json(['data'=> $comment->comment, $post->slug], 200);

}

JS:

Primero el código que estoy usando para crear el comentario:

var urlCreate = {{ url('comments/store') }};

$('.send').submit(function(){
  var comentario = $('#add-comment').val();
  $.ajax({
        type:'post',
        url: urlCreate,
        data: {
                comentario: comment,
            },
        success:function(data){
              $('#comment-post').append("<p class='store-comment" + data.comentario + "'>" + data.comentario + "</p>");
        },
          error: function(data){
             alert("Error Submitting Record!");
          }
   });
  });

Ahora para aclarar cualquier duda publicaré el JS que uso para editar los comentarios, lo coloco por las variables creadas y los id's usados:

var urlEdit = '{{ url('comments/update') }}';

$('.edit-comment').click(function(event){
  event.preventDefault();
  divcomment = this.parentNode.parentNode;
  commentId = $("#comment-post", event.target.parentNode.parentNode).data('commentid');
  var commentBody = $(divcomment).find('#display-comment').text();
  $('#comment').val(commentBody);
  $('#edit-comment').modal();
});

$('#modal-save').on('click', function(){
    var $btn = $(this).button('loading');
    var comment = $('#comment').val();
    $(this).button('loading');
    $.ajax({
        method: 'PUT',
        url: urlEdit,
        data: {
            comment: comment,
            commentId: commentId,
            _token: token,
            _method: 'PUT',
         },
        dataType: 'json'
    })
    .done(function (msg){
        if (msg.success === true) {
            $(divcomment).find('#display-comment').text(comment);
        }
        $btn.button('reset');
        $('#edit-comment').modal('hide');
        success('Comentario editado.', '.alert .alert-success', {timeOut: 5000});
    });
});

Esto también pertenece al JS para editar pero lo coloco por acá porque el editor de código no me deja acomodarlo:

var commentId = 0;

var divcomment = null;

Actualmente cuando presiono el boton para crear el comentario me está enviando a localhost:8000/comments/id donde "id" es el número del comentario y me arroja el contenido que se creó de la siguiente manera:

{"data":"controller","0":"intel-anuncia-core-i9-extreme-edition-el-procesador-de-escritorio-mas-extremo-con-18-nucleos"}

De antemano "intel-anuncia-core-i9-extreme-edition-el-procesador-de-escritorio-mas-extremo-con-18-nucleos" es el slug del post donde está el comentario, en la base de datos no se refleja pero me deja en la relación en que post se encuentra el comentario por medio del "post_id".

1 respuesta 1

0

Priemro debes definir la ruta recibira datos con post

Es sencillo solo declara tu ruta de la siguiente manera

Route::post('nombre_de_la_ruta',"tu_controlador_laravel@tu_función");

Despues que hayas definido la ruta tienes que modificar tu funcion en el controlador para recibir los datos

    public function generateReportXML()
    {

    if($_SERVER['REQUEST_METHOD'] == 'POST')
    {
        $data = file_get_contents('php://input'); //Caputura los datos envidos. (recibios)  es un arreglo de datos
        $requestJSON = json_decode($data); // se convierte la cadena a json para poderla manipular.
//$data es el nombre puesto en la consulta
    }
//Esta es la respuesta json
        $response = 
        [
            'status' => true,
            'answer'  => 'El reporte a sido guardado correctamente' 
        ];

        return response()->json($response);
    //}
}

Cuando ya tengas definido tu controlador y tu ruta sigue hacer la consulta.

Laravel exije un token de seguridad para enviar los datos, este token aqui puedes leer mas sobre este token https://laravel.com/docs/5.4/csrf

Lo añades a tu html como un input que no se pueda ver

<input type="hidden" name="_token" value="{{csrf_token()}}"></input>

así ya tendras la validacion de seguridad que exije laravel, y ahora la consulta

Mi ejemplo de consulta sera con http (es un servicio especial de angularjs que hacelo mismo que una peticion ajax, entonces no sera problema para tu proyecto)

 $http({
//Defines el metodo o como se enviara
            method: 'POST',
//la estructura del envio (esto es para definirlo como json)
            dataType: 'JSON',
//Tu url (la que definiste previamente)
            url: 'generateXML',
//Y tus datos, es importante que les des un nombre y que en el controlador lo leas de la misma forma
            data:
            {
//Separas cada dato con una coma, exceptuando el ultimo
                datos: "Hola mundo",
                name: "Como estas?"
            }
        })

Y así ya tienes tu consulta ajax, es importante que definas la ruta en tu archivo Route.php, y que definas la funcion en tu controlador de laravel

Te deseo suerte y si tienes algun problema o errror, no dudes en preguntarme.

Saludos

4
  • 1
    mi ruta la tengo definida de la siguiente manera: Route::post('comments/{post_id}', ['uses' => 'CommentsController@store', 'as' => 'comments.store']); en mi controlador ese método está definido como lo tengo arriba en la pregunta. Dices que debo cambiar el método que tengo en el controlador? Commented el 12 jun. 2017 a las 20:28
  • 1
    Con post no tienes que definir que dato te va a llegar, por lo tanto puedes simplemente hacer esto Route::post('comments',"CommentsController@store"); de esta forma se sabra que la ruta comments hace referencia a controlador Comments y a la funcion de este controlador store En tu caso, mejor crea un nuevo metodo (o funcion) que no reciba ningun parametro, ya que post no recibe parametros por ruta public function nombre_de_funcion() { } y tu ruta definida como Route::post('comments',"CommentsController@nombre_de_funcion"); Commented el 12 jun. 2017 a las 20:45
  • 1
    pero cuando yo coloqué esos parámetros porque yo creaba los comentarios sin ajax.. entonces $post_id y $post->slug hace referencia a que allí específicamente va el comentario.. Cuando hice la relación en los modelos y porque post_id y post_slug son llaves foráneas.. de todas maneras lo que puedo hacer es usar el mismo método pero sin parámetros.. ahora, debería colocarlo así correcto? public function store(Request $request){ } Commented el 12 jun. 2017 a las 20:59
  • 1
    No porque, si envias un dato por post son datos ocultos(que en otras palabras no se envian por medio de rutas o que le usuario pueda verlos) ya que los datos se envian con formato JSON " Datatype : JSON " se debe desencriptar la información. para eso usamos //Se revisa que se recibe los datos por post if($_SERVER['REQUEST_METHOD'] == 'POST') { //Se instancian los datos recibidos $data = file_get_contents('php://input'); //Se desencriptan los archivos para ser manejables $requestJSON = json_decode($data); } Commented el 12 jun. 2017 a las 23:15

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.