0

マウスEnterでラベルのタイトルを表示したいのですが、ajaxメソッドでタイトルテキストを取得したいと思います。私のHTMLコードは次のようなものです。

<div id="class">
     <label id="cost">@Html.DisplayFor(modelItem => item.PriceId)</label>
</div>

そしてこれは私のjqueryコードです：

$("#cost").live("mouseenter", function () {
    $.getJSON('/Price/AjaxGetByPriceId', { id: $(this).val() }, function (data) {
        for (i = 0; i <= data.length; i++) {
            $(this).attr("title", data[i].Url);
        }
    });
});

そして、これは私の価格コントローラーの私のコードです：

[HttpGet]
public ActionResult AjaxGetByPriceId(int id)
{
    var price = priceApp.GetByPriceId(id);

    return Json(price, JsonRequestBehavior.AllowGet);
}

ただし、マウスを入力した後、要求は送信されません。なにが問題ですか？

4

2 に答える 2

2

Html.DisplayFor()入力フィールドではなく、テキストを生成します。したがって、$(this).val()メソッドを使用するのではなく、$(this).html()代わりに使用する必要があります。また、コントローラーは整数パラメーターを想定しているため、このテキストが実際に整数を表していることを絶対に確認してください。そうしないと、コントローラー アクションがヒットせず、値を数値に解析できないというエラー メッセージが表示されます。また、AJAX 成功コールバック内thisでは、mouseenter コールバックで使用された要素を参照しなくなりました。再度使用したい場合は、クロージャーでキャプチャする必要があります。

$("#cost").live("mouseenter", function () {
    var $label = $(this);
    var id = $label.html();
    alert(id); // this should be a number

    $.getJSON('/Price/AjaxGetByPriceId', { id: id }, function (data) {
        for (i = 0; i <= data.length; i++) {
            $lavel.attr("title", data[i].Url);
        }
    });
});

また、.live 関数 (完全に廃止され、jQuery 1.9 では削除されています) を関数に置き換えることもお勧めします.on()。それに加えて、URL ヘルパーを使用してコントローラー アクションへの URL を生成することをお勧めします。

さらに別の発言: あなたが示した div が foreach ループにあるように見えます (ループの現在のアイテムであるmodelItem => item.PriceIdと仮定した場所で使用したラムダによってわかります)。itemしかし、ここでの問題は、同じ .xml を持つ DOM に複数の要素を含めることができないことですid。したがって、あなたが示したのは無効なマークアップです。class代わりにセレクターを使用できます。

<div>
     <label class="cost" data-url="@Url.Action("AjaxGetByPriceId, Price")">
         @Html.DisplayFor(modelItem => item.PriceId)
     </label>
</div>

その後：

$(document).on('mouseenter', '.cost', function () {
    var $label = $(this);
    var id = $label.html();
    var url = $label.data('url');
    $.getJSON(url, { id: id }, function (data) {
        for (i = 0; i <= data.length; i++) {
            $label.attr('title', data[i].Url);
        }
    });
});

また、AJAX コールバックでループしている理由がよくわかりません。

for (i = 0; i <= data.length; i++) {
    $label.attr('title', data[i].Url);
}

あなたのコントローラ アクションは、指定された ID を持つ対応するラベルのタイトルを返すはずではありませんか? そのほうが正しいでしょう。

于 2013-03-03T17:00:57.267 に答える
0

確かではありませんが、オプション内でthis使用する前にコンテキストを保存する価値があるかもしれません。もう要素を参照していない可能性があります。$(this).val()getJSONthis

の値を保存$(this).val()してからgetJSON.

于 2013-03-03T17:05:30.667 に答える