2017-03-04 18 views
0

iframeにフォームを取り込もうとしています。私はテキストボックスに値を入力し、ドロップダウンメニューから値を選択する必要があります。asp.net javascript getelementbyid in iframe

WebForm1に

<!DOCTYPE html>  
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 

    <script src="admin-lte/js/app.min.js"></script> 
    <script src="Scripts/jquery-2.1.3.min.js"></script> 

</head> 
<body> 
    <style type="text/css"> 
    body {scrolling:no; 
} 
    iframe {position:absolute; 
    z-index:1; 
    top:0px; 
    left:0px; 
} 
</style> 
    <form id="form1" runat="server"> 

    <iframe id="frame1" src="WebForm4.aspx" width="100%" height="100%" frameborder="0"> 
</iframe> 

    <script> 
     function getElementWithinIframe() { 


      var iframe = document.getElementById('frame1'); 
      var innerDoc = (iframe.contentDocument) ? iframe.contentDocument : iframe.contentWindow.document; 

      var quantity = innerDoc.getElementById("txtQuantity"); 
      quantity.value = "5"; 

      var submit = innerDoc.getElementById("btnQuantity"); 
      submit.click(); 
     } 
    </script> 

    </form> 
</body> 
</html> 

webform4

<!DOCTYPE html> 

<html xmlns="http://www.w3.org/1999/xhtml"> 
<head runat="server"> 
    <title></title> 
</head> 
<body> 
    <form id="form1" runat="server"> 
    <div> 

     <asp:DropDownList ID="ddlProd" runat="server"> 
      <asp:ListItem>Product1</asp:ListItem> 
      <asp:ListItem>Product2</asp:ListItem> 
      <asp:ListItem>Product3</asp:ListItem> 
      <asp:ListItem>Product4</asp:ListItem> 
      <asp:ListItem>Product5</asp:ListItem> 

     </asp:DropDownList> 
     <asp:TextBox ID="txtQuantity" runat="server"></asp:TextBox> 

     <asp:Button ID="btnSubmit" runat="server" Text="Submit" /> 

    </div> 
    </form> 
</body> 
</html> 

これは動作しません。私は何が欠けていますか?

私は複数の記事を見てきましたが、私はそれを得ていないと思います。

Javascript - Get element from within an iFrame

How to pick element inside iframe using document.getElementById

すべてのヘルプは高く評価されます。

- JavaScriptで おかげ

答えて

0

WebForm4.aspxでボタンがID btnSubmitを有しているあなたは、btnQuantityを使用し、親インチそのため、スクリプトを次のように変更してください:

var submit = innerDoc.getElementById("btnSubmit"); 

ボタンをクリックするか、ページの読み込み時に関数を呼び出してください。

<input type="button" onclick="getElementWithinIframe()" value="ClickMe"> 

<script> 
    $(document).ready(function() { 
     setTimeout(function() { getElementWithinIframe(); }, 250); 
    }); 
</script> 
+0

これは私の間違いでした。しかしそれでも動作しません。私はあなたが言及したようにスクリプトを変更しました。テキストボックス(txtQuantity)にデータが入力されていません。 –

+0

私のテスト環境で動作します。 'WebForm4'のコードの中の' txtQuantity'の内容をクリアしますか?あなたはフォームポストをやっているかもしれません。 – VDWWD

+0

そして 'getElementWithinIframe'をどこかで呼び出さなければなりません。 – VDWWD