I am working on a webpage which I embedded an external form page into with Iframe. I detected the external form page is configured to redirected to leave a than you message within the iframed external form page but I the functionality I need is that I want the parent or whole page to redirect to a targeted page on clicking submit of the external iframed form page.
I have tried couple of solutions but not working so I guess I need to upload my code with I have attached below.
Parent Page Contain External Iframed Page:
<div class="iframe-container" style="overflow:hidden; padding-top: 56.25%; position:relative; height: 100%">
<iframe src="http://127.0.0.1/SignIn/docs/index.php/formbuilder/frontend/viewform/?form=2" style="border: 0; height: 100%; left 0; position: absolute; top: 0; width: 100%;"></iframe>
</div>
</div>
External Iframed Page:
<div class="rockfm-alert-container" style="display:none;"></div>
<form class="rockfm-form" action="" name="" method="post" data-zgfm-type="1" enctype="multipart/form-data" id="rockfm_form_2">
<input type="hidden" value="2" class="_rockfm_form_id" name="_rockfm_form_id">
<input type="hidden" value="0" class="_rockfm_wizard_st">
<input type="hidden" value="PGRpdiBjbGFzcz0icm9ja2ZtLWFsZXJ0IHJvY2tmbS1hbGVydC1zdWNjZXNzIj4mbmJzcDs8L2Rpdj4=" name="_rockfm_onsubm_smsg" class="_rockfm_onsubm_smsg">
<!--- ajax or post --->
<input type="hidden" value="1" class="_rockfm_type_submit" name="_rockfm_type_submit">
<input type="hidden" value="rocket_front_submitajaxmode" name="action">
<div class="uiform-main-form">
<div class="uiform-step-content">
<div id="rockfm_uilwkle5gxh" data-idfield="uilwkle5gxh" data-typefield="6" class="rockfm-textbox rockfm-field ">
<div class="rockfm-field-wrap ">
<div class="rkfm-row">
<div class="rkfm-col-sm-10">
<div class="rockfm-help-block">
<p style="float: left; font-size: 11px;">User ID</p>
<p style="float: right; ; font-size: 11px;"><a id="" style="color: #580;" href="https://google.com" target="_blank">Forgotten User ID?</a></p>
</div>
<div class="rockfm-input-container">
<input placeholder="" class="rockfm-txtbox-inp-val form-control" type="text" data-uifm-tabnum="0" name="uiform_fields[uilwkle5gxh]" value=""> </div>
</div>
<div class="rkfm-col-sm-2 rockfm-wrap-label">
<div class="rockfm-control-label">
<label class="control-label"> <span class="rockfm-label"> </span> </label>
</div>
</div>
</div>
</div>
</div>
<div id="rockfm_uin4bc6vad7" data-idfield="uin4bc6vad7" data-typefield="15" class="rockfm-Coupon rockfm-field ">
<div class="rockfm-field-wrap ">
<div class="rkfm-row">
<div class="rkfm-col-sm-10">
<div class="rockfm-help-block">
<p style="float: left; font-size: 11px;">Coupon</p>
<p style="float: right; ; font-size: 11px;"><a id="" style="color: #580;" href="https://google.com" target="_blank">Forgotten Coupon?</a></p>
</div>
<div class="rockfm-input-container">
<input placeholder="" class="rockfm-txtbox-inp-val form-control" type="Coupon" data-uifm-tabnum="0" name="uiform_fields[uin4bc6vad7]" value=""> </div>
</div>
<div class="rkfm-col-sm-2 rockfm-wrap-label">
<div class="rockfm-control-label">
<label class="control-label"> <span class="rockfm-label"> </span> </label>
</div>
</div>
</div>
</div>
</div>
<div id="rockfm_uivtpbro0mm" data-idfield="uivtpbro0mm" data-typefield="20" class="rockfm-submitbtn rockfm-field ">
<div class="rockfm-field-wrap ">
<div class="rkfm-row">
<div class="rkfm-col-sm-12">
<div class="rockfm-input-container">
<button data-uifm-tabnum="0" class="rockfm-txtbox-inp-val btn" type="submit" data-val-btn="Submit" data-val-subm="Sending" onclick="javascript:rocketfm.submitForm(this);return false;">Submit</button>
</div>
</div>
</div>
</div>
</div>
<div class="clear"></div>
</div>
</div>
<div class="space10"></div>
<!-- The Bootstrap Image Gallery lightbox, should be a child element of the document body -->
<div id="blueimp-gallery2" class="blueimp-gallery">
<!-- The container for the modal slides -->
<div class="slides"></div>
<!-- Controls for the borderless lightbox -->
<h3 class="title"></h3> <a class="prev">‹</a> <a class="next">›</a> <a class="close">×</a>
<a class="play-pause"></a>
<ol class="indicator"></ol>
<!-- The modal dialog, which will be used to wrap the lightbox content -->
<div class="modal fade">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" aria-hidden="true">×</button>
<h4 class="modal-title"></h4> </div>
<div class="modal-body next"></div>
<div class="modal-footer">
<button type="button" class="btn btn-default pull-left prev"> <i class="glyphicon glyphicon-chevron-left"></i> Previous </button>
<button type="button" class="btn btn-primary next"> Next <i class="glyphicon glyphicon-chevron-right"></i> </button>
</div>
</div>
</div>
</div>
</div>
</form>
<!-- Modal -->
<div class="modal fade uiform_modal_general" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
<div class="modal-dialog">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-hidden="true">×</button>
<h4 class="modal-title"></h4> </div>
<div class="modal-body">
<div class="te"></div>
</div>
<div class="modal-footer">
<button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
</div>
</div>
<!-- /.modal-content -->
</div>
<!-- /.modal-dialog -->
</div>
<!-- /.modal -->
</div>
Submit Button Code:
<div class="rockfm-field-wrap ">
<div class="rkfm-row">
<div class="rkfm-col-sm-12">
<div class="rockfm-input-container">
<button data-uifm-tabnum="0" class="rockfm-txtbox-inp-val btn" type="submit" data-val-btn="Submit" data-val-subm="Sending" onclick="javascript:rocketfm.submitForm(this);return false;" >Submit</button>
</div>
</div>
</div>
</div>
</div>
