如何在cakephp 3.1中渲染ajax返回

Question

I have a table that have checkboxes inside. after select it how to return a sum of values from table in modal before confirm the form? and how to render the ajax response from controller? in my view

    $("#envia-vendas").ajaxForm({
  url: '../vendas/confirmar', 
  type: 'post', 
  success: function (data) {
    $('#myModal').modal('show');
    console.log(data);
  },

in my controller

//dostuf
            if($this->request->is('ajax')){
              $sum = $sum;
              $this->render('ajax/confirmado', 'ajax');
              echo 'bal';
              $this->set('text', 'test');
              $this->set('_serialize', ['text']);

            }

how to print the result in the view without reloading page?

Answer 1

What this fiddle does is grabs all of your inputs, then pops up a modal after the values and names have been injected for confirmation.

It should give you a good starting point. What this is setup to do is give you the confirmation screen without the need for additional server calls.

Just set your action to the route that you want to pass the information to for server interactions.

HTML

<form id="test-form" method="post" action="your/action/here">
  <input type="text" name="test" value="" />
  <input type="submit" name="submit-form" value="submit" />
</form>

<div class="modal">
  <div class="form-info-wrapper">

  </div>
  <a class="confirm">Confirm Information</a>
</div>

CSS

.modal {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  display: none;
  background: #FFF;
}

JS

jQuery(document).ready(function ($){
    $('body').on('click', 'input[type=submit]', function (e) {
    e.preventDefault();

    var data = $(this).parent('form').serializeArray();

    $('.form-info-wrapper').empty();

    for(_data in data)
    {
        $('.form-info-wrapper').append(data[_data].name + ': ' + data[_data].value);
    }

    $('.modal').fadeIn();
  });

  $('.confirm').click(function (e){
        e.preventDefault();

    $('#test-form').submit();
  });
});

https://jsfiddle.net/ojaeacps/2/