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

■No97929 (WebSurfer さん) に返信

> それはどのようにしたのですか？ 送信するデータをどのように取得したのか、クライアント
> スクリプトのコードがどうなっているか書いてください。

*** Javascript1 ***

$(function () {
    var clickSave = function (e) {
        var formData = new FormData($form[0]);
        var target = {
            Cmn_ScreenName: 'MarcheEntry',
            Cmn_FunctionName: $('#Hf_TargetId').val() ? 'Update' : 'Register'
        };
        var param = $.extend(target, getParam());

        $.each(param, function (index, val) {
            formData.append(index, val);
        });

        //Javascript2共通関数取得
        sendFileToServer(formData, successRegFunc, function (res) { console.log("failure"); });
    };
    $("#保存ボタン").on('click', function () {
        $form = $(this).parents('form:first');
        showConfirm(GetMessage("CCom001", new Array("画面")), clickSave);
    });
});

function getParam() {
    var param = {
        Hf_TargetId: $("#Hf_TargetId").val(),
        Txt_Marche: $("#Txt_Marche").val()
    };
    return param;
}

*** Javascript2(共通関数) ***
function sendFileToServer(formData, successFunc, failureFunc) {
    var uploadURL = "../Common/Cmn_Handler.ashx"; //Upload URL
    var jqXHR = $.ajax({
        url: uploadURL,
        type: "POST",
        contentType: false,
        processData: false,
        cache: false,
        async: false,
        data: formData,
        dataType: 'html',
        success: function (data) {
            var response = JSON.parse(data);

            var d = $("#dialog").dialog({ autoOpen: false });

            if (response.Messages) {
                d.html(response.Messages.join("<br>"));

                d.dialog({
                    modal: true,
                    title: response.Title,
                    width: 450,
                    buttons: {
                        "確認": function () {
                            $(this).dialog("close");

                            if (response.Result) {
                                if (successFunc) {
                                    successFunc(response);
                                }
                            } else {
                                if (failureFunc) {
                                    failureFunc(response);
                                }
                            }
                        }
                    }

                });
                d.dialog("open");
            }
            else {

                if (response.Result) {
                    if (successFunc) {
                        successFunc(response);
                    }
                } else {
                    if (failureFunc) {
                        failureFunc(response);
                    }
                }
            }
        },
        error: function (data) {
            var d = $("#dialog").dialog({ autoOpen: false });
            d.html("サーバ接続時にエラーが発生しました <br>");
            d.dialog({
                modal: true,
                title: "接続エラー",
                width: 450,
                buttons: {
                    "確認": function () { $(this).dialog("close"); }
                }

            });
            d.dialog("open");

        }
    });

> なんでそれが「配列」だと思うのですか？

すみません、単純にカンマ区切りでしたので配列だと思っていました…。

> それはともかくとして、ashx 側でそれらをどのように取得してどのように確認したのか、
> 質問者さんが書いたコードを提示して説明してください。

    Private Function dataEntry(ByVal Context As HttpContext, ByVal FunctionName As String) As AjaxResponse
        '返却用
        Dim Response As New AjaxResponse
        Response.Result = False

        Dim Cnt_dataAs New Cnt_data
        Dim targetId As String = Nothing
        Dim isSuccess As Boolean = False
        Dim retDic As New Dictionary(Of String, String)

        Try
            '処理名で処理を振り分け
            Select Case FunctionName
                Case Cmn_Const.FUNC_REGISTER, Cmn_Const.FUNC_UPDATE

                    Dim data As String = Context.Request.Params("Hf_TargetId")
                    Dim Txtdata As String = Context.Request.Params("Txt_Marche")
            End Select

        Catch ex As Exception
            log.Error(ex.Message)
            Response.Result = False
            Response.Messages = New List(Of String)(New String() {ex.Message})
        End Try
        Return Response
    End Function 



長文になってしまいすみません。
宜しくお願い致します。

■No97938 (???? さん) に返信

話が通じなくてラチがあかないので、ここまで書けばわかるだろうということを書いておきます。

以下のコードで［POST] ボタンをクリックすると、質問者さんがやったのとほぼ同様に jQuery ajax
を使って 2 つのテキストボックスの value が送信されます。value に "a", "14" が設定済みなのに
注意。fd.append(...) がコメントアウトしてあるところにも注意。

<%@ Page Language="C#" AutoEventWireup="true" 
    CodeBehind="WebForm20.aspx.cs" 
    Inherits="WebApplication1.WebForm20" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <script src="Scripts/jquery-3.4.1.js"></script>
    <script type="text/javascript">
        //<![CDATA[
        $(function () {
            $('#ajaxPost').on('click', function (e) {
                var fd = new FormData(document.querySelector("form"));

                //fd.append("Hf_TargetId", "a");
                //fd.append("Txt_Marche", "14");

                $.ajax({
                    url: '/myapp/ajaxposthandler.ashx',
                    method: 'post',
                    data: fd,
                    processData: false,
                    contentType: false
                }).done(function (response) {
                    $("#result").empty;
                    $("#result").text(response);
                }).fail(function (jqXHR, textStatus, errorThrown) {
                    $("#result").empty;
                    $("#result").text('textStatus: ' + textStatus +
                        ', errorThrown: ' + errorThrown);
                });
            });
        });
        //]]>
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <h1>POST by jQuery ajax</h1>
        <input id="Hf_TargetId" name="Hf_TargetId" type="text" value="a" />
        <input id="Txt_Marche" name="Txt_Marche" type="text" value="14" />
        <input id="ajaxPost" type="button" value="POST" />
        <div id="result"></div>
    </form>
</body>
</html>

Fiddler で要求をキャプチャすると以下のようになります。name が Hf_TargetId および Txt_Marche
の値をみてください。期待通り a と 14 が送信されている点に注目。


POST https://localhost:44364/myapp/ajaxposthandler.ashx HTTP/1.1
Host: localhost:44364
Connection: keep-alive
Content-Length: 563
・・・中略・・・
Accept-Language: ja,en-US;q=0.9,en;q=0.8,de;q=0.7

------WebKitFormBoundarytZhyclsKu5e6ksnm
Content-Disposition: form-data; name="__VIEWSTATE"

5D7jXYvhFvOqzAXeQ9Fhx6EZQH4YNXu1IpYJfdF6lv0e1Co7QhFQvebPCBzep0Gm3poGqNRLkxf/jI1yz2PHo9cupCkPckCVknXSZx8ii10=
------WebKitFormBoundarytZhyclsKu5e6ksnm
Content-Disposition: form-data; name="__VIEWSTATEGENERATOR"

B928ED7D
------WebKitFormBoundarytZhyclsKu5e6ksnm
Content-Disposition: form-data; name="Hf_TargetId"

a
------WebKitFormBoundarytZhyclsKu5e6ksnm
Content-Disposition: form-data; name="Txt_Marche"

14
------WebKitFormBoundarytZhyclsKu5e6ksnm--


上の aspx のコードの fd.append(...) のコメントアウトを解除して同じことを行うと name が
Hf_TargetId および Txt_Marche の部分は以下のようにダブります。


------WebKitFormBoundaryudm7lpE3oJMs1sMc
Content-Disposition: form-data; name="Hf_TargetId"

a
------WebKitFormBoundaryudm7lpE3oJMs1sMc
Content-Disposition: form-data; name="Txt_Marche"

14
------WebKitFormBoundaryudm7lpE3oJMs1sMc
Content-Disposition: form-data; name="Hf_TargetId"

a
------WebKitFormBoundaryudm7lpE3oJMs1sMc
Content-Disposition: form-data; name="Txt_Marche"

14
------WebKitFormBoundaryudm7lpE3oJMs1sMc--


これが、原因でしょう。自信度 99.99% ぐらい。

■No97941 (WebSurfer さん) に返信
 
> 話が通じなくてラチがあかないので、ここまで書けばわかるだろうということを書いておきます。

> 上の aspx のコードの fd.append(...) のコメントアウトを解除して同じことを行うと name が
> Hf_TargetId および Txt_Marche の部分は以下のようにダブります。
> 
> 
> ------WebKitFormBoundaryudm7lpE3oJMs1sMc
> Content-Disposition: form-data; name="Hf_TargetId"
> 
> a
> ------WebKitFormBoundaryudm7lpE3oJMs1sMc
> Content-Disposition: form-data; name="Txt_Marche"
> 
> 14
> ------WebKitFormBoundaryudm7lpE3oJMs1sMc
> Content-Disposition: form-data; name="Hf_TargetId"
> 
> a
> ------WebKitFormBoundaryudm7lpE3oJMs1sMc
> Content-Disposition: form-data; name="Txt_Marche"
> 
> 14
> ------WebKitFormBoundaryudm7lpE3oJMs1sMc--
> 
> 
> これが、原因でしょう。自信度 99.99% ぐらい。


わざわざご丁寧にありがとうございます。
私がダウンロードしたFidderとは表示の仕方が違うみたいで、伝わりづらくなっていたみたいです。
すみません。

ほぼほぼWebSurferさんと同じでダブっていたのが原因なのかな？とは思っていました。
解決方法は探り中でしたが…。

今まではSite.Masterを使いasp:Contentのなかでデザインしていたため被っていてもnameがctl00$maincontents$Txt_Marche、
IDがTxt_Marchのため、Request.Parames("Txt_March")で取得していたので引っ掛からなかったみたいです。

とりあえず、今まで通りの方針を変更せずに進めたいと考えております。
今後の勉強としてWebSurferさんが提示して頂いたソースを元に勉強したいと思います。

ありがとうございました。