javascript - PHP触发从iframe到其他页面的提交

Question

我正在尝试使用 Page1.php 模式中的提交按钮来提交 iframe 内的页面，以触发 Page2.php 的提交按钮。如果执行此操作的最佳方法是什么，我可以寻求帮助吗？

我的提交采用模式的原因是要执行 Page1.php 中的多个函数，而 Page1.php 代码是 dataTable 中按钮的一部分，以防万一您注意到那些单个 (')s

Page1.php

<a class='btn btn-md btn-warning' data-toggle='modal' data-target='#editModal' >View</a>
    <div class='modal fade' id='editModal' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'>
         <div class='modal-dialog' style='width:95%; height:100%'>
                <div class='modal-content' style='height:100%'>
                    <div class='modal-header'>
                    <button type='button' class='close' data-dismiss='modal' aria-hidden='true'>×</button>
                    <h4 class='modal-title' id='myModalLabel'>EDIT HERE</h4>
                    </div>
                    <div class='modal-body'>
                    <iframe src='page2.php' id='info' class='iframe' name='info' seamless='' height='100%' width='100%'></iframe>
                    </div>
                    <div class='col-lg-12' style='text-align: center' ><button type='submit' name='outerSubmit' id='outerSubmit' value='Submit' class='btn btn-lg btn-danger'>SAVE</button></div>
                </div>
        </div>
    </div> 

Page2.php

<form  id="getedit" name="getedit" action="someaction..." method="POST" class="form-horizontal" onSubmit="if(!confirm('Are you sure you want to save changes?')){return false;}"  >
    <div class="col-sm-3">
    <label for="exampleInputtext1">Name:</label>
    <input type="text" class="form-control" id="dogr" value='somename'readonly/>
    </div>

    <div class="col-lg-12" style="text-align: center" ><button type="submit" name="getData" id="getData" value="Submit" class="btn btn-lg btn-danger" hidden>SAVE</button></div>
</form>

我只是想让读者了解整个过程，因为我认为我已经有了正确的代码，但我不知道如何在这种情况下正确应用它。所以这是我的整个功能:

function suysing_search($data)
{


    $sEcho = intval($data["sEcho"]);
    $sSearch = $data["sSearch"];
    $iDisplayStart = intval($data["iDisplayStart"]); //start of record
    $iDisplayLength = intval($data["iDisplayLength"]); //display size
    $pageNum = ($iDisplayStart/$iDisplayLength)+1; //page num
    $colSort = $data['iSortCol_0'];
    $dirSort = strtoupper($data['sSortDir_0']);




    $qString = "CALL suysing_list(";
    $qString .= " " . $colSort . ",";
    $qString .= "'" . $dirSort . "',";
    $qString .= "" . $pageNum . ",";
    $qString .= "" . $iDisplayLength . ",";
    $qString .= "'" . $sSearch . "',";
    $qString .= "" . $sEcho . ")";


    //$res = $this->db->query($qString);
    //$res = $res->result();

    $res = $this->db->query($qString)->result();
    //print_r($res);
    //$res = $res->result();

    $iTotalDisplayRecords   = 0;
    $iTotalRecords          = 0;

    //echo intval($res[0]->TOTAL_ROWS);
    if(count($res) > 0)
    {
        $iTotalDisplayRecords = intval($res[0]->TOTAL_ROWS); //used for paging/numbering; same with iTotalRecords except if there will be search filtering
        $iTotalRecords = intval($res[0]->TOTAL_ROWS); //total records unfiltered
    }

    $output = array(
        "sEcho" => intval($sEcho),
        "iTotalRecords" => $iTotalRecords,
        "iTotalDisplayRecords" => $iTotalDisplayRecords,
        "aaData" => array()

    );

    $countField = "<input type='hidden' name='ctd_count' id='ctd_count' value='".$iTotalRecords."' />";

    //print_r($res);
    setlocale(LC_MONETARY, 'en_PH'); 
    if(count($res) > 0)
    {
        foreach($res as $row)
        {
        $output['aaData'][] = array(
        $row->ref_no,
        "
        <script>
        function sample(){
            alert('Outer submit triggered!');
            window.frames['innerframe'].document.forms['getedit'].submit();
            }
        </script>                           
        <a class='btn btn-md btn-warning'  data-toggle='modal' data-target='#editModal".$row->ref_no ." ' >View</a>

        <div class='modal fade' id='editModal". $row->ref_no ."' tabindex='-1' role='dialog' aria-labelledby='myModalLabel' aria-hidden='true'>

        <div class='modal-dialog' style='width:95%; height:100%'>
        <div class='modal-content' style='height:100%; '>

        <div class='modal-header'>
        <button type='button' class='close' data-dismiss='modal' aria-hidden='true'>×</button>
        <h4 class='modal-title' id='myModalLabel'>EDIT HERE</h4>
        </div>
        <div class='modal-body' style='background:url(".base_url()."images/animal.gif) center center no-repeat; height:85%'>
        <iframe id='innerframe' src='".base_url()."index.php/suysing/view_profile/".$row->ref_no."/a/ASHAJSHAKS'class='iframe' name='innerframe'  seamless='' height='100%' width='100%'></iframe>
        </div>
        <div class='col-lg-12' style='text-align: center'><button name='outerSubmit' id='outerSubmit' class='btn btn-lg btn-danger' onClick='sample();'>SAaaaaaVE</button></div>

        </div>
        </div>
        </div> 
        "
        );
        }
    }
    echo json_encode($output);
}

Answer 1

实现此目的的一种方法是仅使用 javascript 将 JavaScript 函数添加到 page1.php，该函数将在 page2.php 上提交表单。将此代码添加到 page1.php 的顶部

<script type="text/javascript">
function sumbit_up_form()
{
    window.frames["info"].document.forms["getedit"].submit();
}
</script> 

然后修改 page1.php 上的按钮以在单击时运行该功能:

<button type='submit' name='dateData' id='dateData' value='Submit' class='btn btn-lg btn-danger' onclick='sumbit_up_form();'>SAVE</button>

而不是

<button type='submit' name='dateData' id='dateData' value='Submit' class='btn btn-lg btn-danger'>SAVE</button>

编辑——添加

如果您希望使用 jquery 脚本来实现此功能，请使用:

window.frames["info"].document.forms["getedit"].submit();

而不是

$('#info').contents().find('#getData input[type="submit"]').click();

代码工作原理分解:

window. 是对浏览器窗口对象的引用。为了使此代码正常工作，Page1.php 需要成为浏览器窗口中的顶部文档。如果 Page1.php 本身位于 iframe 中，那么您需要引用 iframe 或将 window. 排除在代码之外。但是，忽略窗口可能会使您的网站/应用更容易被劫持。

frames["info"]. 是使用 name 属性对 iframe 对象的引用。

document. 是对 iframe 内文档的引用。

forms["getedit"]. 是使用 name 属性对 form 对象的引用。如果您更喜欢使用 ID，请改用 getElementById("getedit").。 注意: 在 XHTML 中，name 属性已被弃用。请改用 id 属性。

submit() 调用 form 对象的提交方法。