C# と VB.NET の質問掲示板

ASP.NET、C++/CLI、Java 何でもどうぞ

C# と VB.NET の入門サイト

Re[2]: onsubmit時にボタンを無効化する


(過去ログ 102 を表示中)

[トピック内 3 記事 (1 - 3 表示)]  << 0 >>

■61161 / inTopicNo.1)  onsubmit時にボタンを無効化する
  
□投稿者/ とら (1回)-(2011/08/04(Thu) 13:08:41)

分類:[ASP.NET (C#)] 

はじめまして。

ASP.NET + javascript + C#

OnSubmit時にボタンを無効化するようにしたいのですが、有効化されたままになります。
alertウィンドウが表示されている時は無効化されているのが確認できたのですが、実行終了時に有効化されているようです。

質問は2つです。
1.この挙動はコード通りの挙動なのでしょうか?
2.OnSubmit時にボタンを無効化するにはどうしたらよいのでしょうか。

ご教授お願いします。


WebForm1.aspx
---------------------------------------------------------------------------
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication4.WebForm1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<script type="text/javascript">
    function Form1_OnSubmit() {
        //alert("Good Day");
        var btn = document.getElementById('Button1');
        btn.disabled = true;
        alert('Disabled button1');
    }
</script>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Sample: OnSubmit Behavior</title>
</head>
<body>
    <form id="form1" runat="server" onsubmit="Form1_OnSubmit()" >
    <div>
        <asp:Button ID="Button1" runat="server" Text="Click ME!" />
    </div>
    </form>
</body>
</html>
---------------------------------------------------------------------------


WebForm1.aspx.cs
---------------------------------------------------------------------------
using System;

namespace WebApplication4
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {

        }
    }
}
---------------------------------------------------------------------------

引用返信 編集キー/
■61162 / inTopicNo.2)  Re[1]: onsubmit時にボタンを無効化する
□投稿者/ やじゅ (1936回)-(2011/08/04(Thu) 13:30:14)
やじゅ さんの Web サイト
2011/08/04(Thu) 13:33:32 編集(投稿者)

No61161 (とら さん) に返信
> OnSubmit時にボタンを無効化するようにしたいのですが、有効化されたままになります。

それって単純に画面が更新されたからじゃないですかね。
画面更新後にSubmitボタンを無効化するようにする必要があるのでは?
http://d.hatena.ne.jp/YokoKen/20081028/1225168779
引用返信 編集キー/
■61174 / inTopicNo.3)  Re[2]: onsubmit時にボタンを無効化する
□投稿者/ とら (2回)-(2011/08/04(Thu) 14:33:21)
No61162 (やじゅ さん) に返信
> 2011/08/04(Thu) 13:33:32 編集(投稿者)
> 
> ■No61161 (とら さん) に返信
>>OnSubmit時にボタンを無効化するようにしたいのですが、有効化されたままになります。
> 
> それって単純に画面が更新されたからじゃないですかね。
> 画面更新後にSubmitボタンを無効化するようにする必要があるのでは?
> http://d.hatena.ne.jp/YokoKen/20081028/1225168779

やじゅさん、ありがとうございます。
上記のサイトを参考に実現することができました。

WebForm1.aspx
---------------------------------------------------------------------------
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="WebApplication4.WebForm1" %>

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title>Sample: OnSubmit Behavior</title>
    <script type="text/javascript">
        window.onload =
        function () {
            function protect() {

                var btn = document.getElementById("Button1");
                btn.value = "in progress";
                btn.disabled = true;

                var lbl = document.getElementById("Label1");
                lbl.innerText = "you clicked button1";

                for (var i = 0; i < document.forms.length; i++)
                {
                    document.forms[i].onsubmit = function() { return false; };
                }
            }
        
            for (var i = 0; i < document.forms.length; i++)
            {
                document.forms[i].onsubmit = function() { setTimeout(protect, 0); };
            }

        };
</script>
</head>
<body>
    <form id="form1" runat="server" >
    <div>
        <asp:Button ID="Button1" runat="server" Text="Click ME!" 
        onclick="Button1_Click"
             />
        &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;
        <asp:Label ID="Label1" runat="server" Text="Label"></asp:Label>
    </div>
    </form>
</body>
</html>
---------------------------------------------------------------------------

WebForm1.aspx.cs
---------------------------------------------------------------------------
using System;

namespace WebApplication4
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            if (!IsPostBack)
            {
                Button1.Enabled = true;
                Button1.Text = "Load at First Time";
            }
            else
            {
                Button1.Enabled = true;
                Button1.Text = "Load by Postback";
            }
        }

        protected void Button1_Click(object sender, EventArgs e)
        {
            System.Threading.Thread.Sleep(5000);
        }
    }
}
---------------------------------------------------------------------------

解決済み
引用返信 編集キー/


トピック内ページ移動 / << 0 >>

このトピックに書きこむ

過去ログには書き込み不可

管理者用

- Child Tree -