0

@Url.Action で 2 つのパラメーターを渡したい。

意見：

 <select id="ddlSearchBy" name="ddlSearchBy" style="width: 150px">
      <option value="TaxCode">Tax Code</option>
      <option value="TaxDescription">Tax Description</option>
      <option value="ClassDescription">Class Description</option>
      <option value="ZoneName">Zone Name</option>
  </select>
  <input type="text" name="txtSearchValue" id="txtSearchValue"/>
  <button type="button" id="btnDownload">Download</button>
  <button type="button" id="btnSearch">Search</button>

[ダウンロード] ボタンをクリックすると、Masters Controller で "ExportToExcel" メソッドが呼び出されます。また、2 つのパラメーターを渡す必要があります。つまり、select html の選択された値と textbox の値です。

今、私は以下のように使用しています。

  <button type="button" id="btnDownload" onclick="location.href='@Url.Action("ExportToExcel", "Masters", new { ddlSearchBy = @TempData["ddlSearchBy"], txtSearchValue = @TempData["txtSearchValue"] })'">Download</button>

@Url.Action で html コントロールの値を直接渡すことはできますか?

編集:

コントローラ：

[HttpPost]
public ActionResult ExportToExcel(string ddlSearchBy, string txtSearchValue)
    {
        var grid = new GridView();

        grid.DataSource = from data in GetTaxMasterTable(ddlSearchBy, txtSearchValue)
                          select new
                              {
                                  Code = data.taxCode,
                                  TaxDescription = data.taxDescription,
                                  ClassDescription = data.classDescription,
                                  Location = data.locationShortName,
                                  Zone = data.zoneName,
                                  TaxValue = data.taxValue,
                                  Tax = data.taxPercentage,
                                  ModifiedDate = data.modifiedDate
                              };

        grid.DataBind();

        Response.ClearContent();
        Response.AddHeader("Content-Disposition", "attachment; filename = TaxMaster.xls");
        Response.ContentType = "application/vnd.ms-excel";
        StringWriter sw = new StringWriter();
        HtmlTextWriter htw = new HtmlTextWriter(sw);

        grid.RenderControl(htw);
        Response.Write(sw.ToString());
        Response.End();

        return RedirectToAction("TaxMaster");           
    }

jQuery:

$("#btnSubmitDownloadExcel").click(function (e) {
            var ddlSearchBy = $("#ddlSearchBy").val();
            var txtSearchValue = $("#txtSearchValue").val();
            $.ajax({
                type: "POST",
                url: "/Masters/ExportToExcel",
                data: JSON.stringify({ "ddlSearchBy": ddlSearchBy, "txtSearchValue": txtSearchValue }),
                contentType: "application/json; charset=utf-8",
                datatype: "json",
                success: function (data) {
                    alert(JSON.stringify(data));                        
                },
                error: function (data) {
                    alert("err");
                    alert(JSON.stringify(data));
                }
            });
        });

このコードは Excel をダウンロードしていません。

4

1 に答える 1

1

JavaScript に頼らずに、通常のハイパーリンク (Url.Action) を使用して入力要素から値を渡すことはできません。

ただし、GET メソッドを使用してフォームを使用することもできます。

<form action="Masters/ExportToExcel" method="get">
  <select id="ddlSearchBy" name="ddlSearchBy" style="width: 150px">
      <option value="TaxCode">Tax Code</option>
      <option value="TaxDescription">Tax Description</option>
      <option value="ClassDescription">Class Description</option>
      <option value="ZoneName">Zone Name</option>
  </select>
  <input type="text" name="txtSearchValue" id="txtSearchValue"/>
  <button type="submit" id="btnDownload">Download</button>
</form>

Html.BeginForm() ヘルパーを使用して、よりクリーンなコードのフォームを生成することもできますが、最終結果は同じです。

更新 - 別の送信アクションを含むフォームが既にある場合

IE 9 以下をサポートする必要がない場合は、このformaction属性を使用してボタンでフォームのアクションを変更できます。

例：

<form action="SomeController/Search" method="get">
      <select id="ddlSearchBy" name="ddlSearchBy" style="width: 150px">
          <option value="TaxCode">Tax Code</option>
          <option value="TaxDescription">Tax Description</option>
          <option value="ClassDescription">Class Description</option>
          <option value="ZoneName">Zone Name</option>
      </select>
      <input type="text" name="txtSearchValue" id="txtSearchValue"/>
      <button type="submit" id="btnSearch">Search</button>
      <button type="submit" id="btnDownload" formaction="Masters/ExportToExcel">Download</button>
    </form>

この例では、btnSearch ボタンをクリックすると、フォームはデフォルトで SomeController/Search で get を実行します。ただし、btnDownload ボタンをクリックすると、フォームは Masters/ExportToExcel に対して get 要求を行います。

バージョン 10 未満の IE をサポートする必要がある場合は、フォームを送信する前に、javascript を使用してフォームのアクションを変更する必要があります。

jQuery を使用した例:

<form action="SomeController/Search" method="get">
          <select id="ddlSearchBy" name="ddlSearchBy" style="width: 150px">
              <option value="TaxCode">Tax Code</option>
              <option value="TaxDescription">Tax Description</option>
              <option value="ClassDescription">Class Description</option>
              <option value="ZoneName">Zone Name</option>
          </select>
          <input type="text" name="txtSearchValue" id="txtSearchValue"/>
          <button type="submit" id="btnSearch" onclick="$(this).closest('form').attr('action','SomeController/Search');">Search</button>
          <button type="submit" id="btnDownload" onclick="$(this).closest('form').attr('action','Masters/ExportToExcel');">Download</button>
        </form>
于 2015-11-04T10:39:47.587 に答える