【解決方法】JavaScript で ajax を使用して別のビューにリダイレクトする

[ad_1]

私はJavascriptが初めてです。次のシナリオでサポートが必要です。

ビューには 2 つのドロップダウンと Anchor(a) 要素があります。このアンカー要素をクリックすると、別のビューにリダイレクトしたい (基本的に別のアクション関数を呼び出さなければならない) が、これら 2 つのドロップダウンで選択されている現在の値を渡す必要があります。つまり、別のアクション関数を呼び出して、ドロップダウンで選択した 2 つの現在の値を渡す必要があります。

私が試したこと：

次の Ajax コードを作成しましたが、常にエラー部分に移動します。

JavaScript

$.ajax({
    type: 'GET',
    url: Url.Action("ActionMethod", "MyController"),
    data: {
        param1: DD1Value,
        param2: DD2Value,
        param3: xyz
    },
    success: function (data) {
        window.location.href = data.redirecturl;
    },
    error: function () {
        alert('error happened');
    }
});

コントローラ：

[HttpGet]
public ActionResult ActionMethod(DateTime param1, DateTime param2, string param3)
{
//Do some work
//Return View
}

親切に助けてください。

解決策 2
解決策 1

解決策 2

これを試して..
インラインコメントに注意してください

JavaScript

function fungo() {
        var date = new Date(); // Javascript date object 
        var link = '@Url.Action("ActionMethod", "Home")';  // url should be enclosed by single quotes.
        var args = {
            param1: date.toISOString(),  // make sure that the date is in Javascript date object and converted to ISO string for proper casting in c#
            param2: date.toISOString(),
            param3: 'somevalue'
        }; 

        $.ajax({
            type: "GET",
            url: link, // url of your action
            data: args, // parameters if available 
            dataType: "json",
            success: function (data) {

                window.location.href = data.redirecturl; // your action should return an object having [redirecturl] property

            },
            error: function (httpRequest, textStatus, errorThrown) {  // detailed error messsage 
                alert("Error: " + textStatus + " " + errorThrown + " " + httpRequest);
            }
        });

    }

コントローラ：

[HttpGet]
    public ActionResult ActionMethod(DateTime param1, DateTime param2, string param3)
    {
        return Json(new { redirecturl = "http://www.codeproject.com/" }, JsonRequestBehavior.AllowGet);

    }

解決策 1

これを行うには、URL を作成してリダイレクトします。

HTML

<a href="#" id="mylink">Click</a>

<script type="text/javascript">
    $(document).ready(function () {
        $("#mylink").click(test);
    });

    function test() {
        var DD1Value = '2016-03-30 00:00:00';
        var DD2Value = '2016-04-01 00:00:00';
        var xyz = "Helllo world";

        var url = '@Url.Action("ActionMethod", "Home")';
        url += "?param1=" + escape(DD1Value);
        url += "&param2=" + escape(DD2Value);
        url += "&param3=" + escape(xyz);

        window.location.href = url;
    }
</script>

または、要素をフォームにラップして送信する

HTML

@using (Html.BeginForm("ActionMethod", "Home", FormMethod.Get, new { @id = "myform" }))
{
    <input type="text" name="param1" value="2016-03-30 00:00:00" />
    <input type="text" name="param2" value="2016-04-01 00:00:00" />
    <input type="text" name="param3" value="Hello world" />
}

<a href="#" id="mylink">Click</a>

<script type="text/javascript">
    $(document).ready(function () {
        $("#mylink").click(function () {
            $("#myform").submit();
        });
    });
</script>