如何跨表單執行按鈕即傳送值

pkko
各位大大好,想請教以下兩個問題

相同的環境都是建立在我有A.aspx的網頁和B.aspx 的網頁

問題1:如何在B.aspx的網頁按下按鈕之後,可以關閉B網頁並且執行A.aspx網頁的button1.click事件?
關閉網頁我目前使用沒問題(Response.Write("<script>window.opener=null;window.close();</script>"))

問題2:如何將B網頁上的textbox1.text傳送到 A 網頁的 textbox2.text?

缺氧的羊:窒息
問題一

在A網頁寫一個javascript的 function myclick() { ..按下按鈕.. }

在B網頁先輸出 window.opener.myclick();
再輸出 window.close();
(window.opener=null; 這一行在新版的瀏覽器中已經沒有用處了)
======================================

問題二
在A網頁寫一個 javascript的 function mysetvalue(tvalue) { ...把tvalue寫入至 textbox2.text }

在B網頁輸出 window.opener.mysetvalue( textbox1.text的值 )

======================================

大概就這樣吧
MIS2000 Lab
關於「問題2」

ASP.NET (Web Form)有 "跨網頁張貼"
不需寫 JavaScript就能做到,您也可以參考一

https://dotblogs.com.tw/mis2000lab/2008/05/26/4123

影片介紹 https://youtu.be/lZqf8DfRyqs
pkko
感謝大大
第一種方式
我嘗試了以下兩種語法都失敗,請問大大我哪邊錯了= =
Response.Write("<script>Window.opener.Button1_Click();</script>")
Response.Write("<script>Window.Button1.Click();</script>")

真的有點難
最簡單的方式 在網頁上放一個panel 把開窗的那頁的控制項 全部放在panel內
點開窗其實就是 panel.visual= true 平常 panel.visual= false 這樣就不用傳值了
pkko
感謝4樓大大回復如此聰明的方式
但平常panel要放在哪邊排版?
因為當它=true的時候位置應該是固定的,若不是跳出一個視窗會有點奇怪
我也想到一個方式就是同一個畫面,裡面有A和B兩個,正常操作A,要輸入日期或是金額等等將B=true, A=false 但這種版面在webform我不知道怎麼調= =
缺氧的羊:窒息
問題一,
Button1_Click(), 是你後台的程式碼, 跟前台的javascript無關,

如果你的頁面有使用jquery的話,

你應該要在 A網頁 加上
<script> function myclick() { $('#Button1').click(); } </script>

然後在B網頁
Response.Write("<script>window.opener.myclick();</script>")

這樣才能讓B網頁去按下A網頁的Button1


topcat
小喵個人好奇
您區分成B.aspx要開啟並送資料Post給A.aspx

有沒有想過把這樣的東西寫在同一頁
同一頁會好做、好維護很多

^.^a
topcat
如果沒有特別的原因必須要分兩頁操作撰寫

其實把兩個頁面寫在同一頁,控制就會容易許多
小喵做個小小的範例如下:
小喵用Boostrap的Modal來模擬A.aspx的情況

aspx
<%@ Page Language="VB" AutoEventWireup="false" CodeFile="TwoToOne.aspx.vb" Inherits="TwoToOne" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/css/bootstrap.min.css" integrity="sha384-GJzZqFGwb1QTTN6wy59ffF1BuGJpLSa9DkKMp0DgiMDm4iYMj70gZWKYbI706tWS" crossorigin="anonymous" />
    <title></title>
</head>
<body>
    <form id="form1" runat="server">
        <div class="container">
            <div class="row">
                <div class="col-2"></div>
                <div class="col-8">
                    原有的B.aspx的Input:
                    <asp:TextBox ID="txtB" runat="server" CssClass="form-control"></asp:TextBox>
                    <asp:Button ID="btnOpenAndSend" runat="server" CssClass="btn btn-primary" Text="開啟並且傳送給A" />
                </div>
                <div class="col-2"></div>
            </div>
        </div>

        <div id="divModal" runat="server" visible="false" class="modal show" tabindex="-1" role="dialog">
            <div class="modal-dialog" role="document">
                <div class="modal-content">
                    <div class="modal-header">
                        <h5 class="modal-title">Modal title</h5>
                    </div>
                    <div class="modal-body">
                        原本A.aspx的Input:
                        <asp:TextBox ID="txtA" runat="server" CssClass="form-control"></asp:TextBox>
                    </div>
                    <div class="modal-footer">
                        <asp:Button ID="btnSend" runat="server" Text="送出" CssClass="btn btn-primary" />
                        <asp:Button ID="btnClose" runat="server" Text="關閉" CssClass="btn btn-secondary" />
                    </div>
                </div>
            </div>
        </div>

    </form>
    <script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.6/umd/popper.min.js" integrity="sha384-wHAiFfRlMFy6i5SRaxvfOCifBUQy1xHdJ/yoi7FRNXMRBu5WHdZYu1hA6ZOblgut" crossorigin="anonymous"></script>
    <script src="https://stackpath.bootstrapcdn.com/bootstrap/4.2.1/js/bootstrap.min.js" integrity="sha384-B0UglyR+jN6CkvvICOB2joaf5I4l3gm9GU6Hc1og6Ls7i6U/mkkaduKaBhlAXv9k" crossorigin="anonymous"></script>
    <script>
        $(function () {
            let divModal = $('#<%=divModal.ClientID%>');
            if (divModal) {
                divModal.modal({
                    'show': true,
                    'keyboard': false,
                    'backdrop': false
                });
            }
        });
    </script>
</body>
</html>


aspx.vb

Partial Class TwoToOne
    Inherits System.Web.UI.Page

    Protected Sub btnOpenAndSend_Click(sender As Object, e As EventArgs) Handles btnOpenAndSend.Click
        txtA.Text = txtB.Text & "-" & Now.ToShortDateString
        divModal.Visible = True
    End Sub

    Private Sub btnClose_Click(sender As Object, e As EventArgs) Handles btnClose.Click
        divModal.Visible = False
    End Sub
End Class


後端程式碼的邏輯相當簡單
只需要控制divModal的顯示與隱藏
傳送的時候讓Modal顯示

另外,Client端的Script是查一下是否有Modal存在
有存在就執行Script讓它顯示、並且鎖定旁邊的點選(點選旁邊不要關閉Modal)

樓主可以試試看

^.^a
P陳
不是可以用 Session 來存取嗎?
pkko
感謝九樓的大大
我是webform新手
不知道SESSION怎麼用....還請開示一下
topcat
Session是很寶貴的資源
小喵我個人是除非必要(例如安全性的資料),盡量避免用Session

^.^a

最有價值解答

真的有點難
你把本頁的控制項包在一個panel 開窗的控制項包在另外的panel

當你按按鈕 本頁的panel visual false 開窗的true
開窗輸入完畢後 把visual的屬性反之

panel 可以用絕對位置
<asp:Panel ID="Panel1" runat="server" style="z-index: 1; left: 508px; top: 226px; position: absolute; height: auto; width: auto; background-color: #FFCCFF" Visible="false">
</asp:Panel>
pkko
感謝12樓的大大,我成功了,超簡單的方式!!!
topcat
小喵8F的完整範例就是12樓所說的
甚至差不多複製貼上就可以執行了
不知道樓主是否有嘗試過

下次小喵還是簡單回一回就好
Orz...
topcat
小喵#8所貼的
不知道樓主是否有測試過

透過BootStrap畫面會更貼近於類似開視窗(對話窗)的感覺
原理就同#12一樣

程式碼幾乎完整放上
適當的複製貼上應該就可以跑了

^.^a
pkko
感謝topcat 版主大大的辛苦回覆
針對#8的部分

因為小弟不才...撰寫的方式不是用MVC 架構,也不是用html+CSS+javascript的方式撰寫
自然也不懂如何使用Boostrap...

我是用最簡單的ASP.net 的webform方式撰寫
所以您辛苦提供的方式
小弟研究了一番還是無法使用= =
真是非常抱歉
但您的努力
在未來小弟進步之後,再回來看這篇,應該就可以看懂了!!!
非常感謝您^_^
topcat
小喵提供的是WebForm唷
不是MVC

看副檔名
WebForm檔是aspx
WebForm的CodeFile : aspx.cs

Bootstrap與MVC無絕對關係
只要是網頁,無論是WebForm, MVC, Php, jsp, html都可以使用

他是響應式網頁的套件
可以讓你透過Bootstrap所設定的css class就可以很簡單地把【網頁】變成【響應式網頁】

只要是您寫網頁,值得您花時間學一下

https://bootstrap.hexschool.com/docs/4.2/getting-started/introduction/

如果您對html與css有概念
小喵估計大約一兩天就可以基本上手
如果再加上套用Bootswatch所提供的範例
https://bootswatch.com/

更可以大幅縮短使用上手的時間

加油
^_^
pkko
原來如此
感謝版主大大
小弟一定會花時間拜讀
再次感謝!!!

也感恩版主大大原諒小弟的愚昧...
topcat
再補充
Youtube上面有很多的教學
例如這個
https://www.youtube.com/watch?v=1clu-Kmd_dg&list=PLrGkYTMKtIQtphNmmo_yOfS0DtlrFkr7m

除了以上這個,還有很多,搜尋關鍵字【Bootstrap 4】
回到頂部