使用jquery在cakephp 3.5的索引页面中提交弹出表单

时间:2018-06-28 06:34:37

标签: jquery html cakephp cakephp-3.0

我必须在索引行的每一行中创建一个弹出按钮,并且必须在弹出窗口中提交表单。在下面的代码中,弹出式窗口针对每一行打开,并提交表单,但针对每一行,相同的ID正在更新。我已经隐藏了id输入字段。 如何使用jquery更改CakePHP 3.5中每一行的ID?

          <table id="example2" class="table table-bordered table-hover">
            <thead>
              <tr>
                <th><?= __('Actions') ?></th>
              </tr>
            </thead>
            <tbody>
            <?php foreach ($purchaseRequisition as $purchaseRequisition): ?>
              <tr class="sentrecord">                               
                <td>
                 <?php 
             echo $this->Html->link(__('', true), array("action"=>"rejectmr"), array("class"=>"overlay fa fa-thumbs-down fa-fw", "title"=>"Reject"));

                    ?>
<div class="dialogModal">
 <!-- the external content is loaded inside this tag -->
            <?php 
       echo $this->Form->create($purchaseRequisition, ['role'=>'form','url' => ['action' => 'rejectmr']]);

           echo $this->Form->input('id',array("class"=>'inputId','label'=>"Rejection Remark",'style'=>'width: 100%;'));

           echo $this->Form->input('manager_rej_remark',array('label'=>"Rejection Remark",'style'=>'width: 100%;'));

          echo $this->Form->button(__('Save'));
          echo $this->Form->end();
           ?>
          <div class="contentWrap"></div>
        </div>
                  </td>
              </tr>
            <?php endforeach; ?>
            </tbody>
          </table>
          <script>
          $(document).ready(function(){
            $(".sentrecord").each(function(){
           var sentRec = $(this);
     // $(this).find(".checkboxSel").click(function(){

            //prepare the dialog

            //respond to click event on anything with 'overlay' class
            $(this).find(".overlay").click(function(event){
                event.preventDefault();

                $(sentRec).find(".dialogModal").dialog({
                    autoOpen: false,
                    show: {
                        effect: "blind",
                        duration: 500
                        },
                    hide: {
                        effect: "blind",
                        duration: 500
                        },
                    modal: true
                    });             

                var qty = $(sentRec).find("#test").val();
                $(sentRec).find(".inputId").val(qty);
                alert(qty);
                $('.contentWrap').load($(this).attr("href"));  //load content from href of link
              //  $('.dialogModal').dialog('option', 'title', $(this).attr("title"));  //make dialog title that of link
                $('.dialogModal').dialog('open');  //open the dialog
                });


    //  });    

}); 

});

1 个答案:

答案 0 :(得分:0)

ID必须是唯一的,您对所有对话框元素都使用相同的dialogModal ID,因此,通过jQuery定位时,您始终会以该ID的首次出现为目标。

请改用一个类,并将其作为sentrecord元素的后代,例如

<div class='modal'><!-- ... --></div>
sentRec.find('.modal').dialog(/* ... */);

与目标contentWrap类似,它是一个类,而不是ID。