0

Ajax.ActionLink次のように、HTML選択オプション内に埋め込もうとしています

<script src="@Url.Content("~/Scripts/MicrosoftAjax.js")" type="text/javascript"></script>
<script src="@Url.Content("~/Scripts/MicrosoftMvcAjax.js")" type="text/javascript"</script>

<select>
    <option>@Ajax.ActionLink("Opiton 1", "MyAction", new { parameter = "parm1" }, 
        new AjaxOptions { HttpMethod = "GET", InsertionMode = InsertionMode.Replace,             
        LoadingElementId = "myDiv" })</option>
    <option>@Ajax.ActionLink("Opiton 2", "MyAction", new { parameter = "parm1" }, 
        new AjaxOptions { HttpMethod = "GET", InsertionMode = InsertionMode.Replace,             
        LoadingElementId = "myDiv" })</option>
</select>

<div id="myDiv"></div>

アクションメソッド

public ActionResult MyAction(string parameter)
{
    ViewModel myViewModel = new ViewModel();

    myViewModel.Parm = parameter;

    if (Request.IsAjaxRequest())
    {
        return PartialView("_MyPartial", myViewModel);
    }
    else
    {
        return View(myViewModel);
    }
}

選択リストの外側に配置するAjax.ActionLinkと、正常に動作し、MyAction に直接移動します。選択リストのオプション内にリンクを埋め込むと、onlclick イベントが発生しません。

の中でonclickイベントを発生させるにはどうすればよい<option></option>ですか?

4

1 に答える 1

3

select 要素内に 2 つのアクション リンクがあるのはなぜですか。アクション メソッドを呼び出して、戻り値を div に設定する必要があると思います。これには Microsoft ajax ライブラリは使用しません。このようなきれいなコードを使用して手動で行います。(ページ内の jQuery ライブラリのみを参照する必要があります。他には何もありません)。

//include only jQuery library. Nothing else ! 

<select id="dropDown1">
   <option value="0"> Select</option>
   <option value="1"> Detroit</option>
   <option value="2"> Florida</option>
</select>

<script type="text/javascript">
 $(function(){
    $("#dropDown1").change(function(){   
       $.get("@Url.Action("MyAction", "MyController")",
                                 { "parameter" : $(this).val()},function(data){
            $("#myDiv").html(data);
        });
    });
 });
</script>

于 2012-06-06T17:39:00.473 に答える